phx-react 1.3.800 → 1.3.804

package/dist/esm/components/MainWrap/MainWrap.js

@@ -1,796 +0,0 @@
-import { __awaiter, __generator, __spreadArray } from "tslib";
-import { fas } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { Dialog, Menu, Transition } from '@headlessui/react';
-import { Bars3Icon, XMarkIcon } from '@heroicons/react/24/outline';
-import React, { Fragment, useEffect, useState } from 'react';
-import NavMobile from './navigator/nav-mobile';
-import { PHXModal } from '../Modal';
-import { useLazyQuery } from '@apollo/client';
-import { GET_PERMISSION_DETAIL_USER, GET_SCHOOL, getCampaignName, queryProfile } from '../../query/gql';
-import { PHXSkeleton } from '../Skeleton';
-import { getEnv } from '../../read-env-config';
-import Cookies from 'js-cookie';
-import { ACTION_PERMISSION, AUTH_TOKEN, DEFAULT_AVATAR, DEFAULT_LOGO_DASHBOARD, DEFAULT_LOGO_LOGIN, DF_HEADER_BG_COLOR, DF_MENU_BG_ACTIVE_COLOR, DF_MENU_BG_COLOR, DF_MENU_HOVER_BG_COLOR, DF_MENU_ICON_ACTICE_COLOR, DF_MENU_ICON_AND_TEXT_HOVER_COLOR, DF_MENU_ICON_COLOR, DF_MENU_ICON_HOVER_COLOR, DF_MENU_TEXT_COLOR, DF_SEARCH_BG_COLOR, DF_SEARCH_BORDER_COLOR, DF_SEARCH_BORDER_HOVER_COLOR, DF_SEARCH_ICON_COLOR, DF_SEARCH_TEXT_COLOR, DF_SKELETON_COLOR, isLoggedCookie, KEY_SETTING, switchSchool, } from '../../utils/constants';
-import { ArrowLeftIcon } from '@heroicons/react/20/solid';
-import { library } from '@fortawesome/fontawesome-svg-core';
-import SearchDetail from './search/search-bar';
-import { PHXBanner } from '../Banner';
-import PHXClientQuery from '../Func/clientQueryV2';
-import { styles } from './style/sub-menu-style';
-import StyledCustomeLayout from './appearance/appearance-styled';
-import { CheckIcon, LockClosedIcon } from '@heroicons/react/24/solid';
-import PHXFuncGetLoggedInfo from '../Func/getLoginInfo';
-import { PHXCard } from '../Card';
-import saveCookiesClient from '../Func/saveCookiesClient';
-import { encryptDataSync } from '../Func/getActionPermission';
-library.add(fas);
-function classNames() {
-    var classes = [];
-    for (var _i = 0; _i < arguments.length; _i++) {
-        classes[_i] = arguments[_i];
-    }
-    return classes.filter(Boolean).join(' ');
-}
-export var PHXMainWrap = function (_a) {
-    var _b, _c, _d, _e;
-    var children = _a.children, params = _a.params, pathName = _a.pathName, router = _a.router, _f = _a.hiddenLeftMenu, hiddenLeftMenu = _f === void 0 ? false : _f, _g = _a.logoHeight, logoHeight = _g === void 0 ? '28px' : _g, getDataCookies = _a.getDataCookies, _h = _a.multipleMenu, multipleMenu = _h === void 0 ? false : _h;
-    var pid = (params ? params : {}).pid;
-    var _j = useState(false), modal = _j[0], setModal = _j[1];
-    var _k = useState(true), openSubMenu = _k[0], setOpenSubMenu = _k[1];
-    var _l = useState(''), campaignName = _l[0], setCampaignName = _l[1];
-    var _m = useState(false), sidebarOpen = _m[0], setSidebarOpen = _m[1];
-    var _o = useState([]), subNavigation = _o[0], setSubNavigation = _o[1];
-    var _p = useState([]), navigation = _p[0], setNavigation = _p[1];
-    var _q = useState([]), menu = _q[0], setMenu = _q[1];
-    var _r = useState(true), loadingSchool = _r[0], setLoadingSchool = _r[1];
-    var _s = useState(true), loadingMenu = _s[0], setLoadingMenu = _s[1];
-    var _t = useState(false), modalSignOut = _t[0], setModalSignOut = _t[1];
-    var _u = useState([]), infoSchool = _u[0], setInfoSchool = _u[1];
-    var _v = useState([]), roleCode = _v[0], setRoleCode = _v[1];
-    var _w = useState([]), perCode = _w[0], setPerCode = _w[1];
-    var _x = useState(null), schoolId = _x[0], setSchoolId = _x[1];
-    var _y = useState(true), showBanner = _y[0], setShowBanner = _y[1];
-    var _z = useState({}), configLayout = _z[0], setConfigLayout = _z[1];
-    var _0 = useState(true), isLoading = _0[0], setIsLoading = _0[1];
-    var _1 = useState(true), isLoadingPermission = _1[0], setIsLoadingPermission = _1[1];
-    var locationPathname = typeof window !== 'undefined' ? window.location.pathname : '';
-    var pathArr = locationPathname.split('/');
-    var pathNameWithBasePath = "/".concat(pathArr[1]).concat(pathName);
-    function enablePer(code, arr) {
-        if (!code)
-            return true;
-        return arr === null || arr === void 0 ? void 0 : arr.some(function (item) { return item === code; });
-    }
-    var _2 = useState({
-        path: '',
-        height: logoHeight
-    }), logo = _2[0], setLogo = _2[1];
-    var getCampaignById = useLazyQuery(getCampaignName, {
-        variables: {}
-    })[0];
-    var _3 = useLazyQuery(GET_SCHOOL, {
-        variables: {
-            group_id: '',
-            school_name_id: '',
-            user_id: ''
-        },
-        fetchPolicy: 'network-only',
-        notifyOnNetworkStatusChange: true
-    }), getSchool = _3[0], data = _3[1].data;
-    var getDataPermission = useLazyQuery(GET_PERMISSION_DETAIL_USER, {
-        variables: {
-            id: ''
-        },
-        fetchPolicy: 'network-only'
-    })[0];
-    var cookie = typeof window !== 'undefined' ? localStorage.getItem(isLoggedCookie) : null;
-    var authen = Cookies.get(AUTH_TOKEN);
-    function compareObjects(settingQuery, settingCookies) {
-        var keysSettingQuery = Object.keys(settingQuery);
-        if (keysSettingQuery.length !== Object.keys(settingCookies).length) {
-            return false;
-        }
-        for (var _i = 0, keysSettingQuery_1 = keysSettingQuery; _i < keysSettingQuery_1.length; _i++) {
-            var key = keysSettingQuery_1[_i];
-            if (!Object.prototype.hasOwnProperty.call(settingCookies, key)) {
-                return false;
-            }
-            if (settingQuery[key] !== settingCookies[key]) {
-                return false;
-            }
-        }
-        return true;
-    }
-    var getUser = PHXFuncGetLoggedInfo();
-    var userEmail = getUser === null || getUser === void 0 ? void 0 : getUser.email;
-    // xóa cookies với những tài khoản giáo viên, nhân viên đã nghỉ việc
-    var GetProfile = useLazyQuery(queryProfile, {
-        variables: {
-            email: userEmail
-        },
-        fetchPolicy: 'network-only',
-        notifyOnNetworkStatusChange: true
-    })[0];
-    // Lấy code phân quyền trong menu từ path hiện tại
-    function getCodesByPath(dataMenu, currentPath) {
-        var lastMatchingCode = null;
-        var normalizedPath = currentPath.replace(/\/$/, '');
-        function traverse(items, prefix) {
-            for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {
-                var item = items_1[_i];
-                var fullPath = item.path.startsWith('/') ? prefix + item.path : item.path;
-                var normalizedFullPath = fullPath.replace(/\/$/, '');
-                if (normalizedPath === normalizedFullPath || normalizedPath.startsWith(normalizedFullPath + '/')) {
-                    lastMatchingCode = item.code;
-                }
-                if (item.child) {
-                    traverse(item.child, prefix);
-                }
-            }
-        }
-        for (var _i = 0, dataMenu_1 = dataMenu; _i < dataMenu_1.length; _i++) {
-            var rootItem = dataMenu_1[_i];
-            var rootPath = rootItem.path;
-            var prefix = rootPath.split('/').slice(0, 2).join('/');
-            traverse([rootItem], prefix);
-        }
-        return lastMatchingCode ? lastMatchingCode : null;
-    }
-    // code phân quyền path hiện tại
-    var currentCode = getCodesByPath(navigation, locationPathname);
-    var getProfileData = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var response, profileStaff, profileTeacher, error_1;
-        var _a, _b, _c, _d, _e, _f;
-        return __generator(this, function (_g) {
-            switch (_g.label) {
-                case 0:
-                    _g.trys.push([0, 2, , 3]);
-                    return [4 /*yield*/, PHXClientQuery(GetProfile)];
-                case 1:
-                    response = _g.sent();
-                    profileStaff = (_c = (_b = (_a = response.data) === null || _a === void 0 ? void 0 : _a.profile_staff) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.is_quit_job;
-                    profileTeacher = (_f = (_e = (_d = response.data) === null || _d === void 0 ? void 0 : _d.profile_teacher) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.is_quit_job;
-                    if (profileStaff || profileTeacher) {
-                        console.log('Phiên đăng nhập đã hết hạn');
-                        Object.keys(Cookies.get()).forEach(function (cookieName) {
-                            Cookies.remove(cookieName);
-                        });
-                        localStorage.removeItem(isLoggedCookie);
-                    }
-                    return [3 /*break*/, 3];
-                case 2:
-                    error_1 = _g.sent();
-                    console.log(error_1);
-                    return [3 /*break*/, 3];
-                case 3: return [2 /*return*/];
-            }
-        });
-    }); };
-    useEffect(function () {
-        getProfileData();
-        Cookies.remove(isLoggedCookie);
-    }, []);
-    useEffect(function () {
-        var _a;
-        if (!cookie || !authen) {
-            // Require login if production mode
-            requireLoginValidation();
-        }
-        else {
-            var data_1 = JSON.parse(cookie);
-            var allRoleCodes = (_a = data_1 === null || data_1 === void 0 ? void 0 : data_1.user_roles) === null || _a === void 0 ? void 0 : _a.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; });
-            var _b = data_1.school, group_id_1 = _b.school_name.group_id, school_name_id_1 = _b.school_name_id, school_id_1 = data_1.school_id, id_1 = data_1.id;
-            setRoleCode(allRoleCodes);
-            setSchoolId(data_1 === null || data_1 === void 0 ? void 0 : data_1.school_id);
-            var fetchData = function () { return __awaiter(void 0, void 0, void 0, function () {
-                var res, data_2, dataLength, settingFetchData, cleanedJsonString, jsonObjectSetting, getSeting, dataCompare, error_2;
-                var _a, _b, _c, _d;
-                return __generator(this, function (_e) {
-                    switch (_e.label) {
-                        case 0:
-                            setIsLoading(true);
-                            _e.label = 1;
-                        case 1:
-                            _e.trys.push([1, 3, , 4]);
-                            return [4 /*yield*/, PHXClientQuery(getSchool, { variables: { group_id: group_id_1, school_name_id: school_name_id_1, user_id: id_1 } }, false)];
-                        case 2:
-                            res = _e.sent();
-                            data_2 = (_b = (_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.school_name[0]) === null || _b === void 0 ? void 0 : _b.schools;
-                            dataLength = data_2.length;
-                            if (data_2 && dataLength > 0) {
-                                setLoadingSchool(false);
-                            }
-                            setInfoSchool(data_2);
-                            setIsLoading(false);
-                            settingFetchData = (_d = (_c = res === null || res === void 0 ? void 0 : res.data) === null || _c === void 0 ? void 0 : _c.setting_site[0]) === null || _d === void 0 ? void 0 : _d.value_setting;
-                            if (settingFetchData) {
-                                cleanedJsonString = settingFetchData.replace(/^"(.*)"$/, '$1');
-                                jsonObjectSetting = JSON.parse(cleanedJsonString);
-                                setConfigLayout(jsonObjectSetting);
-                                getSeting = Cookies.get(KEY_SETTING);
-                                // Nếu chưa có cookeis
-                                if (!getSeting) {
-                                    Cookies.set(KEY_SETTING, JSON.stringify(jsonObjectSetting));
-                                    return [2 /*return*/];
-                                }
-                                dataCompare = compareObjects(jsonObjectSetting, JSON.parse(getSeting));
-                                if (dataCompare) {
-                                    console.log('log debug database === cookies');
-                                    return [2 /*return*/];
-                                }
-                                console.log('log debug database !== cookies');
-                                Cookies.set(KEY_SETTING, JSON.stringify(jsonObjectSetting));
-                            }
-                            return [3 /*break*/, 4];
-                        case 3:
-                            error_2 = _e.sent();
-                            setIsLoading(false);
-                            console.error('Error fetching school data:', error_2);
-                            return [3 /*break*/, 4];
-                        case 4: return [2 /*return*/];
-                    }
-                });
-            }); };
-            fetchData()["catch"](function (err) {
-                console.log(err);
-                setIsLoading(false);
-            });
-            var allRoleCodesLength = allRoleCodes === null || allRoleCodes === void 0 ? void 0 : allRoleCodes.length;
-            if (allRoleCodes && allRoleCodesLength > 0) {
-                var fetchDataPer = function () { return __awaiter(void 0, void 0, void 0, function () {
-                    var res, userPermission, rolePermission, dataPermissionUser, permissionRouter, permissionAction, objPermissionAction, encryptedData, uniqueValues, error_3;
-                    var _a, _b, _c, _d;
-                    return __generator(this, function (_e) {
-                        switch (_e.label) {
-                            case 0:
-                                _e.trys.push([0, 3, 4, 5]);
-                                return [4 /*yield*/, getDataPermission({
-                                        variables: { id: id_1, school_id: school_id_1 }
-                                    })];
-                            case 1:
-                                res = _e.sent();
-                                userPermission = (_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.permission_user;
-                                rolePermission = (_b = res === null || res === void 0 ? void 0 : res.data) === null || _b === void 0 ? void 0 : _b.permission_role;
-                                dataPermissionUser = __spreadArray(__spreadArray([], userPermission, true), rolePermission, true);
-                                permissionRouter = (_c = dataPermissionUser === null || dataPermissionUser === void 0 ? void 0 : dataPermissionUser.filter(function (value) { var _a; return !((_a = value === null || value === void 0 ? void 0 : value.permission) === null || _a === void 0 ? void 0 : _a.is_action); })) === null || _c === void 0 ? void 0 : _c.map(function (item) { var _a; return (_a = item === null || item === void 0 ? void 0 : item.permission) === null || _a === void 0 ? void 0 : _a.code; });
-                                permissionAction = (_d = dataPermissionUser === null || dataPermissionUser === void 0 ? void 0 : dataPermissionUser.filter(function (value) { var _a; return (_a = value === null || value === void 0 ? void 0 : value.permission) === null || _a === void 0 ? void 0 : _a.is_action; })) === null || _d === void 0 ? void 0 : _d.map(function (item) { var _a; return (_a = item === null || item === void 0 ? void 0 : item.permission) === null || _a === void 0 ? void 0 : _a.code; });
-                                objPermissionAction = Object.fromEntries(permissionAction.map(function (key) { return [key, true]; }));
-                                encryptedData = encryptDataSync(objPermissionAction);
-                                return [4 /*yield*/, saveCookiesClient(ACTION_PERMISSION, JSON.stringify(encryptedData), true)];
-                            case 2:
-                                _e.sent();
-                                uniqueValues = Array.from(new Set(permissionRouter));
-                                setPerCode(uniqueValues);
-                                return [3 /*break*/, 5];
-                            case 3:
-                                error_3 = _e.sent();
-                                console.error('Error fetching school data:', error_3);
-                                return [3 /*break*/, 5];
-                            case 4:
-                                setIsLoadingPermission(false);
-                                return [7 /*endfinally*/];
-                            case 5: return [2 /*return*/];
-                        }
-                    });
-                }); };
-                fetchDataPer()["catch"](console.error);
-            }
-        }
-    }, [cookie, authen]);
-    useEffect(function () {
-        // Let load left menu data
-        if (loadingMenu) {
-            var fetchDataMenu = function (url) { return __awaiter(void 0, void 0, void 0, function () {
-                var data, json;
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0: return [4 /*yield*/, fetch(url)];
-                        case 1:
-                            data = _a.sent();
-                            return [4 /*yield*/, data.json()];
-                        case 2:
-                            json = _a.sent();
-                            setMenu(json);
-                            setLoadingMenu(false);
-                            return [2 /*return*/];
-                    }
-                });
-            }); };
-            var publicEnvSchoolMenu = getEnv('NEXT_PUBLIC_ENV_SCHOOL_MENU', process.env.NEXT_PUBLIC_ENV_SCHOOL_MENU);
-            var publicEnvSchoolLogo = getEnv('NEXT_PUBLIC_ENV_SCHOOL_TOP_MENU_LOGO', process.env.NEXT_PUBLIC_ENV_SCHOOL_TOP_MENU_LOGO);
-            if (!publicEnvSchoolMenu || !publicEnvSchoolLogo) {
-                console.error('menu or logo not found');
-            }
-            fetchDataMenu(publicEnvSchoolMenu)["catch"](console.error);
-            setLogo({ path: publicEnvSchoolLogo, height: logoHeight });
-        }
-    }, [loadingMenu, menu]);
-    var requireLoginValidation = function () {
-        var currentURL = window.location.href;
-        var url = currentURL.split('/');
-        var loginPush = "".concat(url[0], "//").concat(url[2], "/login-sso");
-        window.location.replace(loginPush);
-    };
-    var isEqualUrl = function (parentHref, pathName) {
-        if (!parentHref || !pathName) {
-            return false;
-        }
-        var pathNameSplit = pathName.split('/');
-        var hrefSplit = parentHref.split('/');
-        if (!pathNameSplit || !hrefSplit) {
-            return false;
-        }
-        var urlRouter;
-        var currentMenu;
-        if (multipleMenu) {
-            urlRouter = pathNameSplit[1] + pathNameSplit[2];
-            currentMenu = hrefSplit[1] + hrefSplit[2];
-        }
-        else {
-            urlRouter = pathNameSplit[1];
-            currentMenu = hrefSplit[1];
-        }
-        return urlRouter === currentMenu;
-    };
-    var isBelongParent = function (parentUrl, pathName) {
-        var parentSplit = parentUrl.split('/');
-        var pathNameSplit = pathName.split('/');
-        if (parentSplit.length > 2 && !parentSplit.includes('list')) {
-            return parentSplit[1] === pathNameSplit[2] && parentSplit[2] === pathNameSplit[3];
-        }
-        else {
-            return parentSplit[1] === pathNameSplit[2];
-        }
-    };
-    var checkAdmissions = function (path) {
-        var pathNameSplit = path.split('/');
-        return pathNameSplit[1] === 'admissions';
-    };
-    var loadParentNavigation = function (path) {
-        var mainNavigation = menu;
-        var naviSize = mainNavigation.length;
-        for (var i = 0; i < naviSize; i++) {
-            var item = mainNavigation[i];
-            item.current = false;
-            if (item.path === path || isEqualUrl(item.path, path)) {
-                item.current = true;
-                // Find sub modules
-                var itemLength = item.child.length;
-                var listChildren = [];
-                for (var j = 0; j < itemLength; j++) {
-                    var childItem = item.child[j];
-                    // Active child item
-                    childItem.current = isBelongParent(childItem.path, path);
-                    if (childItem.child) {
-                        var childItemLength = childItem.child.length;
-                        var count = 0;
-                        for (var k = 0; k < childItemLength; k++) {
-                            var subChild = childItem.child[k];
-                            subChild.current = isBelongParent(subChild.path, path);
-                            if (isBelongParent(subChild.path, path) || isBelongParent(childItem.path, path)) {
-                                count++;
-                            }
-                            count > 0 ? (childItem.showChild = true) : (childItem.showChild = false);
-                            subChild.path === childItem.path ? (childItem.current = false) : null;
-                        }
-                    }
-                    listChildren.push(childItem);
-                }
-                setSubNavigation(listChildren);
-            }
-        }
-        setNavigation(mainNavigation);
-    };
-    var loadChildrenCampaign = function (path) {
-        var mainNavigation = menu;
-        var naviSize = mainNavigation.length;
-        for (var i = 0; i < naviSize; i++) {
-            var item = mainNavigation[i];
-            item.current = false;
-            if (item.path === path || isEqualUrl(item.path, path)) {
-                item.current = true;
-                // Find sub modules
-                // const itemLength = item.child.length;
-                var campaign = item.child.filter(function (child) { return child.path === '/campaign/list'; });
-                var listCampaign = campaign[0];
-                var itemLength = listCampaign === null || listCampaign === void 0 ? void 0 : listCampaign.childrenByParentDetail.length;
-                var listChildren = [];
-                for (var j = 0; j < itemLength; j++) {
-                    var childItem = listCampaign === null || listCampaign === void 0 ? void 0 : listCampaign.childrenByParentDetail[j];
-                    // Active child item
-                    childItem.current = isBelongParent(childItem.path, path);
-                    if (childItem.child) {
-                        var childItemLength = childItem.child.length;
-                        for (var k = 0; k < childItemLength; k++) {
-                            var subChild = childItem.child[k];
-                            subChild.current = isBelongParent(subChild.path, path);
-                            if (isBelongParent(subChild.path, path) || isBelongParent(childItem.path, path))
-                                childItem.showChild = true;
-                            subChild.path === childItem.path ? (childItem.current = false) : null;
-                        }
-                    }
-                    listChildren.push(childItem);
-                }
-                setSubNavigation(listChildren);
-            }
-        }
-        setNavigation(mainNavigation);
-    };
-    var checkChildrenCampaign = function (path) {
-        var campaignMenu = menu === null || menu === void 0 ? void 0 : menu.find(function (item) { return item.path === '/admissions/campaign/list'; });
-        var campaignChild = campaignMenu === null || campaignMenu === void 0 ? void 0 : campaignMenu.child;
-        var listChild = campaignChild === null || campaignChild === void 0 ? void 0 : campaignChild.find(function (item) { return item.path === '/campaign/list'; });
-        var isChild = listChild === null || listChild === void 0 ? void 0 : listChild.childrenByParentDetail.find(function (item) { return isBelongParent(item.path, path); });
-        return isChild !== undefined;
-    };
-    useEffect(function () {
-        var isAdmissions = checkAdmissions(pathNameWithBasePath);
-        if (isAdmissions && checkChildrenCampaign(pathNameWithBasePath)) {
-            if (pathNameWithBasePath.includes('/admissions/overview/list/') && pid) {
-                getCampaignById({ variables: { id: pid } }).then(function (res) {
-                    var data = res.data.admissions_campaigns_by_pk;
-                    setCampaignName(data.campaign_name);
-                    Cookies.set('campaign_name', JSON.stringify(data.campaign_name));
-                });
-                loadChildrenCampaign(pathNameWithBasePath);
-            }
-            else if (pathNameWithBasePath === '/admissions/campaign/list') {
-                loadParentNavigation(pathNameWithBasePath);
-            }
-            else {
-                loadChildrenCampaign(pathNameWithBasePath);
-            }
-        }
-        else {
-            loadParentNavigation(pathNameWithBasePath);
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [menu, pid, pathNameWithBasePath]);
-    useEffect(function () {
-        var isAdmissions = checkAdmissions(pathNameWithBasePath);
-        if (isAdmissions) {
-            if (pathNameWithBasePath === '/admissions/campaign/list' || !checkChildrenCampaign(pathNameWithBasePath)) {
-                setOpenSubMenu(true);
-            }
-            else {
-                setOpenSubMenu(true);
-                var campaign_name = Cookies.get('campaign_name');
-                setCampaignName(campaign_name ? JSON.parse(campaign_name) : campaignName);
-                loadChildrenCampaign(pathNameWithBasePath);
-            }
-        }
-        else {
-            setOpenSubMenu(true);
-        }
-    }, [pathNameWithBasePath, menu]);
-    var loadSubNavigation = function (path, isChild, childPath) {
-        var subLength = subNavigation.length;
-        var newSub = [];
-        for (var i = 0; i < subLength; i++) {
-            var item = subNavigation[i];
-            item.current = item.path === path && !isChild;
-            if (item.child) {
-                item.showChild = item.path === path;
-                for (var j = 0; j < item.child.length; j++) {
-                    var child = item.child[j];
-                    child.current = child.path === childPath;
-                    if (child.path === item.path) {
-                        item.current = false;
-                        child.current = childPath ? child.path === childPath : child.path === path;
-                    }
-                }
-            }
-            newSub.push(item);
-        }
-        setSubNavigation(newSub);
-    };
-    var triggerClicked = function (path) {
-        loadParentNavigation(path);
-    };
-    var handleClicked = function (path) {
-        triggerClicked(path);
-    };
-    var subNavigationTriggerClicked = function (item, parent) {
-        parent ? loadSubNavigation(parent.path, true, item.path) : loadSubNavigation(item.path, false);
-        var queryString = window.location.search;
-        var urlParams = new URLSearchParams(queryString);
-        var campaign = Number(urlParams.get('campaignId'));
-        // handle for admissions
-        if (campaign) {
-            router.push("".concat(item.path, "?campaignId=").concat(campaign));
-        }
-        else {
-            router.push(item.path);
-        }
-    };
-    var path = logo.path, height = logo.height;
-    var handleModalSignOut = function () { return setModalSignOut(true); };
-    var handleRedirectRouter = function (path) {
-        var currentURL = window.location.href;
-        var url = currentURL.split('/');
-        var pushPath = "".concat(url[0], "//").concat(url[2], "/").concat(path);
-        window.location.replace(pushPath);
-    };
-    var handleSignOut = function () {
-        setModalSignOut(false);
-        Object.keys(Cookies.get()).forEach(function (cookieName) {
-            Cookies.remove(cookieName);
-        });
-        localStorage.removeItem(isLoggedCookie);
-        console.log('Đăng xuất tài khoản');
-        handleRedirectRouter('login-sso');
-    };
-    var handleProfilePage = function () {
-        handleRedirectRouter('profile');
-    };
-    var handleBackMenu = function () {
-        router.push('/campaign/list');
-        loadParentNavigation('/admissions/campaign/list');
-    };
-    var checkChildBefore = function (item, currentItem) {
-        var currentIndexActive = item.find(function (s) { return s.current; });
-        return currentIndexActive ? currentIndexActive.id > currentItem.id : false;
-    };
-    var _4 = useState(false), openNavName = _4[0], setOpenNavName = _4[1];
-    var _5 = useState(false), showSearchBar = _5[0], setShowSearchBar = _5[1];
-    var _6 = useState(null), selected = _6[0], setSelected = _6[1];
-    var handleOpenModal = function (id) {
-        setModal(id !== schoolId);
-        setSelected(id);
-    };
-    var handlePrimaryModal = function () {
-        if (cookie) {
-            try {
-                var data_3 = JSON.parse(cookie);
-                if (data_3) {
-                    var newSchoolId = selected;
-                    if (newSchoolId && newSchoolId !== data_3.school_id) {
-                        data_3.school_id = newSchoolId;
-                        var updatedCookie = JSON.stringify(data_3);
-                        localStorage.setItem(isLoggedCookie, updatedCookie);
-                        window.location.replace('/');
-                    }
-                }
-            }
-            catch (error) {
-                console.error(error);
-            }
-        }
-        setModal(false);
-    };
-    var avatar = (_b = data === null || data === void 0 ? void 0 : data.users[0]) === null || _b === void 0 ? void 0 : _b.avatar;
-    var defaultAvatar = DEFAULT_AVATAR;
-    var sourceAvatar = !avatar ? defaultAvatar : avatar;
-    // settings page
-    var isSettings = function () {
-        var pathNameSplit = pathNameWithBasePath.split('/');
-        return pathNameSplit[1] === 'setting';
-    };
-    var defaultSettingLayout = {
-        df_header_bg_color: DF_HEADER_BG_COLOR,
-        df_logo_login: DEFAULT_LOGO_LOGIN,
-        df_logo_dashboard: DEFAULT_LOGO_DASHBOARD,
-        df_color_loading_skeleton: DF_SKELETON_COLOR,
-        df_search_icon_color: DF_SEARCH_ICON_COLOR,
-        df_search_bg_color: DF_SEARCH_BG_COLOR,
-        df_search_border_color: DF_SEARCH_BORDER_COLOR,
-        df_search_border_hover_color: DF_SEARCH_BORDER_HOVER_COLOR,
-        df_search_text_color: DF_SEARCH_TEXT_COLOR,
-        df_menu_bg_color: DF_MENU_BG_COLOR,
-        df_menu_text_color: DF_MENU_TEXT_COLOR,
-        df_menu_bg_active: DF_MENU_BG_ACTIVE_COLOR,
-        df_menu_icon_color: DF_MENU_ICON_COLOR,
-        df_menu_icon_hover: DF_MENU_ICON_HOVER_COLOR,
-        df_menu_text_and_icon_hover_color: DF_MENU_ICON_AND_TEXT_HOVER_COLOR,
-        df_menu_icon_active: DF_MENU_ICON_ACTICE_COLOR,
-        df_menu_hover_bg: DF_MENU_HOVER_BG_COLOR
-    };
-    var settingLength = (_d = (_c = data === null || data === void 0 ? void 0 : data.setting_site) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0;
-    var df_logo_dashboard = defaultSettingLayout === null || defaultSettingLayout === void 0 ? void 0 : defaultSettingLayout.df_logo_dashboard;
-    var logo_dashboard = configLayout === null || configLayout === void 0 ? void 0 : configLayout.logo_dashboard;
-    var checkLogoHeader = settingLength === 0 ? df_logo_dashboard : logo_dashboard || path;
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: 'flex min-h-full flex-col' },
-            React.createElement(StyledCustomeLayout, { defaultSettingLayout: defaultSettingLayout, data: data, configLayout: configLayout, settingLocal: getDataCookies }),
-            React.createElement("header", { className: 'fixed top-0 z-50 min-w-full border-gray-200 bg-white header-color-styled' },
-                React.createElement("div", { className: 'mx-auto flex h-14 items-center justify-between pr-4 bg-[#1a1a1a] header-styled' },
-                    React.createElement("div", { className: 'flex items-center lg:w-32 gap-x-3' },
-                        React.createElement("a", { href: '/', className: 'w-full flex items-center' }, path ? (React.createElement(React.Fragment, null, isLoading ? (React.createElement("div", { className: 'animate-pulse w-full h-8 ml-3 header-loading-logo' })) : (React.createElement("img", { alt: 'Logo', className: 'w-auto ml-3', src: checkLogoHeader, style: { height: height } })))) : (React.createElement(React.Fragment, null))),
-                        React.createElement("div", { className: 'lg:hidden flex items-center' },
-                            React.createElement("button", { className: 'bg-grey-100 mr-3 inline-flex p-1 items-center justify-center rounded-md text-gray-600 hover:bg-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white', onClick: function () { return setSidebarOpen(true); }, type: 'button' },
-                                React.createElement("span", { className: 'sr-only' }, "Open sidebar"),
-                                React.createElement(Bars3Icon, { "aria-hidden": 'true', className: 'h-6 w-6' })))),
-                    React.createElement("div", { "aria-hidden": true, className: 'hidden sm:block w-[30%] h-8 bg-indigo-700 rounded-lg border border-indigo-500 relative hover:border-gray-200 cursor-pointer search-box-styled', onClick: function () { return setShowSearchBar(true); } },
-                        React.createElement("div", { className: 'relative text-indigo-400 flex items-center gap-x-3 text-xs top-1.5 left-2.5' },
-                            React.createElement("div", { className: 'flex items-center' },
-                                React.createElement("svg", { xmlns: 'http://www.w3.org/2000/svg', fill: 'none', viewBox: '0 0 24 24', strokeWidth: '1.5', stroke: 'currentColor', className: 'w-4 h-4' },
-                                    React.createElement("path", { strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z' })),
-                                React.createElement("p", { className: 'ml-2' }, "T\u00ECm ki\u1EBFm")))),
-                    React.createElement(SearchDetail, { open: showSearchBar, onClose: function () { return setShowSearchBar(false); } }),
-                    React.createElement("div", { className: 'flex items-center gap-x-8' },
-                        React.createElement("div", { className: '-m-1.5 p-1.5' },
-                            React.createElement(Menu, { as: 'div', className: 'relative ml-3' },
-                                React.createElement("div", null,
-                                    React.createElement(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.createElement("span", { className: 'sr-only' }, "Open user menu"),
-                                        isLoading ? (React.createElement("div", { className: 'animate-pulse flex' },
-                                            React.createElement("div", { className: 'rounded-full h-8 w-8 header-loading-avatar' }))) : (React.createElement("img", { alt: '', className: 'h-8 w-8 rounded-full', src: sourceAvatar })))),
-                                React.createElement(Transition, { as: 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.createElement(Menu.Items, { className: ' px-2 absolute right-0 z-10 mt-2 w-[340px] origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none' },
-                                        React.createElement(Menu.Item, null,
-                                            React.createElement("div", { "aria-hidden": true, className: 'px-2 pt-4 pb-2 font-semibold text-gray-900 text-sm ' }, "Ch\u1ECDn tr\u01B0\u1EDDng")),
-                                        !loadingSchool ? (React.createElement(React.Fragment, null, infoSchool
-                                            .filter(function (val) {
-                                            if (!enablePer(switchSchool, perCode)) {
-                                                return val.id === schoolId;
-                                            }
-                                            else {
-                                                return true;
-                                            }
-                                        })
-                                            .map(function (item) { return (React.createElement(Menu.Item, { key: item.id },
-                                            React.createElement("div", { "aria-hidden": true, className: "".concat(item.id === schoolId &&
-                                                    infoSchool.length > 1 &&
-                                                    !enablePer(switchSchool, perCode) === false
-                                                    ? 'rounded-lg bg-zinc-200 text-gray-900 font-semibold '
-                                                    : 'font-normal   ', " \n                                  ").concat(item.id !== schoolId &&
-                                                    (infoSchool.length === 1 || !enablePer(switchSchool, perCode)) === false
-                                                    ? 'hover:bg-gray-100 hover:rounded-lg cursor-pointer'
-                                                    : '', "\n                              py-1.5 relative  px-2 mb-1 text-gray-900 text-sm  flex justify-between items-center"), onClick: function () { return handleOpenModal(item.id); } },
-                                                React.createElement("p", { className: 'truncate max-w-[95%]' }, item.name),
-                                                item.id === schoolId &&
-                                                    infoSchool.length > 1 &&
-                                                    !enablePer(switchSchool, perCode) === false && (React.createElement(CheckIcon, { "aria-hidden": 'true', className: 'h-4 w-4' }))))); }))) : (React.createElement(PHXSkeleton, { className: 'flex-1 py-2 px-2', type: 'single' })),
-                                        React.createElement("div", { className: 'border-b pt-1.5' }),
-                                        React.createElement(Menu.Item, null,
-                                            React.createElement("div", { "aria-hidden": true, className: 'pt-4 px-2 pb-2  font-semibold text-gray-900 text-sm' }, "T\u00F9y ch\u1ECDn")),
-                                        React.createElement(Menu.Item, null,
-                                            React.createElement("div", { "aria-hidden": true, className: 'py-1.5 px-2 cursor-pointer text-gray-900 text-sm hover:bg-gray-100 hover:rounded-lg', onClick: handleProfilePage }, "Th\u00F4ng tin c\u00E1 nh\u00E2n")),
-                                        React.createElement(Menu.Item, null,
-                                            React.createElement("div", { "aria-hidden": true, className: 'py-1.5 px-2 mb-2.5 cursor-pointer text-[#8e1f0c] text-sm hover:bg-gray-100 hover:rounded-lg', onClick: handleModalSignOut }, "\u0110\u0103ng xu\u1EA5t")))))))))),
-        React.createElement("div", null,
-            React.createElement(PHXModal, { dangerActionText: '\u0110\u0103ng xu\u1EA5t', onDangerClick: handleSignOut, onHide: function () { return setModalSignOut(false); }, primaryActionText: '', show: modalSignOut, title: '\u0110\u0103ng xu\u1EA5t' },
-                React.createElement("div", { className: 'text-gray-700 text-sm' }, "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.createElement(PHXModal, { onHide: function () { return setModal(false); }, primaryActionText: 'X\u00E1c nh\u1EADn', show: modal, onPrimaryClick: handlePrimaryModal, title: 'X\u00E1c nh\u1EADn thay \u0111\u1ED5i tr\u01B0\u1EDDng' },
-            React.createElement(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.createElement("div", { className: 'relative flex min-h-screen bg-[#f1f1f1]' },
-            React.createElement(Transition.Root, { as: Fragment, show: sidebarOpen },
-                React.createElement(Dialog, { as: 'div', className: 'relative z-40 lg:hidden', onClose: setSidebarOpen },
-                    React.createElement(Transition.Child, { as: Fragment, enter: 'transition-opacity ease-linear duration-300', enterFrom: 'opacity-0', enterTo: 'opacity-100', leave: 'transition-opacity ease-linear duration-300', leaveFrom: 'opacity-100', leaveTo: 'opacity-0' },
-                        React.createElement("div", { className: 'fixed inset-0 bg-gray-600 bg-opacity-75' })),
-                    React.createElement("div", { className: 'fixed inset-0 z-40 flex' },
-                        React.createElement(Transition.Child, { as: 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' },
-                            React.createElement(Dialog.Panel, { className: 'relative flex w-full max-w-xs flex-1 flex-col bg-[#ebebeb]' },
-                                React.createElement(Transition.Child, { as: Fragment, enter: 'ease-in-out duration-300', enterFrom: 'opacity-0', enterTo: 'opacity-100', leave: 'ease-in-out duration-300', leaveFrom: 'opacity-100', leaveTo: 'opacity-0' },
-                                    React.createElement("div", { className: 'absolute right-0 top-0 -mr-12 pt-2' },
-                                        React.createElement("button", { className: 'ml-1 flex h-10 w-10 items-center justify-center rounded-full focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white', onClick: function () { return setSidebarOpen(false); }, type: 'button' },
-                                            React.createElement("span", { className: 'sr-only' }, "Close sidebar"),
-                                            React.createElement(XMarkIcon, { "aria-hidden": 'true', className: 'h-6 w-6 text-white' })))),
-                                React.createElement("div", { className: 'mt-8 h-0 flex-1 overflow-y-auto pb-4 pt-5' },
-                                    React.createElement(NavMobile, { setSideBarOpen: function () { return setSidebarOpen(false); }, permission: perCode, menu: menu, path: pathNameWithBasePath, router: router })))),
-                        React.createElement("div", { "aria-hidden": 'true', className: 'w-14 flex-shrink-0' })))),
-            React.createElement("div", { className: 'hidden lg:flex lg:flex-shrink-0' },
-                React.createElement("div", { className: 'flex' },
-                    React.createElement("div", { className: 'mt-14 flex lg:inset-y-0' },
-                        React.createElement("div", { "aria-hidden": true, className: "".concat(openNavName ? 'w-64' : 'w-14', " transition-all duration-300 z-10 flex h-full flex-col justify-between border-r bg-[#f1f1f1] lg:fixed menu-styled"), onMouseOver: function () { return setOpenNavName(true); }, onMouseOut: function () { return setOpenNavName(false); } },
-                            React.createElement("div", { className: classNames('#ebebeb flex flex-1 flex-col', openNavName ? 'overflow-y-auto' : 'overflow-y-hidden') },
-                                React.createElement("div", { className: 'flex-1 relative' },
-                                    React.createElement("div", { "aria-label": 'Sidebar', className: 'hidden md:block md:flex-shrink-0 md:overflow-y-auto overflow-x-hidden' }, !hiddenLeftMenu && (React.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.createElement("div", { key: index, className: 'w-full' }, (roleCode === null || roleCode === void 0 ? void 0 : roleCode.length) > 0 ? (React.createElement(React.Fragment, null, enablePer(item.code, perCode) && (React.createElement("a", { className: "".concat(classNames(item.current && !openNavName
-                                            ? 'font-semibold menu-bg-color-icon-active-styled' // màu background của icon đang active của menu
-                                            : 'font-medium menu-icon-color-styled', // màu icon của menu
-                                        !openNavName
-                                            ? 'mb-1.5 inline-flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg'
-                                            : 'mb-1.5 inline-flex h-8 flex-shrink-0 items-center rounded-lg min-w-full', openNavName && item.current
-                                            ? 'rounded-lg menu-bg-color-icon-active-styled'
-                                            : 'hover:rounded-lg hover:bg-opacity-50 menu-hover-bg')), href: item.path, onClick: function () { return handleClicked(item.path); }, onMouseOver: function () { return setOpenNavName(true); } },
-                                        React.createElement("span", { className: 'sr-only' }, item.name),
-                                        React.createElement("span", { className: classNames(!openNavName
-                                                ? 'group cursor-pointer hover:fixed hover:z-10 focus-visible:outline-none mt-0.5'
-                                                : "flex gap-x-2 ".concat(item.menuIconSL ? 'pl-[3px] pt-[2px]' : 'pl-[0.45rem]')) },
-                                            item.menuIconSL ? (React.createElement("img", { src: item.menuIconSL, className: 'w-[1.6rem]', alt: 'icon' })) : (React.createElement(FontAwesomeIcon, { className: 'h-[1.125rem] w-[1.125rem] mt-1', icon: item.image })),
-                                            openNavName && (React.createElement("div", { className: 'h-6' },
-                                                React.createElement("p", { className: "transition-all h-full duration-300 text-[0.86rem] mt-0.5 ".concat(openNavName ? 'opacity-100' : 'opacity-0', " ").concat(item.current ? 'font-semibold' : '') }, item.name)))))))) : (React.createElement("a", { className: classNames(item.current && !openNavName
-                                            ? 'text-indigo-900 font-semibold menu-bg-color-icon-active-styled' // màu background của icon đang active trong menu
-                                            : 'text-gray-700 font-medium menu-icon-color-styled', // màu icon
-                                        !openNavName
-                                            ? 'mb-1.5 inline-flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg'
-                                            : 'mb-1.5 inline-flex h-8 flex-shrink-0 items-center rounded-lg min-w-full', openNavName && item.current
-                                            ? 'rounded-lg text-indigo-900 menu-bg-color-icon-active-styled' // màu background của icon đang active
-                                            : 'hover:rounded-lg hover:bg-opacity-50 menu-hover-bg'), href: item.path, onClick: function () { return handleClicked(item.path); }, onMouseOver: function () { return setOpenNavName(true); } },
-                                        React.createElement("span", { className: classNames(!openNavName
-                                                ? 'group cursor-pointer hover:fixed hover:z-10 focus-visible:outline-none mt-0.5'
-                                                : "flex gap-x-2 ".concat(item.menuIconSL ? 'pl-[3px] pt-[2px]' : 'pl-[0.45rem]')) },
-                                            item.menuIconSL ? (React.createElement("img", { src: item.menuIconSL, className: 'w-[1.6rem]', alt: 'icon' })) : (React.createElement(FontAwesomeIcon, { className: 'h-[1.125rem] w-[1.125rem] mt-1', icon: item.image })),
-                                            openNavName && (React.createElement("div", { className: 'h-6' },
-                                                React.createElement("p", { className: "transition-all h-full duration-300 text-[0.86rem] mt-0.5 ".concat(openNavName ? 'opacity-100' : 'opacity-0', " ").concat(item.current ? 'font-semibold' : '', " ") }, item.name)))))))); })))))),
-                            React.createElement("div", { className: classNames('border-t', navigation.length > 0 && ((_e = navigation[0]) === null || _e === void 0 ? void 0 : _e.isSchoolink) ? 'border-[#1c222b]' : 'border-indigo-100') },
-                                React.createElement("div", { className: "mb-14 space-y- flex ".concat(openNavName ? 'w-64' : 'w-12', " overflow-hidden p-3") },
-                                    React.createElement("a", { className: classNames('text-gray-700 font-medium', !openNavName
-                                            ? 'inline-flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg'
-                                            : 'inline-flex h-8 flex-shrink-0 items-center rounded-lg hover:rounded-lg hover:bg-opacity-50 min-w-full', isSettings() && !openNavName
-                                            ? 'text-indigo-900 font-semibold setting-bg-icon-active' // màu background của icon đang active trong menu
-                                            : 'text-gray-700 font-medium setting-icon-color', // màu icon
-                                        openNavName && isSettings()
-                                            ? 'rounded-lg text-indigo-900 setting-bg-icon-active' // màu background của icon đang active trong menu
-                                            : 'hover:rounded-lg hover:bg-opacity-50 setting-hover-bg'), href: '/setting', 
-                                        // onClick={() => handleClicked(item.path)}
-                                        onMouseOver: function () { return setOpenNavName(true); } },
-                                        React.createElement("span", { className: 'sr-only' }, "setting"),
-                                        React.createElement("span", { className: classNames(!openNavName
-                                                ? 'group cursor-pointer p-4 hover:fixed hover:z-10 focus-visible:outline-none mt-0.5'
-                                                : 'flex gap-x-2 pl-[0.45rem]') },
-                                            React.createElement(FontAwesomeIcon, { className: 'h-[1.125rem] w-[1.125rem] mt-1', icon: 'fa-solid fa-gear' }),
-                                            openNavName && (React.createElement("div", { className: 'h-6' },
-                                                React.createElement("p", { className: "transition-all h-full duration-300 text-[0.86rem] setting-text-color mt-0.5 ".concat(openNavName ? 'opacity-100' : 'opacity-0', " ").concat(isSettings() ? 'font-semibold' : '', " ") }, "C\u00E0i \u0111\u1EB7t")))))))),
-                        !hiddenLeftMenu && (React.createElement(Transition, { as: 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.createElement("aside", { className: 'z-9 fixed ml-[3.438rem] hidden h-full bg-[#ebebeb] lg:block lg:flex-shrink-0' },
-                                React.createElement("div", { className: 'relative flex h-full w-64 flex-col overflow-y-auto border-r border-gray-200 bg-[#ebebeb]' },
-                                    checkAdmissions(pathNameWithBasePath) &&
-                                        checkChildrenCampaign(pathNameWithBasePath) &&
-                                        pathNameWithBasePath !== '/admissions/campaign/list' && (React.createElement("div", { className: 'mx-1 flex items-center p-2 pb-0' },
-                                        React.createElement("button", { className: 'inline-flex items-center rounded-lg border-gray-300 bg-transparent mr-1 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.createElement(ArrowLeftIcon, { className: 'h-5 w-5' })),
-                                        React.createElement("p", { className: 'font-medium text-sm text-slate-600' }, campaignName))),
-                                    React.createElement("div", { className: 'flex-1 overflow-y-auto pt-3' }, subNavigation.map(function (item, subNavIndex) { return (React.createElement("div", { key: subNavIndex }, (roleCode === null || roleCode === void 0 ? void 0 : roleCode.length) > 0 ? (React.createElement(React.Fragment, null, enablePer(item.code, perCode) ? (React.createElement(React.Fragment, null,
-                                        React.createElement("div", { "aria-hidden": true, "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' // 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-1 flex cursor-pointer border-slate-200 p-2'), onClick: function () { return subNavigationTriggerClicked(item); } }, !loadingMenu ? (React.createElement("div", { className: 'ml-1 text-[0.84rem] flex items-center' },
-                                            React.createElement("div", { className: 'flex items-center gap-x-3' },
-                                                React.createElement("p", { className: classNames('leading-5', (item === null || item === void 0 ? void 0 : item.current) ? 'font-semibold' : 'font-medium text-gray-800') }, item === null || item === void 0 ? void 0 : item.name)),
-                                            React.createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (React.createElement(PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' }))),
-                                        item.showChild && item.child && (React.createElement(React.Fragment, null, item.child.map(function (children, childIndex) { return (React.createElement("div", { key: childIndex, className: classNames('relative') },
-                                            React.createElement("div", { style: (children === null || children === void 0 ? void 0 : children.current)
-                                                    ? styles.childMenuActiveBefore
-                                                    : checkChildBefore(item.child, children)
-                                                        ? styles.childMenuBefBefore
-                                                        : {} }),
-                                            React.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' // màu chữ menu con khi active
-                                                    : 'hover:rounded-lg hover:bg-white hover:bg-opacity-50 hover:text-gray-900'), onClick: enablePer(children.code, perCode)
-                                                    ? function () { return subNavigationTriggerClicked(children, item); }
-                                                    : undefined },
-                                                React.createElement("div", { className: 'flex items-center gap-x-3' },
-                                                    React.createElement("div", { className: 'w-3' }),
-                                                    React.createElement("p", { className: classNames('my-[0.05rem] ml-3 leading-5', !enablePer(children.code, perCode)
-                                                            ? 'font-normal text-gray-300'
-                                                            : (children === null || children === void 0 ? void 0 : children.current)
-                                                                ? 'font-semibold'
-                                                                : 'font-normal text-gray-500') }, children.name))),
-                                            React.createElement("div", { style: (children === null || children === void 0 ? void 0 : children.current)
-                                                    ? styles.childMenuActiveAfter
-                                                    : checkChildBefore(item.child, children)
-                                                        ? styles.childMenuBefAfter
-                                                        : {} }))); }))))) : (React.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-1 flex cursor-pointer border-slate-200 p-2') }, !loadingMenu ? (React.createElement("div", { className: 'ml-1 text-[0.84rem] flex items-center' },
-                                        React.createElement("div", { className: 'flex items-center gap-x-3 text-gray-700' },
-                                            React.createElement("p", { className: classNames('leading-5 font-medium text-gray-300') }, item === null || item === void 0 ? void 0 : item.name)),
-                                        React.createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (React.createElement(PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' })))))) : (React.createElement(React.Fragment, null,
-                                        React.createElement("div", { "aria-hidden": true, "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', 'mx-1 flex cursor-pointer border-slate-200 p-2'), onClick: function () { return subNavigationTriggerClicked(item); } }, !loadingMenu ? (React.createElement("div", { className: 'ml-3 text-[0.84rem] flex items-center' },
-                                            React.createElement("div", { className: 'flex items-center gap-x-3 text-gray-700' },
-                                                React.createElement("p", { className: classNames('leading-5 font-normal text-gray-500') }, item === null || item === void 0 ? void 0 : item.name)),
-                                            React.createElement("p", { className: 'mt-1 text-slate-500' }, item === null || item === void 0 ? void 0 : item.description))) : (React.createElement(PHXSkeleton, { className: 'mr-3 flex-1', type: 'single' }))),
-                                        item.showChild && item.child && (React.createElement(React.Fragment, null, item.child.map(function (children, index) { return (React.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') },
-                                            React.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.createElement("div", { className: 'flex items-center gap-x-3' },
-                                                    React.createElement("div", { className: 'w-3' }),
-                                                    React.createElement("p", { className: classNames('ml-3 leading-5 my-[0.05rem]', (children === null || children === void 0 ? void 0 : children.current) ? 'font-semibold' : 'text-gray-500 font-normal') }, children.name))))); }))))))); }))))))))),
-            React.createElement("div", { className: 'flex min-w-0 flex-1 flex-col overflow-hidden' },
-                React.createElement("main", { className: 'flex flex-1 overflow-hidden' },
-                    React.createElement("section", { "aria-labelledby": 'primary-heading', className: 'flex h-full min-w-0 flex-1 flex-col lg:order-last' },
-                        React.createElement("div", { className: 'bg-bgcl-50 sticky top-0 z-10 flex h-14 flex-shrink-0 border-b border-l px-4 sm:px-6 lg:px-4' }),
-                        React.createElement("div", { className: "".concat(openSubMenu ? 'lg:ml-[20.063rem]' : 'lg:ml-[5.063rem]', " bg-[#f1f1f1] px-6") },
-                            React.createElement("div", { className: 'py-4' }, isLoadingPermission ? ('') : enablePer(currentCode, perCode) ? (children) : (React.createElement(PHXCard, null,
-                                React.createElement("div", { className: 'mb-10 mt-10 sm:mb-20 sm:mt-20 lg:mb-32 lg:mt-32' },
-                                    React.createElement("div", { className: 'flex items-center justify-center' },
-                                        React.createElement(LockClosedIcon, { className: 'text-gray-400', height: 70, width: 70 })),
-                                    React.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"))))))))))));
-};
-//# sourceMappingURL=MainWrap.js.map