phx-react
Version:
PHX REACT
98 lines • 7.63 kB
JavaScript
"use strict";
exports.__esModule = true;
exports.PHXLoginSsoV3 = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var js_cookie_1 = tslib_1.__importDefault(require("js-cookie"));
var Skeleton_1 = require("../Skeleton");
var Button_1 = require("../Button");
var Banner_1 = require("../Banner");
var read_env_config_1 = require("../../read-env-config");
var constants_1 = require("../../utils/constants");
var saveCookiesClient_1 = tslib_1.__importDefault(require("../Func/saveCookiesClient"));
var PHXLoginSsoV3 = function (props) {
var onClick = props.onClick, banner = props.banner, dataSession = props.dataSession, router = props.router, redirectPath = props.redirectPath, logo = props.logo;
var schoolLogo = (0, read_env_config_1.getEnv)('NEXT_PUBLIC_ENV_LOGIN_LOGO', process.env.NEXT_PUBLIC_ENV_LOGIN_LOGO);
var _a = (0, react_1.useState)(false), loading = _a[0], setLoading = _a[1];
var _b = (0, react_1.useState)(false), error = _b[0], setError = _b[1];
var dataLogin = typeof window !== 'undefined' ? localStorage.getItem(constants_1.isLoggedCookie) : null;
var authToken = js_cookie_1["default"].get(constants_1.AUTH_TOKEN);
var handlerOnClick = function () {
setLoading(true);
onClick();
};
var handlerSaveCookies = function (session) { return tslib_1.__awaiter(void 0, void 0, void 0, function () {
var token, userInfo, valueAuthen, valueIsLogin;
var _a;
return tslib_1.__generator(this, function (_b) {
switch (_b.label) {
case 0:
token = session.data.token;
userInfo = token.userInfo;
if (!(userInfo && ((_a = userInfo === null || userInfo === void 0 ? void 0 : userInfo.roles) === null || _a === void 0 ? void 0 : _a[0].role_code))) return [3 /*break*/, 2];
valueAuthen = JSON.stringify(token);
(0, saveCookiesClient_1["default"])(constants_1.AUTH_TOKEN, valueAuthen, true);
valueIsLogin = JSON.stringify(userInfo);
localStorage.setItem(constants_1.isLoggedCookie, valueIsLogin);
return [4 /*yield*/, dataSession.update({ name: null })];
case 1:
_b.sent();
router === null || router === void 0 ? void 0 : router.push(redirectPath);
return [3 /*break*/, 3];
case 2:
setError(true);
setLoading(false);
_b.label = 3;
case 3: return [2 /*return*/];
}
});
}); };
var handlerCheckLogin = function () {
var _a, _b;
if (!dataLogin || !authToken) {
if (dataSession.status === constants_1.AUTHENTICATED && ((_b = (_a = dataSession === null || dataSession === void 0 ? void 0 : dataSession.data) === null || _a === void 0 ? void 0 : _a.session.user) === null || _b === void 0 ? void 0 : _b.name)) {
setLoading(true);
handlerSaveCookies(dataSession);
}
else if (dataSession.status === 'loading') {
setLoading(true);
}
else {
setLoading(false);
}
}
else {
router === null || router === void 0 ? void 0 : router.push(redirectPath);
}
};
(0, react_1.useEffect)(function () {
js_cookie_1["default"].remove(constants_1.isLoggedCookie);
handlerCheckLogin();
}, [dataSession]);
return (react_1["default"].createElement(react_1["default"].Fragment, null,
react_1["default"].createElement("main", { className: 'flex min-h-full' },
react_1["default"].createElement("div", { className: 'm-auto flex h-[100vh] max-w-[100vw] flex-1 justify-center' },
react_1["default"].createElement("div", { className: 'flex flex-1 flex-col justify-center px-4 py-12 sm:px-6 lg:flex-none lg:px-20 xl:px-24' },
react_1["default"].createElement("div", { className: 'lg:w-76 w-full xl:w-96' },
react_1["default"].createElement("div", { className: 'flex flex-col' },
react_1["default"].createElement("img", { className: 'max-w-[240px] mb-3', src: logo !== null && logo !== void 0 ? logo : "".concat(schoolLogo), alt: 'logo' })),
react_1["default"].createElement("div", { className: 'mt-5' },
react_1["default"].createElement("div", { className: 'space-y-6' }, dataSession.status === 'loading' ? (react_1["default"].createElement(Skeleton_1.PHXSkeleton, { className: 'w-full', size: 'extra-large', type: 'only-header' })) : (react_1["default"].createElement(Button_1.PHXButton, { loading: loading, disabled: loading, onClick: function () { return handlerOnClick(); }, className: 'flex w-full justify-center items-center', primary: true, submit: true, size: 'medium' },
react_1["default"].createElement("div", { className: 'flex gap-2 items-center' },
react_1["default"].createElement("svg", { xmlns: 'http://www.w3.org/2000/svg', width: '14', height: '14', viewBox: '0 0 24 24', fill: 'none' },
react_1["default"].createElement("g", { clipPath: 'url(#clip0_1739_10008)' },
react_1["default"].createElement("path", { d: 'M12.75 11.25L24 11.25V0.75C24 0.336 23.664 0 23.25 0L12.75 0L12.75 11.25Z', fill: 'white' }),
react_1["default"].createElement("path", { d: 'M11.25 11.25L11.25 0L0.75 0C0.336 0 0 0.336 0 0.75L0 11.25L11.25 11.25Z', fill: 'white' }),
react_1["default"].createElement("path", { d: 'M11.25 12.75L0 12.75L0 23.25C0 23.664 0.336 24 0.75 24H11.25L11.25 12.75Z', fill: 'white' }),
react_1["default"].createElement("path", { d: 'M12.75 12.75L12.75 24H23.25C23.664 24 24 23.664 24 23.25V12.75L12.75 12.75Z', fill: 'white' })),
react_1["default"].createElement("defs", null,
react_1["default"].createElement("clipPath", { id: 'clip0_1739_10008' },
react_1["default"].createElement("rect", { width: '24', height: '24', fill: 'white' })))),
"\u0110\u0103ng nh\u1EADp b\u1EB1ng Microsoft")))),
react_1["default"].createElement(Banner_1.PHXBanner, { className: 'mt-3', onClose: function () { return setError(!error); }, description: 'T\u00E0i kho\u1EA3n n\u00E0y ch\u01B0a \u0111\u01B0\u1EE3c \u0111\u0103ng k\u00FD tr\u00EAn h\u1EC7 th\u00F4ng vui l\u00F2ng li\u00EAn h\u1EC7 qu\u1EA3n tr\u1ECB vi\u00EAn \u0111\u1EC3 ti\u1EBFp t\u1EE5c.', show: error, title: 'Th\u00F4ng b\u00E1o', type: 'warning' })))),
react_1["default"].createElement("div", { className: 'relative hidden w-0 flex-1 lg:block lg:w-full' },
react_1["default"].createElement("img", { className: 'absolute inset-0 h-full w-full object-cover', src: banner !== null && banner !== void 0 ? banner : 'https://images.unsplash.com/photo-1496917756835-20cb06e75b4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1908&q=80', alt: 'banner' }))))));
};
exports.PHXLoginSsoV3 = PHXLoginSsoV3;
exports["default"] = exports.PHXLoginSsoV3;
//# sourceMappingURL=login-sso-v3.js.map