stackpress/esm/view/layout/LayoutAdmin.js

Incept is a content management framework.

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useEffect } from 'react';
import { useLanguage } from 'r22n';
import NotifyContainer from '../notify/NotifyContainer.js';
import { unload } from '../notify/hooks.js';
import { useTheme } from '../theme/hooks.js';
import { useConfig, useSession, useRequest } from '../server/hooks.js';
import LayoutHead from './components/LayoutHead.js';
import LayoutLeft from './components/LayoutLeft.js';
import LayoutMain from './components/LayoutMain.js';
import LayoutMenu from './components/LayoutMenu.js';
import LayoutRight from './components/LayoutRight.js';
import LayoutProvider from './LayoutProvider.js';
import { useToggle } from './hooks.js';
export function AdminUserMenu() {
    const session = useSession();
    const { changeLanguage } = useLanguage();
    return (_jsxs("section", { className: "user-menu", children: [_jsxs("header", { children: [session.data.id ? (_jsxs("div", { className: "info", children: [_jsx("i", { className: "icon fas fa-user-circle" }), _jsx("span", { children: session.data.name })] })) : null, _jsxs("nav", { className: "lang", children: [_jsx("a", { onClick: () => changeLanguage('en_US'), children: "EN" }), _jsx("a", { onClick: () => changeLanguage('th_TH'), children: "TH" })] })] }), _jsx("main", { children: session.data.id ? (_jsxs("div", { className: "container", children: [session.data.roles && session.data.roles.includes('ADMIN') && (_jsxs("nav", { className: "menu-item", children: [_jsx("i", { className: "icon fas fa-gauge" }), _jsx("a", { href: "/admin/profile/search", children: "Admin" })] })), _jsxs("nav", { className: "menu-item", children: [_jsx("i", { className: "icon fas fa-power-off" }), _jsx("a", { href: "/auth/signout", children: "Sign Out" })] })] })) : (_jsxs("div", { className: "container", children: [_jsxs("nav", { className: "menu-item", children: [_jsx("i", { className: "icon fas fa-lock" }), _jsx("a", { href: "/auth/signin", children: "Sign In" })] }), _jsxs("nav", { className: "menu-item", children: [_jsx("i", { className: "icon fas fa-trophy" }), _jsx("a", { href: "/auth/signup", children: "Sign Up" })] })] })) })] }));
}
export function AdminApp({ children }) {
    const config = useConfig();
    const request = useRequest();
    const [left, toggleLeft] = useToggle();
    const [right, toggleRight] = useToggle();
    const { theme, toggle: toggleTheme } = useTheme();
    const menu = config.path('admin.menu', []);
    const pathname = request.url.pathname;
    return (_jsxs("div", { className: `${theme} layout-admin`, children: [_jsx(LayoutHead, { left: true, open: { left, right }, theme: theme, toggleLeft: toggleLeft, toggleRight: toggleRight, toggleTheme: toggleTheme }), _jsx(LayoutLeft, { brand: config.path('brand.name', 'Stackpress'), base: config.path('admin.base', '/admin'), logo: config.path('brand.icon', 'icon.png'), open: left, toggle: toggleLeft, children: _jsx(LayoutMenu, { path: pathname, menu: menu }) }), _jsx(LayoutRight, { head: true, open: right, children: _jsx(AdminUserMenu, {}) }), _jsx(LayoutMain, { head: true, left: true, open: { left, right }, children: children })] }));
}
export default function LayoutAdmin(props) {
    const { data, session, request, response, children } = props;
    useEffect(unload, []);
    return (_jsxs(LayoutProvider, { data: data, session: session, request: request, response: response, children: [_jsx(AdminApp, { children: children }), _jsx(NotifyContainer, {})] }));
}