phx-uikit 1.0.255 → 1.0.257

package/dist/cjs/components/MainWrapV3/MainWrapV3.js

@@ -1,5 +1,5 @@
 "use strict";
-exports.__esModule = true;
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.PHXMainWrapV3 = void 0;
 var tslib_1 = require("tslib");
 var free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
@@ -52,18 +52,19 @@ var PHXMainWrapV3 = function (_a) {
     var _r = (0, react_2.useState)(false), modalSignOut = _r[0], setModalSignOut = _r[1];
     var _s = (0, react_2.useState)(true), showBanner = _s[0], setShowBanner = _s[1];
     var _t = (0, react_2.useState)(true), isLoading = _t[0], setIsLoading = _t[1];
-    var sessionCookie = (0, react_2.useRef)((0, getCookieSession_1["default"])());
+    var sessionCookie = (0, react_2.useRef)((0, getCookieSession_1.default)());
     var userSessionInfo = (_b = sessionCookie.current) === null || _b === void 0 ? void 0 : _b.user_info;
     var schoolInfoId = userSessionInfo === null || userSessionInfo === void 0 ? void 0 : userSessionInfo.school_id;
     var userId = userSessionInfo === null || userSessionInfo === void 0 ? void 0 : userSessionInfo.id;
     var setGlobalLoading = (0, LoadingProvider_1.useLoading)().setLoading;
     var _u = (0, react_2.useState)({
+        menuDefault: [],
         loadingMenu: true,
         loadingSchool: true,
         listSchool: [],
         logo: {
             path: '',
-            height: logoHeight
+            height: logoHeight,
         },
         menu: [],
         schoolId: null,
@@ -71,7 +72,7 @@ var PHXMainWrapV3 = function (_a) {
         perCode: [],
         roleCode: [],
         isLoadingPermission: true,
-        sourceAvatar: ((_c = userSessionInfo === null || userSessionInfo === void 0 ? void 0 : userSessionInfo.user_avatar) === null || _c === void 0 ? void 0 : _c.size_small) || (userSessionInfo === null || userSessionInfo === void 0 ? void 0 : userSessionInfo.avatar) || constants_1.DEFAULT_AVATAR
+        sourceAvatar: ((_c = userSessionInfo === null || userSessionInfo === void 0 ? void 0 : userSessionInfo.user_avatar) === null || _c === void 0 ? void 0 : _c.size_small) || (userSessionInfo === null || userSessionInfo === void 0 ? void 0 : userSessionInfo.avatar) || constants_1.DEFAULT_AVATAR,
     }), dataInitMain = _u[0], setDataInitMain = _u[1];
     var locationPathname = typeof window !== 'undefined' ? window.location.pathname : '';
     var locationArr = locationPathname.split('/').filter(Boolean);
@@ -108,7 +109,7 @@ var PHXMainWrapV3 = function (_a) {
         return lastMatchingCode ? lastMatchingCode : null;
     }
     // code phân quyền path hiện tại
-    var currentCode = getCodesByPath(navigation, locationPathname);
+    var currentCode = getCodesByPath(dataInitMain.menuDefault, locationPathname);
     var requireLoginValidation = function () {
         (0, sessionStore_1.clearSession)();
         var currentURL = window.location.href;
@@ -124,8 +125,8 @@ var PHXMainWrapV3 = function (_a) {
             var teacherIsQuitJob = profileTeacher === null || profileTeacher === void 0 ? void 0 : profileTeacher.is_quit_job;
             if (staffIsQuitJob || teacherIsQuitJob) {
                 console.log('Phiên đăng nhập đã hết hạn');
-                Object.keys(js_cookie_1["default"].get()).forEach(function (cookieName) {
-                    js_cookie_1["default"].remove(cookieName);
+                Object.keys(js_cookie_1.default.get()).forEach(function (cookieName) {
+                    js_cookie_1.default.remove(cookieName);
                 });
                 requireLoginValidation();
             }
@@ -141,9 +142,9 @@ var PHXMainWrapV3 = function (_a) {
             switch (_e.label) {
                 case 0:
                     _e.trys.push([0, 2, , 3]);
-                    return [4 /*yield*/, (0, clientQueryV3_1["default"])({
+                    return [4 /*yield*/, (0, clientQueryV3_1.default)({
                             query: query_1.GET_PERMISSION_DETAIL_USER_V3,
-                            variables: { id: userId, school_id: schoolInfoId }
+                            variables: { id: userId, school_id: schoolInfoId },
                         })];
                 case 1:
                     res = _e.sent();
@@ -170,11 +171,11 @@ var PHXMainWrapV3 = function (_a) {
             switch (_a.label) {
                 case 0:
                     _a.trys.push([0, 2, , 3]);
-                    return [4 /*yield*/, (0, clientQueryV3_1["default"])({
+                    return [4 /*yield*/, (0, clientQueryV3_1.default)({
                             query: query_1.QUERY_GET_PROFILE_USER,
                             variables: {
-                                user_id: userId
-                            }
+                                user_id: userId,
+                            },
                         })];
                 case 1:
                     response = _a.sent();
@@ -183,7 +184,7 @@ var PHXMainWrapV3 = function (_a) {
                     // check user is quit job
                     checkIsQuitJob({
                         profileStaff: profile_staff,
-                        profileTeacher: profile_teacher
+                        profileTeacher: profile_teacher,
                     });
                     // renew list role in cookie
                     return [2 /*return*/, {
@@ -192,7 +193,7 @@ var PHXMainWrapV3 = function (_a) {
                             full_name: full_name,
                             email: email,
                             user_code: (profile_staff === null || profile_staff === void 0 ? void 0 : profile_staff.user_code) || (profile_teacher === null || profile_teacher === void 0 ? void 0 : profile_teacher.user_code) || '',
-                            user_roles: user_roles
+                            user_roles: user_roles,
                         }];
                 case 2:
                     error_2 = _a.sent();
@@ -216,10 +217,10 @@ var PHXMainWrapV3 = function (_a) {
                     _f.label = 1;
                 case 1:
                     _f.trys.push([1, 3, , 4]);
-                    return [4 /*yield*/, (0, clientQueryV3_1["default"])({
+                    return [4 /*yield*/, (0, clientQueryV3_1.default)({
                             query: query_1.GET_SCHOOL_V3,
                             variables: { group_id: group_id, school_name_id: school_name_id, user_id: id },
-                            isDelay: false
+                            isDelay: false,
                         })];
                 case 2:
                     res = _f.sent();
@@ -234,7 +235,7 @@ var PHXMainWrapV3 = function (_a) {
                             settingSiteDb: settingSiteDb,
                             loadingSchool: dataSchool.length === 0,
                             listSchool: dataSchool,
-                            schoolId: school_id
+                            schoolId: school_id,
                         }];
                 case 3:
                     error_3 = _f.sent();
@@ -249,11 +250,10 @@ var PHXMainWrapV3 = function (_a) {
         var envPublic, menuUrl, logoMenuTop, data, menuJson;
         return tslib_1.__generator(this, function (_a) {
             switch (_a.label) {
-                case 0: return [4 /*yield*/, (0, getEnvPublic_1["default"])()];
+                case 0: return [4 /*yield*/, (0, getEnvPublic_1.default)()];
                 case 1:
                     envPublic = _a.sent();
-                    menuUrl = "".concat(envPublic === null || envPublic === void 0 ? void 0 : envPublic.SCHOOL_MENU, "&time=").concat(new Date().getMilliseconds()) // disable cache call menu
-                    ;
+                    menuUrl = envPublic === null || envPublic === void 0 ? void 0 : envPublic.SCHOOL_MENU_V2;
                     logoMenuTop = envPublic === null || envPublic === void 0 ? void 0 : envPublic.SCHOOL_TOP_MENU_LOGO;
                     if (!menuUrl || !logoMenuTop) {
                         console.error('menu or logo not found');
@@ -267,13 +267,58 @@ var PHXMainWrapV3 = function (_a) {
                     return [2 /*return*/, {
                             loadingMenu: false,
                             logo: { path: logoMenuTop, height: logoHeight },
-                            menu: menuJson
+                            menu: menuJson,
                         }];
             }
         });
     }); };
+    var detectEnvByDomain = function (domain, configEnv) {
+        for (var _i = 0, _a = Object.entries(configEnv); _i < _a.length; _i++) {
+            var _b = _a[_i], env = _b[0], pattern = _b[1];
+            if (env.startsWith('_comment'))
+                continue; // bỏ qua comment
+            var regex = new RegExp(pattern.replace(/\\\\/g, '\\'));
+            if (regex.test(domain))
+                return env;
+        }
+        return 'stg';
+    };
+    var getEnvByConfig = function (configEnv) {
+        var domain = window.location.hostname;
+        var env = detectEnvByDomain(domain, configEnv);
+        return "config_menu_".concat(env, ":disable");
+    };
+    var isConfigEnvValid = function (code, configDisable) {
+        return configDisable.length === 0 || !(configDisable === null || configDisable === void 0 ? void 0 : configDisable.includes(code));
+    };
+    var funcMenuByConfigEnv = function (menuJson, configDisable) {
+        var menuWithConfigEnv = [];
+        for (var _i = 0, menuJson_1 = menuJson; _i < menuJson_1.length; _i++) {
+            var item = menuJson_1[_i];
+            if (!isConfigEnvValid(item === null || item === void 0 ? void 0 : item.code, configDisable))
+                continue;
+            var menuItem = tslib_1.__assign(tslib_1.__assign({}, item), { child: [] });
+            var menuSecondLevel = (item === null || item === void 0 ? void 0 : item.child) || [];
+            for (var _a = 0, _b = menuSecondLevel || []; _a < _b.length; _a++) {
+                var childItem = _b[_a];
+                if (!isConfigEnvValid(childItem === null || childItem === void 0 ? void 0 : childItem.code, configDisable))
+                    continue;
+                var childMenuItem = tslib_1.__assign(tslib_1.__assign({}, childItem), { child: [] });
+                var menuThirdLevel = (childItem === null || childItem === void 0 ? void 0 : childItem.child) || [];
+                for (var _c = 0, menuThirdLevel_1 = menuThirdLevel; _c < menuThirdLevel_1.length; _c++) {
+                    var subChildItem = menuThirdLevel_1[_c];
+                    if (!isConfigEnvValid(subChildItem === null || subChildItem === void 0 ? void 0 : subChildItem.code, configDisable))
+                        continue;
+                    childMenuItem.child.push(subChildItem);
+                }
+                menuItem.child.push(childMenuItem);
+            }
+            menuWithConfigEnv.push(menuItem);
+        }
+        return menuWithConfigEnv;
+    };
     var fetchInitData = function () { return tslib_1.__awaiter(void 0, void 0, void 0, function () {
-        var _a, loadingMenu, logo, menu, profileNew, dataPer, dataSchool, actionPermissionMap, uniqueRoutePermissions, currentSession;
+        var _a, loadingMenu, logo, menu, profileNew, dataPer, dataSchool, actionPermissionMap, uniqueRoutePermissions, config_env, enviromentByDomainConfig, menuJson, configDisable, currentSession;
         var _b;
         return tslib_1.__generator(this, function (_c) {
             switch (_c.label) {
@@ -290,9 +335,14 @@ var PHXMainWrapV3 = function (_a) {
                 case 4:
                     dataSchool = _c.sent();
                     actionPermissionMap = dataPer.actionPermissionMap, uniqueRoutePermissions = dataPer.uniqueRoutePermissions;
+                    config_env = menu.config_env;
+                    enviromentByDomainConfig = getEnvByConfig(config_env);
+                    menuJson = menu.menu;
+                    configDisable = menu[enviromentByDomainConfig];
                     setDataInitMain({
+                        menuDefault: menuJson,
                         logo: logo,
-                        menu: menu,
+                        menu: funcMenuByConfigEnv(menuJson, configDisable),
                         loadingMenu: loadingMenu,
                         schoolId: (dataSchool === null || dataSchool === void 0 ? void 0 : dataSchool.schoolId) || null,
                         loadingSchool: !!(dataSchool === null || dataSchool === void 0 ? void 0 : dataSchool.loadingSchool),
@@ -301,15 +351,15 @@ var PHXMainWrapV3 = function (_a) {
                         perCode: uniqueRoutePermissions,
                         roleCode: (profileNew === null || profileNew === void 0 ? void 0 : profileNew.user_roles.map(function (userRole) { var _a; return (_a = userRole === null || userRole === void 0 ? void 0 : userRole.role) === null || _a === void 0 ? void 0 : _a.role_code; })) || [],
                         configLayout: (dataSchool === null || dataSchool === void 0 ? void 0 : dataSchool.settingSiteDb) || undefined,
-                        sourceAvatar: ((_b = profileNew === null || profileNew === void 0 ? void 0 : profileNew.user_avatar) === null || _b === void 0 ? void 0 : _b.size_small) || (profileNew === null || profileNew === void 0 ? void 0 : profileNew.avatar) || constants_1.DEFAULT_AVATAR
+                        sourceAvatar: ((_b = profileNew === null || profileNew === void 0 ? void 0 : profileNew.user_avatar) === null || _b === void 0 ? void 0 : _b.size_small) || (profileNew === null || profileNew === void 0 ? void 0 : profileNew.avatar) || constants_1.DEFAULT_AVATAR,
                     });
-                    currentSession = (0, getCookieSession_1["default"])();
-                    (0, saveCookiesClient_1["default"])({
+                    currentSession = (0, getCookieSession_1.default)();
+                    (0, saveCookiesClient_1.default)({
                         value: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, currentSession), (actionPermissionMap && {
-                            action_permission: actionPermissionMap || []
+                            action_permission: actionPermissionMap || [],
                         })), { setting_site: (dataSchool === null || dataSchool === void 0 ? void 0 : dataSchool.settingSiteDb) || {} }), (profileNew && {
-                            user_info: tslib_1.__assign(tslib_1.__assign({}, userSessionInfo), profileNew)
-                        }))
+                            user_info: tslib_1.__assign(tslib_1.__assign({}, userSessionInfo), profileNew),
+                        })),
                     });
                     return [2 /*return*/];
             }
@@ -462,14 +512,14 @@ var PHXMainWrapV3 = function (_a) {
         var isAdmissions = checkAdmissions(pathNameWithBasePath);
         if (isAdmissions && checkChildrenCampaign(pathNameWithBasePath)) {
             if (pathNameWithBasePath.includes('/admissions/overview/list/') && pid) {
-                (0, clientQueryV3_1["default"])({
+                (0, clientQueryV3_1.default)({
                     query: query_1.getCampaignNameV3,
                     variables: { id: pid },
-                    isDelay: false
+                    isDelay: false,
                 }).then(function (res) {
                     var data = res.data.admissions_campaigns_by_pk;
                     setCampaignName(data.campaign_name);
-                    js_cookie_1["default"].set('campaign_name', JSON.stringify(data.campaign_name));
+                    js_cookie_1.default.set('campaign_name', JSON.stringify(data.campaign_name));
                 });
                 loadChildrenCampaign(pathNameWithBasePath);
             }
@@ -493,7 +543,7 @@ var PHXMainWrapV3 = function (_a) {
             }
             else {
                 setOpenSubMenu(true);
-                var campaign_name = js_cookie_1["default"].get('campaign_name');
+                var campaign_name = js_cookie_1.default.get('campaign_name');
                 setCampaignName(campaign_name ? JSON.parse(campaign_name) : campaignName);
                 loadChildrenCampaign(pathNameWithBasePath);
             }
@@ -557,8 +607,8 @@ var PHXMainWrapV3 = function (_a) {
             switch (_a.label) {
                 case 0:
                     _a.trys.push([0, 2, , 3]);
-                    return [4 /*yield*/, axios_1["default"].post("/api/authenticate/logout", {}, {
-                            withCredentials: true
+                    return [4 /*yield*/, axios_1.default.post("/api/authenticate/logout", {}, {
+                            withCredentials: true,
                         })];
                 case 1: return [2 /*return*/, _a.sent()];
                 case 2:
@@ -574,8 +624,8 @@ var PHXMainWrapV3 = function (_a) {
             switch (_a.label) {
                 case 0:
                     setModalSignOut(false);
-                    Object.keys(js_cookie_1["default"].get()).forEach(function (cookieName) {
-                        js_cookie_1["default"].remove(cookieName);
+                    Object.keys(js_cookie_1.default.get()).forEach(function (cookieName) {
+                        js_cookie_1.default.remove(cookieName);
                     });
                     return [4 /*yield*/, callApiLogoutToken()];
                 case 1:
@@ -605,17 +655,18 @@ var PHXMainWrapV3 = function (_a) {
         setSelected(id);
     };
     var handlePrimaryModal = function () {
-        if (userSessionInfo) {
+        var currentSession = (0, getCookieSession_1.default)();
+        var userInfo = currentSession === null || currentSession === void 0 ? void 0 : currentSession.user_info;
+        if (userInfo) {
             try {
                 var newSchoolId = selected;
-                var schoolIdCurrent = userSessionInfo.school_id;
+                var schoolIdCurrent = userInfo.school_id;
                 if (newSchoolId && newSchoolId !== schoolIdCurrent) {
-                    var userInfoNew = tslib_1.__assign(tslib_1.__assign({}, userSessionInfo), { school_id: newSchoolId });
-                    var currentSession = (0, getCookieSession_1["default"])();
-                    (0, saveCookiesClient_1["default"])({
-                        value: tslib_1.__assign(tslib_1.__assign({}, currentSession), { user_info: userInfoNew })
+                    var userInfoNew = tslib_1.__assign(tslib_1.__assign({}, userInfo), { school_id: newSchoolId });
+                    (0, saveCookiesClient_1.default)({
+                        value: tslib_1.__assign(tslib_1.__assign({}, currentSession), { user_info: userInfoNew }),
                     });
-                    window.location.replace(constants_1.ROUTE_DASHBOARD);
+                    window.location.reload();
                 }
             }
             catch (error) {
@@ -649,32 +700,32 @@ var PHXMainWrapV3 = function (_a) {
             setActivityHistoryChild([]);
         }
     }, [pathNameWithBasePath, basePath]);
-    return (react_2["default"].createElement(react_2["default"].Fragment, null,
-        react_2["default"].createElement(page_tracker_1.PageTracker, null),
-        react_2["default"].createElement("div", { className: 'flex min-h-full flex-col' },
-            react_2["default"].createElement(appearance_styled_1["default"], { configLayout: dataInitMain === null || dataInitMain === void 0 ? void 0 : dataInitMain.configLayout, settingSiteCookie: getDataCookies ? (_e = (0, helpers_1.decryptCookie)(getDataCookies)) === null || _e === void 0 ? void 0 : _e.setting_site : null }),
-            react_2["default"].createElement("header", { className: 'header-color-styled fixed top-0 z-50 min-w-full border-gray-200 bg-white' },
-                react_2["default"].createElement("div", { className: 'header-styled mx-auto flex h-14 items-center justify-between bg-[#1a1a1a] pr-4' },
-                    react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                        react_2["default"].createElement("a", { className: 'flex w-full items-center', href: '/' }, topMenuLogoFromEnv ? (react_2["default"].createElement(react_2["default"].Fragment, null, isLoading ? (react_2["default"].createElement("div", { className: 'header-loading-logo ml-3 h-8 w-full animate-pulse' })) : (react_2["default"].createElement("img", { alt: 'Logo', className: 'ml-3 h-auto max-w-48 w-auto max-h-7', src: checkLogoHeader, style: { maxWidth: '12rem' } })))) : (react_2["default"].createElement(react_2["default"].Fragment, null))),
-                        react_2["default"].createElement("div", { className: 'flex items-center lg:hidden' },
-                            react_2["default"].createElement("button", { className: 'bg-grey-100 mr-3 inline-flex items-center justify-center rounded-md p-1 text-gray-200 hover:bg-white hover:text-gray-600', onClick: function () { return setSidebarOpen(true); }, type: 'button' },
-                                react_2["default"].createElement("span", { className: 'sr-only' }, "Open sidebar"),
-                                react_2["default"].createElement(outline_1.Bars3Icon, { "aria-hidden": 'true', className: 'h-6 w-6' })))),
-                    react_2["default"].createElement(search_bar_1["default"], { onClose: function () { return setShowSearchBar(false); }, open: showSearchBar }),
-                    react_2["default"].createElement("div", { className: 'flex items-center gap-x-8' },
-                        react_2["default"].createElement("div", { className: '-m-1.5 p-1.5' },
-                            react_2["default"].createElement(react_1.Menu, { as: 'div', className: 'relative ml-3' },
-                                react_2["default"].createElement("div", null,
-                                    react_2["default"].createElement(react_1.Menu.Button, { className: 'flex max-w-xs items-center rounded-full bg-gray-800 text-sm focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-gray-800' },
-                                        react_2["default"].createElement("span", { className: 'sr-only' }, "Open user menu"),
-                                        isLoading ? (react_2["default"].createElement("div", { className: 'flex animate-pulse' },
-                                            react_2["default"].createElement("div", { className: 'header-loading-avatar h-8 w-8 rounded-full' }))) : (react_2["default"].createElement("img", { alt: '', className: 'h-8 w-8 rounded-full', src: dataInitMain.sourceAvatar })))),
-                                react_2["default"].createElement(react_1.Transition, { as: react_2.Fragment, enter: 'transition ease-out duration-100', enterFrom: 'transform opacity-0 scale-95', enterTo: 'transform opacity-100 scale-100', leave: 'transition ease-in duration-75', leaveFrom: 'transform opacity-100 scale-100', leaveTo: 'transform opacity-0 scale-95' },
-                                    react_2["default"].createElement(react_1.Menu.Items, { className: ' absolute right-0 z-10 mt-2 w-[340px] origin-top-right rounded-md bg-white px-2 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none' },
-                                        react_2["default"].createElement(react_1.Menu.Item, null,
-                                            react_2["default"].createElement("div", { "aria-hidden": true, className: 'px-2 pb-2 pt-4 text-sm font-semibold text-gray-900 ' }, "Ch\u1ECDn tr\u01B0\u1EDDng")),
-                                        !dataInitMain.loadingSchool ? (react_2["default"].createElement(react_2["default"].Fragment, null, dataInitMain.listSchool
+    return (react_2.default.createElement(react_2.default.Fragment, null,
+        react_2.default.createElement(page_tracker_1.PageTracker, null),
+        react_2.default.createElement("div", { className: 'flex min-h-full flex-col' },
+            react_2.default.createElement(appearance_styled_1.default, { configLayout: dataInitMain === null || dataInitMain === void 0 ? void 0 : dataInitMain.configLayout, settingSiteCookie: getDataCookies ? (_e = (0, helpers_1.decryptCookie)(getDataCookies)) === null || _e === void 0 ? void 0 : _e.setting_site : null }),
+            react_2.default.createElement("header", { className: 'header-color-styled fixed top-0 z-50 min-w-full border-gray-200 bg-white' },
+                react_2.default.createElement("div", { className: 'header-styled mx-auto flex h-14 items-center justify-between bg-[#1a1a1a] pr-4' },
+                    react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                        react_2.default.createElement("a", { className: 'flex w-full items-center', href: '/' }, topMenuLogoFromEnv ? (react_2.default.createElement(react_2.default.Fragment, null, isLoading ? (react_2.default.createElement("div", { className: 'header-loading-logo ml-3 h-8 w-full animate-pulse' })) : (react_2.default.createElement("img", { alt: 'Logo', className: 'max-w-48 ml-3 h-auto max-h-7 w-auto', src: checkLogoHeader, style: { maxWidth: '12rem' } })))) : (react_2.default.createElement(react_2.default.Fragment, null))),
+                        react_2.default.createElement("div", { className: 'flex items-center lg:hidden' },
+                            react_2.default.createElement("button", { className: 'bg-grey-100 mr-3 inline-flex items-center justify-center rounded-md p-1 text-gray-200 hover:bg-white hover:text-gray-600', onClick: function () { return setSidebarOpen(true); }, type: 'button' },
+                                react_2.default.createElement("span", { className: 'sr-only' }, "Open sidebar"),
+                                react_2.default.createElement(outline_1.Bars3Icon, { "aria-hidden": 'true', className: 'h-6 w-6' })))),
+                    react_2.default.createElement(search_bar_1.default, { onClose: function () { return setShowSearchBar(false); }, open: showSearchBar }),
+                    react_2.default.createElement("div", { className: 'flex items-center gap-x-8' },
+                        react_2.default.createElement("div", { className: '-m-1.5 p-1.5' },
+                            react_2.default.createElement(react_1.Menu, { as: 'div', className: 'relative ml-3' },
+                                react_2.default.createElement("div", null,
+                                    react_2.default.createElement(react_1.Menu.Button, { className: 'flex max-w-xs items-center rounded-full bg-gray-800 text-sm focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-gray-800' },
+                                        react_2.default.createElement("span", { className: 'sr-only' }, "Open user menu"),
+                                        isLoading ? (react_2.default.createElement("div", { className: 'flex animate-pulse' },
+                                            react_2.default.createElement("div", { className: 'header-loading-avatar h-8 w-8 rounded-full' }))) : (react_2.default.createElement("img", { alt: '', className: 'h-8 w-8 rounded-full', src: dataInitMain.sourceAvatar })))),
+                                react_2.default.createElement(react_1.Transition, { as: react_2.Fragment, enter: 'transition ease-out duration-100', enterFrom: 'transform opacity-0 scale-95', enterTo: 'transform opacity-100 scale-100', leave: 'transition ease-in duration-75', leaveFrom: 'transform opacity-100 scale-100', leaveTo: 'transform opacity-0 scale-95' },
+                                    react_2.default.createElement(react_1.Menu.Items, { className: ' absolute right-0 z-10 mt-2 w-[340px] origin-top-right rounded-md bg-white px-2 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none' },
+                                        react_2.default.createElement(react_1.Menu.Item, null,
+                                            react_2.default.createElement("div", { "aria-hidden": true, className: 'px-2 pb-2 pt-4 text-sm font-semibold text-gray-900 ' }, "Ch\u1ECDn tr\u01B0\u1EDDng")),
+                                        !dataInitMain.loadingSchool ? (react_2.default.createElement(react_2.default.Fragment, null, dataInitMain.listSchool
                                             .filter(function (val) {
                                             if (!enablePer(constants_1.switchSchool, dataInitMain.perCode)) {
                                                 return val.id === dataInitMain.schoolId;
@@ -683,8 +734,8 @@ var PHXMainWrapV3 = function (_a) {
                                                 return true;
                                             }
                                         })
-                                            .map(function (item) { return (react_2["default"].createElement(react_1.Menu.Item, { key: item.id },
-                                            react_2["default"].createElement("div", { "aria-hidden": true, className: "".concat(item.id === dataInitMain.schoolId &&
+                                            .map(function (item) { return (react_2.default.createElement(react_1.Menu.Item, { key: item.id },
+                                            react_2.default.createElement("div", { "aria-hidden": true, className: "".concat(item.id === dataInitMain.schoolId &&
                                                     dataInitMain.listSchool.length > 1 &&
                                                     !enablePer(constants_1.switchSchool, dataInitMain.perCode) === false
                                                     ? 'rounded-lg bg-zinc-200 font-semibold text-gray-900 '
@@ -693,31 +744,31 @@ var PHXMainWrapV3 = function (_a) {
                                                         !enablePer(constants_1.switchSchool, dataInitMain.perCode)) === false
                                                     ? 'cursor-pointer hover:rounded-lg hover:bg-gray-100'
                                                     : '', "\n                              relative mb-1  flex items-center justify-between px-2  py-1.5 text-sm text-gray-900"), onClick: function () { return handleOpenModal(item.id); } },
-                                                react_2["default"].createElement("p", { className: 'max-w-[95%] truncate' }, item.name),
+                                                react_2.default.createElement("p", { className: 'max-w-[95%] truncate' }, item.name),
                                                 item.id === dataInitMain.schoolId &&
                                                     dataInitMain.listSchool.length > 1 &&
-                                                    !enablePer(constants_1.switchSchool, dataInitMain.perCode) === false && (react_2["default"].createElement(solid_2.CheckIcon, { "aria-hidden": 'true', className: 'h-4 w-4' }))))); }))) : (react_2["default"].createElement(Skeleton_1.PHXSkeleton, { className: 'flex-1 px-2 py-2', type: 'single' })),
-                                        react_2["default"].createElement("div", { className: 'border-b pt-1.5' }),
-                                        react_2["default"].createElement(react_1.Menu.Item, null,
-                                            react_2["default"].createElement("div", { "aria-hidden": true, className: 'px-2 pb-2 pt-4  text-sm font-semibold text-gray-900' }, "T\u00F9y ch\u1ECDn")),
-                                        react_2["default"].createElement(react_1.Menu.Item, null,
-                                            react_2["default"].createElement("div", { "aria-hidden": true, className: 'cursor-pointer px-2 py-1.5 text-sm text-gray-900 hover:rounded-lg hover:bg-gray-100', onClick: handleProfilePage }, "Th\u00F4ng tin c\u00E1 nh\u00E2n")),
-                                        react_2["default"].createElement(react_1.Menu.Item, null,
-                                            react_2["default"].createElement("div", { "aria-hidden": true, className: 'mb-2.5 cursor-pointer px-2 py-1.5 text-sm text-[#8e1f0c] hover:rounded-lg hover:bg-gray-100', onClick: handleModalSignOut }, "\u0110\u0103ng xu\u1EA5t")))))))))),
-        react_2["default"].createElement("div", null,
-            react_2["default"].createElement(Modal_1.PHXModal, { dangerActionText: '\u0110\u0103ng xu\u1EA5t', onDangerClick: handleSignOut, onHide: function () { return setModalSignOut(false); }, primaryActionText: '', show: modalSignOut, title: '\u0110\u0103ng xu\u1EA5t' },
-                react_2["default"].createElement("div", { className: 'text-sm text-gray-700' }, "Khi th\u1EF1c hi\u1EC7n thao t\u00E1c n\u00E0y b\u1EA1n s\u1EBD tho\u00E1t kh\u1ECFi trang qu\u1EA3n tr\u1ECB v\u00E0 tr\u1EDF v\u1EC1 trang \u0111\u0103ng nh\u1EADp"))),
-        react_2["default"].createElement(Modal_1.PHXModal, { onHide: function () { return setModal(false); }, onPrimaryClick: handlePrimaryModal, primaryActionText: 'X\u00E1c nh\u1EADn', show: modal, title: 'X\u00E1c nh\u1EADn thay \u0111\u1ED5i tr\u01B0\u1EDDng' },
-            react_2["default"].createElement(Banner_1.PHXBanner, { description: 'Khi thay \u0111\u1ED5i tr\u01B0\u1EDDng t\u1EA5t c\u1EA3 d\u1EEF li\u1EC7u s\u1EBD hi\u1EC3n th\u1ECB theo tr\u01B0\u1EDDng v\u1EEBa \u0111\u01B0\u1EE3c ch\u1ECDn', onClose: function () { return setShowBanner(false); }, show: showBanner, title: 'L\u01B0u \u00FD', type: 'warning' })),
-        react_2["default"].createElement("div", { className: 'relative flex min-h-screen bg-gray-100' },
-            react_2["default"].createElement(nav_mobile_1["default"], { menu: dataInitMain.menu, path: pathNameWithBasePath, permission: dataInitMain.perCode, router: router, setSidebarOpen: setSidebarOpen, hiddenSideBar: function () { return setSidebarOpen(false); }, sidebarOpen: sidebarOpen, pathNameWithBasePath: pathNameWithBasePath }),
-            react_2["default"].createElement("div", { className: 'hidden lg:flex lg:flex-shrink-0' },
-                react_2["default"].createElement("div", { className: 'flex' },
-                    react_2["default"].createElement("div", { className: 'mt-14 flex lg:inset-y-0' },
-                        react_2["default"].createElement("div", { "aria-hidden": true, className: "".concat(openNavName ? 'w-64' : 'w-14', " menu-styled z-10 flex h-full flex-col justify-between border-r !bg-gray-200 transition-all duration-300 lg:fixed"), onMouseOut: function () { return setOpenNavName(false); }, onMouseOver: function () { return setOpenNavName(true); } },
-                            react_2["default"].createElement("div", { className: classNames('flex flex-1 flex-col', openNavName ? 'overflow-y-auto' : 'overflow-y-hidden') },
-                                react_2["default"].createElement("div", { className: 'relative flex-1' },
-                                    react_2["default"].createElement("div", { "aria-label": 'Sidebar', className: 'hidden overflow-x-hidden md:block md:flex-shrink-0 md:overflow-y-auto' }, !hiddenLeftMenu && (react_2["default"].createElement("div", { className: "space-y- flex ".concat(openNavName ? 'w-64' : 'w-12', " flex-col overflow-hidden p-3") }, navigation.map(function (item, index) { return (react_2["default"].createElement("div", { key: index, className: 'w-full' }, enablePer(item.code, dataInitMain.perCode) && (react_2["default"].createElement("a", { className: "".concat(classNames(item.current && !openNavName
+                                                    !enablePer(constants_1.switchSchool, dataInitMain.perCode) === false && (react_2.default.createElement(solid_2.CheckIcon, { "aria-hidden": 'true', className: 'h-4 w-4' }))))); }))) : (react_2.default.createElement(Skeleton_1.PHXSkeleton, { className: 'flex-1 px-2 py-2', type: 'single' })),
+                                        react_2.default.createElement("div", { className: 'border-b pt-1.5' }),
+                                        react_2.default.createElement(react_1.Menu.Item, null,
+                                            react_2.default.createElement("div", { "aria-hidden": true, className: 'px-2 pb-2 pt-4  text-sm font-semibold text-gray-900' }, "T\u00F9y ch\u1ECDn")),
+                                        react_2.default.createElement(react_1.Menu.Item, null,
+                                            react_2.default.createElement("div", { "aria-hidden": true, className: 'cursor-pointer px-2 py-1.5 text-sm text-gray-900 hover:rounded-lg hover:bg-gray-100', onClick: handleProfilePage }, "Th\u00F4ng tin c\u00E1 nh\u00E2n")),
+                                        react_2.default.createElement(react_1.Menu.Item, null,
+                                            react_2.default.createElement("div", { "aria-hidden": true, className: 'mb-2.5 cursor-pointer px-2 py-1.5 text-sm text-[#8e1f0c] hover:rounded-lg hover:bg-gray-100', onClick: handleModalSignOut }, "\u0110\u0103ng xu\u1EA5t")))))))))),
+        react_2.default.createElement("div", null,
+            react_2.default.createElement(Modal_1.PHXModal, { dangerActionText: '\u0110\u0103ng xu\u1EA5t', onDangerClick: handleSignOut, onHide: function () { return setModalSignOut(false); }, primaryActionText: '', show: modalSignOut, title: '\u0110\u0103ng xu\u1EA5t' },
+                react_2.default.createElement("div", { className: 'text-sm text-gray-700' }, "Khi th\u1EF1c hi\u1EC7n thao t\u00E1c n\u00E0y b\u1EA1n s\u1EBD tho\u00E1t kh\u1ECFi trang qu\u1EA3n tr\u1ECB v\u00E0 tr\u1EDF v\u1EC1 trang \u0111\u0103ng nh\u1EADp"))),
+        react_2.default.createElement(Modal_1.PHXModal, { onHide: function () { return setModal(false); }, onPrimaryClick: handlePrimaryModal, primaryActionText: 'X\u00E1c nh\u1EADn', show: modal, title: 'X\u00E1c nh\u1EADn thay \u0111\u1ED5i tr\u01B0\u1EDDng' },
+            react_2.default.createElement(Banner_1.PHXBanner, { description: 'Khi thay \u0111\u1ED5i tr\u01B0\u1EDDng t\u1EA5t c\u1EA3 d\u1EEF li\u1EC7u s\u1EBD hi\u1EC3n th\u1ECB theo tr\u01B0\u1EDDng v\u1EEBa \u0111\u01B0\u1EE3c ch\u1ECDn', onClose: function () { return setShowBanner(false); }, show: showBanner, title: 'L\u01B0u \u00FD', type: 'warning' })),
+        react_2.default.createElement("div", { className: 'relative flex min-h-screen bg-gray-100' },
+            react_2.default.createElement(nav_mobile_1.default, { menu: dataInitMain.menu, path: pathNameWithBasePath, permission: dataInitMain.perCode, router: router, setSidebarOpen: setSidebarOpen, hiddenSideBar: function () { return setSidebarOpen(false); }, sidebarOpen: sidebarOpen, pathNameWithBasePath: pathNameWithBasePath }),
+            react_2.default.createElement("div", { className: 'hidden lg:flex lg:flex-shrink-0' },
+                react_2.default.createElement("div", { className: 'flex' },
+                    react_2.default.createElement("div", { className: 'mt-14 flex lg:inset-y-0' },
+                        react_2.default.createElement("div", { "aria-hidden": true, className: "".concat(openNavName ? 'w-64' : 'w-14', " menu-styled z-10 flex h-full flex-col justify-between border-r !bg-gray-200 transition-all duration-300 lg:fixed"), onMouseOut: function () { return setOpenNavName(false); }, onMouseOver: function () { return setOpenNavName(true); } },
+                            react_2.default.createElement("div", { className: classNames('flex flex-1 flex-col', openNavName ? 'overflow-y-auto' : 'overflow-y-hidden') },
+                                react_2.default.createElement("div", { className: 'relative flex-1' },
+                                    react_2.default.createElement("div", { "aria-label": 'Sidebar', className: 'hidden overflow-x-hidden md:block md:flex-shrink-0 md:overflow-y-auto' }, !hiddenLeftMenu && (react_2.default.createElement("div", { className: "space-y- flex ".concat(openNavName ? 'w-64' : 'w-12', " flex-col overflow-hidden p-3") }, navigation.map(function (item, index) { return (react_2.default.createElement("div", { key: index, className: 'w-full' }, enablePer(item.code, dataInitMain.perCode) && (react_2.default.createElement("a", { className: "".concat(classNames(item.current && !openNavName
                                             ? 'menu-bg-color-icon-active-styled font-semibold' // màu background của icon đang active của menu
                                             : 'menu-icon-color-styled', // màu icon của menu
                                         !openNavName
@@ -727,21 +778,21 @@ var PHXMainWrapV3 = function (_a) {
                                             : 'menu-hover-bg hover:rounded-lg hover:bg-opacity-50')), href: item.path, 
                                         // onClick={() => handleClicked(item.path)}
                                         onMouseOver: function () { return setOpenNavName(true); } },
-                                        react_2["default"].createElement("span", { className: 'sr-only' }, item.name),
-                                        react_2["default"].createElement("span", { className: classNames(!openNavName
+                                        react_2.default.createElement("span", { className: 'sr-only' }, item.name),
+                                        react_2.default.createElement("span", { className: classNames(!openNavName
                                                 ? 'group cursor-pointer hover:z-10 focus-visible:outline-none'
                                                 : "flex gap-x-2 ".concat(item.menuIconSL ? 'pl-[3px] pt-[2px]' : 'pl-[0.45rem]')) },
-                                            item.menuIconSL ? (react_2["default"].createElement("img", { alt: 'icon', className: 'w-[1.6rem]', src: item.menuIconSL })) : (
+                                            item.menuIconSL ? (react_2.default.createElement("img", { alt: 'icon', className: 'w-[1.6rem]', src: item.menuIconSL })) : (
                                             // <FontAwesomeIcon
                                             //   className="mt-1 h-[1.125rem] w-[1.125rem]"
                                             //   icon={item.image}
                                             // />
-                                            react_2["default"].createElement(image_1["default"], { alt: 'icon', className: classNames('h-[1.125rem] w-[1.125rem] text-gray-950', openNavName && 'mt-[0.2rem]'), height: 0, src: item.current ? Icon_1.Icons["".concat(item.code, "_SOLID")] : Icon_1.Icons[item.code], width: 0 })),
-                                            openNavName && (react_2["default"].createElement("div", { className: 'h-6' },
-                                                react_2["default"].createElement("p", { className: "mt-0.5 h-full text-[0.86rem] text-[#353A44] transition-all duration-300 ".concat(openNavName ? 'opacity-100' : 'opacity-0') }, item.name)))))))); })))))),
-                            react_2["default"].createElement("div", { className: classNames('border-t', navigation.length > 0 && ((_f = navigation[0]) === null || _f === void 0 ? void 0 : _f.isSchoolink) ? 'border-[#1c222b]' : 'border-indigo-100') },
-                                react_2["default"].createElement("div", { className: " flex ".concat(openNavName ? 'w-64' : 'w-12', " overflow-hidden px-3 pb-1.5 pt-3") },
-                                    react_2["default"].createElement("a", { className: classNames('z-0', !openNavName
+                                            react_2.default.createElement(image_1.default, { alt: 'icon', className: classNames('h-[1.125rem] w-[1.125rem] text-gray-950', openNavName && 'mt-[0.2rem]'), height: 0, src: item.current ? Icon_1.Icons["".concat(item.code, "_SOLID")] : Icon_1.Icons[item.code], width: 0 })),
+                                            openNavName && (react_2.default.createElement("div", { className: 'h-6' },
+                                                react_2.default.createElement("p", { className: "mt-0.5 h-full text-[0.86rem] text-[#353A44] transition-all duration-300 ".concat(openNavName ? 'opacity-100' : 'opacity-0') }, item.name)))))))); })))))),
+                            react_2.default.createElement("div", { className: classNames('border-t', navigation.length > 0 && ((_f = navigation[0]) === null || _f === void 0 ? void 0 : _f.isSchoolink) ? 'border-[#1c222b]' : 'border-indigo-100') },
+                                react_2.default.createElement("div", { className: 'flex overflow-hidden px-3 pb-1.5 pt-3' },
+                                    react_2.default.createElement("a", { className: classNames('z-0', !openNavName
                                             ? 'inline-flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg'
                                             : 'inline-flex h-8 min-w-full flex-shrink-0 items-center rounded-lg hover:rounded-lg hover:bg-opacity-50', isActivityHistory() && !openNavName
                                             ? 'setting-bg-icon-active' // màu background của icon đang active trong menu
@@ -749,15 +800,15 @@ var PHXMainWrapV3 = function (_a) {
                                         openNavName && isActivityHistory()
                                             ? 'setting-bg-icon-active rounded-lg' // màu background của icon đang active trong menu
                                             : 'setting-hover-bg hover:rounded-lg hover:bg-opacity-50'), href: '/activity-history/list', onMouseOver: function () { return setOpenNavName(true); } },
-                                        react_2["default"].createElement("span", { className: 'sr-only' }, "L\u1ECBch s\u1EED ho\u1EA1t \u0111\u1ED9ng"),
-                                        react_2["default"].createElement("span", { className: classNames(!openNavName
+                                        react_2.default.createElement("span", { className: 'sr-only' }, "L\u1ECBch s\u1EED ho\u1EA1t \u0111\u1ED9ng"),
+                                        react_2.default.createElement("span", { className: classNames(!openNavName
                                                 ? 'cursor-pointer hover:z-10 focus-visible:outline-none'
                                                 : 'flex gap-x-2 pl-[0.45rem]') },
-                                            react_2["default"].createElement(image_1["default"], { alt: 'icon', className: classNames('h-[1.125rem] w-[1.125rem]', openNavName ? 'mt-[0.2rem]' : ''), height: 0, src: isActivityHistory() ? Icon_1.Icons.ACTIVITY_HISTORY_SOLID : Icon_1.Icons.ACTIVITY_HISTORY, width: 0 }),
-                                            openNavName && (react_2["default"].createElement("div", { className: 'h-6' },
-                                                react_2["default"].createElement("p", { className: "setting-text-color mt-0.5 h-full text-[0.86rem] font-normal text-[#353A44] transition-all duration-300 hover:cursor-pointer ".concat(openNavName ? 'opacity-100' : 'opacity-0') }, "L\u1ECBch s\u1EED ho\u1EA1t \u0111\u1ED9ng")))))),
-                                react_2["default"].createElement("div", { className: "mb-14 flex ".concat(openNavName ? 'w-64' : 'w-12', " overflow-hidden px-3 pb-3") },
-                                    react_2["default"].createElement("a", { className: classNames('z-0', !openNavName
+                                            react_2.default.createElement(image_1.default, { alt: 'icon', className: classNames('h-[1.125rem] w-[1.125rem]', openNavName ? 'mt-[0.2rem]' : ''), height: 0, src: isActivityHistory() ? Icon_1.Icons.ACTIVITY_HISTORY_SOLID : Icon_1.Icons.ACTIVITY_HISTORY, width: 0 }),
+                                            openNavName && (react_2.default.createElement("div", { className: 'h-6' },
+                                                react_2.default.createElement("p", { className: "setting-text-color mt-0.5 h-full text-[0.86rem] font-normal text-[#353A44] transition-all duration-300 hover:cursor-pointer ".concat(openNavName ? 'opacity-100' : 'opacity-0') }, "L\u1ECBch s\u1EED ho\u1EA1t \u0111\u1ED9ng")))))),
+                                react_2.default.createElement("div", { className: 'mb-14 flex overflow-hidden px-3 pb-3' },
+                                    react_2.default.createElement("a", { className: classNames('z-0', !openNavName
                                             ? 'inline-flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg'
                                             : 'inline-flex h-8 min-w-full flex-shrink-0 items-center rounded-lg hover:rounded-lg hover:bg-opacity-50', isSettings() && !openNavName
                                             ? 'setting-bg-icon-active' // màu background của icon đang active trong menu
@@ -767,125 +818,125 @@ var PHXMainWrapV3 = function (_a) {
                                             : 'setting-hover-bg hover:rounded-lg hover:bg-opacity-50'), href: '/setting', 
                                         // onClick={() => handleClicked(item.path)}
                                         onMouseOver: function () { return setOpenNavName(true); } },
-                                        react_2["default"].createElement("span", { className: 'sr-only' }, "setting"),
-                                        react_2["default"].createElement("span", { className: classNames(!openNavName
+                                        react_2.default.createElement("span", { className: 'sr-only' }, "setting"),
+                                        react_2.default.createElement("span", { className: classNames(!openNavName
                                                 ? 'cursor-pointer hover:z-10 focus-visible:outline-none'
                                                 : 'flex gap-x-2 pl-[0.45rem]') },
-                                            react_2["default"].createElement(image_1["default"], { alt: 'icon', className: classNames('h-[1.125rem] w-[1.125rem]', openNavName ? 'mt-[0.2rem]' : ''), height: 0, src: isSettings() ? Icon_1.Icons.SETTING_SOLID : Icon_1.Icons.SETTING, width: 0 }),
-                                            openNavName && (react_2["default"].createElement("div", { className: 'h-6' },
-                                                react_2["default"].createElement("p", { className: "setting-text-color mt-0.5 h-full text-[0.86rem] font-normal text-[#353A44] transition-all duration-300 hover:cursor-pointer ".concat(openNavName ? 'opacity-100' : 'opacity-0') }, "C\u00E0i \u0111\u1EB7t")))))))),
-                        !hiddenLeftMenu && (react_2["default"].createElement(react_1.Transition, { as: react_2.Fragment, enter: 'transition ease-in-out duration-300 transform', enterFrom: '-translate-x-full', enterTo: 'translate-x-0', leave: 'transition ease-in-out duration-300 transform', leaveFrom: 'translate-x-0', leaveTo: '-translate-x-full', show: openSubMenu },
-                            react_2["default"].createElement("aside", { className: 'z-9 fixed ml-[3.438rem] hidden h-full bg-gray-200/20 lg:block lg:flex-shrink-0' },
-                                react_2["default"].createElement("div", { className: 'relative flex h-full w-64 flex-col overflow-y-auto bg-gray-200/20' },
+                                            react_2.default.createElement(image_1.default, { alt: 'icon', className: classNames('h-[1.125rem] w-[1.125rem]', openNavName ? 'mt-[0.2rem]' : ''), height: 0, src: isSettings() ? Icon_1.Icons.SETTING_SOLID : Icon_1.Icons.SETTING, width: 0 }),
+                                            openNavName && (react_2.default.createElement("div", { className: 'h-6' },
+                                                react_2.default.createElement("p", { className: "setting-text-color mt-0.5 h-full text-[0.86rem] font-normal text-[#353A44] transition-all duration-300 hover:cursor-pointer ".concat(openNavName ? 'opacity-100' : 'opacity-0') }, "C\u00E0i \u0111\u1EB7t")))))))),
+                        !hiddenLeftMenu && (react_2.default.createElement(react_1.Transition, { as: react_2.Fragment, enter: 'transition ease-in-out duration-300 transform', enterFrom: '-translate-x-full', enterTo: 'translate-x-0', leave: 'transition ease-in-out duration-300 transform', leaveFrom: 'translate-x-0', leaveTo: '-translate-x-full', show: openSubMenu },
+                            react_2.default.createElement("aside", { className: 'z-9 fixed ml-[3.438rem] hidden h-full bg-gray-200/20 lg:block lg:flex-shrink-0' },
+                                react_2.default.createElement("div", { className: 'relative flex h-full w-64 flex-col overflow-y-auto bg-gray-200/20' },
                                     checkAdmissions(pathNameWithBasePath) &&
                                         checkChildrenCampaign(pathNameWithBasePath) &&
-                                        pathNameWithBasePath !== '/admissions/campaign/list' && (react_2["default"].createElement("div", { className: 'mx-1 flex items-center p-2 pb-0' },
-                                        react_2["default"].createElement("button", { className: 'mr-1 inline-flex items-center rounded-lg border-gray-300 bg-transparent px-2 py-1 text-xs font-medium text-gray-700 hover:bg-gray-200 active:bg-gray-300 active:pb-[0.2rem] active:pt-[0.3rem] active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset]', onClick: function () { return handleBackMenu(); }, type: 'button' },
-                                            react_2["default"].createElement(solid_1.ArrowLeftIcon, { className: 'h-5 w-5' })),
-                                        react_2["default"].createElement("p", { className: 'text-sm font-medium text-slate-600' }, campaignName))),
-                                    react_2["default"].createElement("div", { className: 'flex-1 overflow-y-auto pt-3' },
+                                        pathNameWithBasePath !== '/admissions/campaign/list' && (react_2.default.createElement("div", { className: 'mx-1 flex items-center p-2 pb-0' },
+                                        react_2.default.createElement("button", { className: 'mr-1 inline-flex items-center rounded-lg border-gray-300 bg-transparent px-2 py-1 text-xs font-medium text-gray-700 hover:bg-gray-200 active:bg-gray-300 active:pb-[0.2rem] active:pt-[0.3rem] active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset]', onClick: function () { return handleBackMenu(); }, type: 'button' },
+                                            react_2.default.createElement(solid_1.ArrowLeftIcon, { className: 'h-5 w-5' })),
+                                        react_2.default.createElement("p", { className: 'text-sm font-medium text-slate-600' }, campaignName))),
+                                    react_2.default.createElement("div", { className: 'flex-1 overflow-y-auto pt-3' },
                                         subNavigation.map(function (item, subNavIndex) {
                                             var _a;
-                                            return (react_2["default"].createElement("div", { key: subNavIndex }, ((_a = dataInitMain.roleCode) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (react_2["default"].createElement(react_2["default"].Fragment, null, enablePer(item.code, dataInitMain.perCode) ? (react_2["default"].createElement(react_2["default"].Fragment, null,
-                                                (item === null || item === void 0 ? void 0 : item.isMicroservice) ? (react_2["default"].createElement("a", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current)
+                                            return (react_2.default.createElement("div", { key: subNavIndex }, ((_a = dataInitMain.roleCode) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (react_2.default.createElement(react_2.default.Fragment, null, enablePer(item.code, dataInitMain.perCode) ? (react_2.default.createElement(react_2.default.Fragment, null,
+                                                (item === null || item === void 0 ? void 0 : item.isMicroservice) ? (react_2.default.createElement("a", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current)
                                                         ? 'rounded-lg bg-white' // màu background menu cha khi active
                                                         : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50', // màu background khi hover vào menu cha
-                                                    'mx-3 flex cursor-pointer border-slate-200 p-2'), href: item.path }, !dataInitMain.loadingMenu ? (react_2["default"].createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
-                                                    react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                                                        react_2["default"].createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
-                                                    react_2["default"].createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2["default"].createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))) : (react_2["default"].createElement("div", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current)
+                                                    'mx-3 flex cursor-pointer border-slate-200 p-2'), href: item.path }, !dataInitMain.loadingMenu ? (react_2.default.createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
+                                                    react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                                                        react_2.default.createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
+                                                    react_2.default.createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2.default.createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))) : (react_2.default.createElement("div", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current)
                                                         ? 'rounded-lg bg-white' // màu background menu cha khi active
                                                         : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50', // màu background khi hover vào menu cha
-                                                    'mx-3 flex cursor-pointer border-slate-200 p-2'), onClick: function () { return subNavigationTriggerClicked(item); } }, !dataInitMain.loadingMenu ? (react_2["default"].createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
-                                                    react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                                                        react_2["default"].createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
-                                                    react_2["default"].createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2["default"].createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))),
-                                                item.showChild && item.child && (react_2["default"].createElement(react_2["default"].Fragment, null, item.child.map(function (children, childIndex) { return (react_2["default"].createElement("div", { key: childIndex, className: classNames('relative') },
-                                                    react_2["default"].createElement("div", { style: (children === null || children === void 0 ? void 0 : children.current)
+                                                    'mx-3 flex cursor-pointer border-slate-200 p-2'), onClick: function () { return subNavigationTriggerClicked(item); } }, !dataInitMain.loadingMenu ? (react_2.default.createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
+                                                    react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                                                        react_2.default.createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
+                                                    react_2.default.createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2.default.createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))),
+                                                item.showChild && item.child && (react_2.default.createElement(react_2.default.Fragment, null, item.child.map(function (children, childIndex) { return (react_2.default.createElement("div", { key: childIndex, className: classNames('relative') },
+                                                    react_2.default.createElement("div", { style: (children === null || children === void 0 ? void 0 : children.current)
                                                             ? sub_menu_style_1.styles.childMenuActiveBefore
                                                             : checkChildBefore(item.child, children)
                                                                 ? sub_menu_style_1.styles.childMenuBefBefore
                                                                 : {} }),
-                                                    (children === null || children === void 0 ? void 0 : children.isMicroservice) ? (react_2["default"].createElement("a", { "aria-hidden": true, className: classNames('mx-3 flex cursor-pointer border-slate-200 p-2 text-[0.84rem]', (children === null || children === void 0 ? void 0 : children.current)
+                                                    (children === null || children === void 0 ? void 0 : children.isMicroservice) ? (react_2.default.createElement("a", { "aria-hidden": true, className: classNames('mx-3 flex cursor-pointer border-slate-200 p-2 text-[0.84rem]', (children === null || children === void 0 ? void 0 : children.current)
                                                             ? 'rounded-lg bg-white text-[#353A44]' // màu chữ menu con khi active
                                                             : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50 hover:text-[#353A44]'), href: children.path, onClick: enablePer(children.code, dataInitMain.perCode)
                                                             ? undefined
                                                             : function (e) { return e.preventDefault(); } },
-                                                        react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                                                            react_2["default"].createElement("div", { className: 'w-3' }),
-                                                            react_2["default"].createElement("p", { className: classNames('my-[0.05rem] ml-3 leading-5', !enablePer(children.code, dataInitMain.perCode)
+                                                        react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                                                            react_2.default.createElement("div", { className: 'w-3' }),
+                                                            react_2.default.createElement("p", { className: classNames('my-[0.05rem] ml-3 leading-5', !enablePer(children.code, dataInitMain.perCode)
                                                                     ? 'font-normal text-gray-300'
                                                                     : (children === null || children === void 0 ? void 0 : children.current)
                                                                         ? ''
-                                                                        : 'font-normal text-[#353A44]') }, children.name)))) : (react_2["default"].createElement("div", { "aria-hidden": true, className: classNames('mx-3 flex cursor-pointer border-slate-200 p-2 text-[0.84rem]', (children === null || children === void 0 ? void 0 : children.current)
+                                                                        : 'font-normal text-[#353A44]') }, children.name)))) : (react_2.default.createElement("div", { "aria-hidden": true, className: classNames('mx-3 flex cursor-pointer border-slate-200 p-2 text-[0.84rem]', (children === null || children === void 0 ? void 0 : children.current)
                                                             ? 'rounded-lg bg-white text-[#353A44]' // màu chữ menu con khi active
                                                             : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50 hover:text-[#353A44]'), onClick: enablePer(children.code, dataInitMain.perCode)
                                                             ? function () { return subNavigationTriggerClicked(children, item); }
                                                             : undefined },
-                                                        react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                                                            react_2["default"].createElement("div", { className: 'w-3' }),
-                                                            react_2["default"].createElement("p", { className: classNames('my-[0.05rem] ml-3 leading-5', !enablePer(children.code, dataInitMain.perCode)
+                                                        react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                                                            react_2.default.createElement("div", { className: 'w-3' }),
+                                                            react_2.default.createElement("p", { className: classNames('my-[0.05rem] ml-3 leading-5', !enablePer(children.code, dataInitMain.perCode)
                                                                     ? 'font-normal text-gray-300'
                                                                     : (children === null || children === void 0 ? void 0 : children.current)
                                                                         ? ''
                                                                         : 'font-normal text-[#353A44]') }, children.name)))),
-                                                    react_2["default"].createElement("div", { style: (children === null || children === void 0 ? void 0 : children.current)
+                                                    react_2.default.createElement("div", { style: (children === null || children === void 0 ? void 0 : children.current)
                                                             ? sub_menu_style_1.styles.childMenuActiveAfter
                                                             : checkChildBefore(item.child, children)
                                                                 ? sub_menu_style_1.styles.childMenuBefAfter
-                                                                : {} }))); }))))) : (react_2["default"].createElement("div", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, className: classNames((item === null || item === void 0 ? void 0 : item.current)
+                                                                : {} }))); }))))) : (react_2.default.createElement("div", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, className: classNames((item === null || item === void 0 ? void 0 : item.current)
                                                     ? 'rounded-lg bg-white '
                                                     : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50', // hover:bg-white
-                                                'mx-3 flex cursor-pointer border-slate-200 p-2') }, !dataInitMain.loadingMenu ? (react_2["default"].createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
-                                                react_2["default"].createElement("div", { className: 'flex items-center gap-x-3 text-gray-700' },
-                                                    react_2["default"].createElement("p", { className: classNames('font-normal leading-5 text-gray-300') }, item === null || item === void 0 ? void 0 : item.name)),
-                                                react_2["default"].createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2["default"].createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))))) : (react_2["default"].createElement(react_2["default"].Fragment, null,
-                                                (item === null || item === void 0 ? void 0 : item.isMicroservice) ? (react_2["default"].createElement("a", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current)
+                                                'mx-3 flex cursor-pointer border-slate-200 p-2') }, !dataInitMain.loadingMenu ? (react_2.default.createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
+                                                react_2.default.createElement("div", { className: 'flex items-center gap-x-3 text-gray-700' },
+                                                    react_2.default.createElement("p", { className: classNames('font-normal leading-5 text-gray-300') }, item === null || item === void 0 ? void 0 : item.name)),
+                                                react_2.default.createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2.default.createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))))) : (react_2.default.createElement(react_2.default.Fragment, null,
+                                                (item === null || item === void 0 ? void 0 : item.isMicroservice) ? (react_2.default.createElement("a", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current)
                                                         ? 'rounded-lg bg-white' // màu background menu cha khi active
                                                         : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50', // màu background khi hover vào menu cha
-                                                    'mx-3 flex cursor-pointer border-slate-200 p-2'), href: item.path }, !dataInitMain.loadingMenu ? (react_2["default"].createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
-                                                    react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                                                        react_2["default"].createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
-                                                    react_2["default"].createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2["default"].createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))) : (react_2["default"].createElement("div", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current)
+                                                    'mx-3 flex cursor-pointer border-slate-200 p-2'), href: item.path }, !dataInitMain.loadingMenu ? (react_2.default.createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
+                                                    react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                                                        react_2.default.createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
+                                                    react_2.default.createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2.default.createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))) : (react_2.default.createElement("div", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current)
                                                         ? 'rounded-lg bg-white' // màu background menu cha khi active
                                                         : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50', // màu background khi hover vào menu cha
-                                                    'mx-3 flex cursor-pointer border-slate-200 p-2'), onClick: function () { return subNavigationTriggerClicked(item); } }, !dataInitMain.loadingMenu ? (react_2["default"].createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
-                                                    react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                                                        react_2["default"].createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
-                                                    react_2["default"].createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2["default"].createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))),
-                                                item.showChild && item.child && (react_2["default"].createElement(react_2["default"].Fragment, null, item.child.map(function (children, index) { return (react_2["default"].createElement("div", { key: index, className: classNames('relative', (children === null || children === void 0 ? void 0 : children.current) && 'child-menu-active', checkChildBefore(item.child, children) && 'child-menu-bef') }, (children === null || children === void 0 ? void 0 : children.isMicroservice) ? (react_2["default"].createElement("a", { "aria-hidden": true, className: classNames('mx-1 flex cursor-pointer border-slate-200 p-2 text-[0.84rem]', (children === null || children === void 0 ? void 0 : children.current)
+                                                    'mx-3 flex cursor-pointer border-slate-200 p-2'), onClick: function () { return subNavigationTriggerClicked(item); } }, !dataInitMain.loadingMenu ? (react_2.default.createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
+                                                    react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                                                        react_2.default.createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
+                                                    react_2.default.createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (react_2.default.createElement(Skeleton_1.PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))),
+                                                item.showChild && item.child && (react_2.default.createElement(react_2.default.Fragment, null, item.child.map(function (children, index) { return (react_2.default.createElement("div", { key: index, className: classNames('relative', (children === null || children === void 0 ? void 0 : children.current) && 'child-menu-active', checkChildBefore(item.child, children) && 'child-menu-bef') }, (children === null || children === void 0 ? void 0 : children.isMicroservice) ? (react_2.default.createElement("a", { "aria-hidden": true, className: classNames('mx-1 flex cursor-pointer border-slate-200 p-2 text-[0.84rem]', (children === null || children === void 0 ? void 0 : children.current)
                                                         ? 'rounded-lg bg-white text-gray-900 '
                                                         : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50 hover:text-gray-900'), href: item.path },
-                                                    react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                                                        react_2["default"].createElement("div", { className: 'w-3' }),
-                                                        react_2["default"].createElement("p", { className: classNames('my-[0.05rem] ml-3 leading-5', (children === null || children === void 0 ? void 0 : children.current) ? 'font-semibold' : 'font-normal text-gray-600') }, children.name)))) : (react_2["default"].createElement("div", { "aria-hidden": true, className: classNames('mx-1 flex cursor-pointer border-slate-200 p-2 text-[0.84rem]', (children === null || children === void 0 ? void 0 : children.current)
+                                                    react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                                                        react_2.default.createElement("div", { className: 'w-3' }),
+                                                        react_2.default.createElement("p", { className: classNames('my-[0.05rem] ml-3 leading-5', (children === null || children === void 0 ? void 0 : children.current) ? 'font-semibold' : 'font-normal text-gray-600') }, children.name)))) : (react_2.default.createElement("div", { "aria-hidden": true, className: classNames('mx-1 flex cursor-pointer border-slate-200 p-2 text-[0.84rem]', (children === null || children === void 0 ? void 0 : children.current)
                                                         ? 'rounded-lg bg-white text-gray-900 '
                                                         : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50 hover:text-gray-900'), onClick: function () { return subNavigationTriggerClicked(children, item); } },
-                                                    react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                                                        react_2["default"].createElement("div", { className: 'w-3' }),
-                                                        react_2["default"].createElement("p", { className: classNames('my-[0.05rem] ml-3 leading-5', (children === null || children === void 0 ? void 0 : children.current) ? 'font-semibold' : 'font-normal text-gray-600') }, children.name)))))); })))))));
+                                                    react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                                                        react_2.default.createElement("div", { className: 'w-3' }),
+                                                        react_2.default.createElement("p", { className: classNames('my-[0.05rem] ml-3 leading-5', (children === null || children === void 0 ? void 0 : children.current) ? 'font-semibold' : 'font-normal text-gray-600') }, children.name)))))); })))))));
                                         }),
-                                        activityHistoryChild.map(function (item, subNavIndex) { return (react_2["default"].createElement("div", { key: subNavIndex },
-                                            react_2["default"].createElement("div", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current) && !dataInitMain.loadingMenu
+                                        activityHistoryChild.map(function (item, subNavIndex) { return (react_2.default.createElement("div", { key: subNavIndex },
+                                            react_2.default.createElement("div", { "aria-current": (item === null || item === void 0 ? void 0 : item.current) ? 'page' : undefined, "aria-hidden": true, className: classNames((item === null || item === void 0 ? void 0 : item.current) && !dataInitMain.loadingMenu
                                                     ? 'rounded-lg bg-white' // màu background menu cha khi active
                                                     : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50', // màu background khi hover vào menu cha
                                                 'mx-3 flex cursor-pointer border-slate-200 p-2'), onClick: function () {
                                                     handleClickActivityHistoryChild(item);
                                                     subNavigationTriggerClicked(item);
-                                                } }, !dataInitMain.loadingMenu ? (react_2["default"].createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
-                                                react_2["default"].createElement("div", { className: 'flex items-center gap-x-3' },
-                                                    react_2["default"].createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
-                                                react_2["default"].createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : ('')))); }))))))))),
-            react_2["default"].createElement("div", { className: 'flex min-w-0 flex-1 flex-col overflow-hidden' },
-                react_2["default"].createElement("main", { className: 'flex flex-1 overflow-hidden' },
-                    react_2["default"].createElement("section", { "aria-labelledby": 'primary-heading', className: 'flex h-full min-w-0 flex-1 flex-col lg:order-last' },
-                        react_2["default"].createElement("div", { className: 'sticky top-0 z-10 flex h-14 flex-shrink-0 border-b border-l bg-bgcl-50 px-4 sm:px-6 lg:px-4' }),
-                        react_2["default"].createElement("div", { className: "".concat(openSubMenu ? 'lg:ml-[20.063rem]' : 'lg:ml-[5.063rem]', " bg-gray-100 px-6") },
-                            react_2["default"].createElement("div", { className: 'py-4' }, dataInitMain.isLoadingPermission ? ('') : enablePer(currentCode, dataInitMain.perCode) ? (children) : (react_2["default"].createElement(Card_1.PHXCard, null,
-                                react_2["default"].createElement("div", { className: 'mb-10 mt-10 sm:mb-20 sm:mt-20 lg:mb-32 lg:mt-32' },
-                                    react_2["default"].createElement("div", { className: 'flex items-center justify-center' },
-                                        react_2["default"].createElement(outline_1.LockClosedIcon, { className: 'text-gray-400', height: 70, width: 70 })),
-                                    react_2["default"].createElement("div", { className: 'mt-5 flex select-none items-center justify-center text-base font-bold text-gray-800' }, "B\u1EA1n kh\u00F4ng c\u00F3 quy\u1EC1n truy c\u1EADp"))))))))))));
+                                                } }, !dataInitMain.loadingMenu ? (react_2.default.createElement("div", { className: 'ml-1 flex items-center text-[0.84rem]' },
+                                                react_2.default.createElement("div", { className: 'flex items-center gap-x-3' },
+                                                    react_2.default.createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? '' : 'font-normal text-[#353A44]') }, item === null || item === void 0 ? void 0 : item.name)),
+                                                react_2.default.createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : ('')))); }))))))))),
+            react_2.default.createElement("div", { className: 'flex min-w-0 flex-1 flex-col overflow-hidden' },
+                react_2.default.createElement("main", { className: 'flex flex-1 overflow-hidden' },
+                    react_2.default.createElement("section", { "aria-labelledby": 'primary-heading', className: 'flex h-full min-w-0 flex-1 flex-col lg:order-last' },
+                        react_2.default.createElement("div", { className: 'sticky top-0 z-10 flex h-14 flex-shrink-0 border-b border-l bg-bgcl-50 px-4 sm:px-6 lg:px-4' }),
+                        react_2.default.createElement("div", { className: "".concat(openSubMenu ? 'lg:ml-[20.063rem]' : 'lg:ml-[5.063rem]', " bg-gray-100 px-6") },
+                            react_2.default.createElement("div", { className: 'py-4' }, dataInitMain.isLoadingPermission ? ('') : enablePer(currentCode, dataInitMain.perCode) ? (children) : (react_2.default.createElement(Card_1.PHXCard, null,
+                                react_2.default.createElement("div", { className: 'mb-10 mt-10 sm:mb-20 sm:mt-20 lg:mb-32 lg:mt-32' },
+                                    react_2.default.createElement("div", { className: 'flex items-center justify-center' },
+                                        react_2.default.createElement(outline_1.LockClosedIcon, { className: 'text-gray-400', height: 70, width: 70 })),
+                                    react_2.default.createElement("div", { className: 'mt-5 flex select-none items-center justify-center text-base font-bold text-gray-800' }, "B\u1EA1n kh\u00F4ng c\u00F3 quy\u1EC1n truy c\u1EADp"))))))))))));
 };
 exports.PHXMainWrapV3 = PHXMainWrapV3;
 //# sourceMappingURL=MainWrapV3.js.map