@equinor/fusion-framework-cli/dist/bin/dev-portal/Router.js

--- title: Fusion Framework CLI ---

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useBookmarkNavigate } from '@equinor/fusion-framework-react-module-bookmark/portal';
import { Outlet, RouterProvider, useParams } from 'react-router-dom';
import AppLoader from './AppLoader';
import { Header } from './Header';
import { useFramework } from '@equinor/fusion-framework-react';
import { useState } from 'react';
import { styled } from 'styled-components';
import { useAppContextNavigation } from './useAppContextNavigation';
const Styled = {
    ContentContainer: styled.div `
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 48px 1fr;
        height: 100vh;
        overflow: hidden;
        grid-template-areas: 'head' 'main';
    `,
    Head: styled.section `
        grid-area: head;
    `,
    Main: styled.section `
        grid-area: main;
        overflow: auto;
        position: relative;
        max-width: 100%;
        display: grid;
    `,
};
const Root = () => {
    useBookmarkNavigate({ resolveAppPath: (appKey) => `/apps/${appKey}` });
    return (_jsxs(Styled.ContentContainer, { children: [_jsx(Styled.Head, { children: _jsx(Header, {}) }), _jsx(Styled.Main, { children: _jsx(Outlet, {}) })] }));
};
// eslint-disable-next-line react/no-multi-comp
const AppRoute = () => {
    const { appKey } = useParams();
    return appKey ? _jsx(AppLoader, { appKey: appKey }) : null;
};
const routes = [
    {
        path: '/',
        element: _jsx(Root, {}),
        children: [
            {
                path: 'apps/:appKey/*',
                element: _jsx(AppRoute, {}),
            },
        ],
    },
];
// eslint-disable-next-line react/no-multi-comp
export const Router = () => {
    const { navigation } = useFramework().modules;
    const [router] = useState(() => navigation.createRouter(routes));
    // observe the context changes and navigate when the context changes
    useAppContextNavigation();
    return (_jsx(RouterProvider, { router: router, fallbackElement: _jsx("p", { children: "wooot" }) }));
};
//# sourceMappingURL=Router.js.map