@roam-garden/landscaping-toolbox
Version:
Common UI things for Roam Garden management
98 lines • 3.79 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.useGetUser = exports.withAuth = exports.signUpWithUsernameFields = void 0;
const ui_react_1 = require("@aws-amplify/ui-react");
const react_1 = __importStar(require("react"));
const ui_components_1 = require("@aws-amplify/ui-components");
const aws_amplify_1 = require("aws-amplify");
exports.signUpWithUsernameFields = [
{
type: 'username',
label: 'Username (your garden address will be based on it) *',
// inputProps: {
// pattern: "[A-Za-z]{3}",
// maxLength: 40
// type: 'date',
// }
},
{ type: 'password' },
{ type: 'email' },
];
/**
* Mostly replicating withAuthenticator from amplify lib, but with custom fields.
* Haven't found an easier way. If I just wrap component - something weird happens to styling
*/
function withAuth(Component, authenticatorProps) {
const AppWithAuthenticator = props => {
const [signedIn, setSignedIn] = react_1.useState(false);
react_1.default.useEffect(() => {
// checkUser returns an "unsubscribe" function to stop side-effects
return checkUser();
}, []);
function checkUser() {
setUser();
return ui_components_1.onAuthUIStateChange(authState => {
if (authState === ui_components_1.AuthState.SignedIn) {
setSignedIn(true);
}
else if (authState === ui_components_1.AuthState.SignedOut) {
setSignedIn(false);
}
});
}
async function setUser() {
try {
const user = await aws_amplify_1.Auth.currentAuthenticatedUser();
if (user)
setSignedIn(true);
}
catch (err) {
console.log(err);
}
}
if (!signedIn) {
return (react_1.default.createElement(ui_react_1.AmplifyContainer, null,
react_1.default.createElement(ui_react_1.AmplifyAuthenticator, Object.assign({}, authenticatorProps, props),
react_1.default.createElement(ui_react_1.AmplifySignUp, { slot: "sign-up", formFields: exports.signUpWithUsernameFields }))));
}
return react_1.default.createElement(Component, null);
};
return AppWithAuthenticator;
}
exports.withAuth = withAuth;
function useGetUser() {
const [user, setUser] = react_1.useState("");
react_1.useEffect(() => {
(async () => {
try {
const user = await aws_amplify_1.Auth.currentAuthenticatedUser();
setUser(user.getUsername());
}
catch (e) {
console.log("Can't fetch user", e);
}
})();
}, []);
return user;
}
exports.useGetUser = useGetUser;
//# sourceMappingURL=index.js.map