burdy
Version:
Open Source Headless Platform
162 lines (161 loc) • 6.83 kB
JavaScript
"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importStar(require("react"));
const side_nav_1 = __importDefault(require("./side-nav"));
const header_1 = __importDefault(require("./header"));
const react_router_1 = require("react-router");
const sites_page_1 = __importDefault(require("../features/posts/pages/sites.page"));
const tags_page_1 = __importDefault(require("../features/tags/pages/tags.page"));
const dashboard_1 = __importDefault(require("../features/dashboard"));
const assets_page_1 = __importDefault(require("../features/assets/pages/assets.page"));
const content_types_page_1 = __importDefault(require("../features/content-types/pages/content-types.page"));
const users_page_1 = __importDefault(require("../features/users/pages/users.page"));
const settings_page_1 = __importDefault(require("../features/settings/pages/settings.page"));
const hooks_1 = __importDefault(require("../../shared/features/hooks"));
const react_2 = require("@fluentui/react");
const auth_context_1 = require("../features/authentication/context/auth.context");
const error_boundary_1 = __importDefault(require("./error-boundary"));
const post_container_page_1 = __importDefault(require("../features/posts/pages/post-container.page"));
const editor_page_1 = __importDefault(require("../features/editor/pages/editor.page"));
const settings_1 = require("../context/settings");
const loading_bar_1 = __importDefault(require("./loading-bar"));
const useStyles = (0, react_2.makeStyles)({
layout: {
display: 'grid',
gridAutoFlow: 'column',
gridTemplateColumns: 'auto 1fr',
height: '100vh',
},
header: {
position: 'fixed !important',
top: 0,
left: 0,
right: 0,
paddingLeft: '0 !important',
paddingRight: '0 !important',
zIndex: 14,
},
sider: {
position: 'fixed !important',
top: 48,
bottom: 0,
left: 0,
background: react_2.NeutralColors.gray20,
width: 200,
zIndex: 10,
},
content: {
padding: '48px 0 0 200px',
transition: '.2s padding ease-in-out',
height: 'calc(100vh - 48px)',
'&:global(.menuCollapsed)': {
padding: '48px 0 0 80px',
},
},
innerContent: {
height: '100%',
},
});
const Layout = () => {
const styles = useStyles();
const { filterPermissions } = (0, auth_context_1.useAuth)();
const { getSettings } = (0, settings_1.useSettings)();
(0, react_1.useEffect)(() => {
getSettings.execute();
}, []);
const routes = (0, react_1.useMemo)(() => {
const predefined = [
{
exact: true,
key: 'dashboard',
path: '/',
component: dashboard_1.default,
},
{
key: 'assets',
path: '/assets',
component: assets_page_1.default,
permissions: ['assets_list'],
},
{
key: 'content-types',
path: '/content-types',
component: content_types_page_1.default,
permissions: ['content_types_list'],
},
{
key: 'users',
path: '/users',
component: users_page_1.default,
},
{
key: 'settings',
path: '/settings',
component: settings_page_1.default,
permissions: ['settings'],
},
{
key: 'post-container',
path: '/sites/post-container/:postId',
component: post_container_page_1.default,
permissions: ['sites_list'],
},
{
key: 'sites-editor',
path: '/sites/editor/:postId',
component: editor_page_1.default,
permissions: ['sites_update'],
},
{
key: 'sites',
path: '/sites',
component: sites_page_1.default,
permissions: ['sites_list'],
},
{
key: 'tags',
path: '/tags',
component: tags_page_1.default,
permissions: ['tags_list'],
},
];
return filterPermissions(hooks_1.default.applySyncFilters('admin/routes', predefined) || []);
}, []);
return (react_1.default.createElement(loading_bar_1.default, { loading: getSettings.loading },
react_1.default.createElement("div", null,
react_1.default.createElement("div", { className: styles.header },
react_1.default.createElement(header_1.default, null)),
react_1.default.createElement("div", { className: styles.sider },
react_1.default.createElement(side_nav_1.default, null)),
react_1.default.createElement("div", { className: styles.content },
react_1.default.createElement("div", { className: styles.innerContent },
react_1.default.createElement(react_router_1.Switch, null,
routes.map((route) => {
return (react_1.default.createElement(react_router_1.Route, { exact: route.exact, path: route.path, key: route.key, render: () => (react_1.default.createElement(error_boundary_1.default, { message: `Page ${route.path} errored. Please check console for more details.` },
react_1.default.createElement(route.component, null))) }));
}),
react_1.default.createElement(react_router_1.Redirect, { from: "*", to: "" })))))));
};
exports.default = Layout;