54 lines
2.0 KiB
TypeScript
54 lines
2.0 KiB
TypeScript
import { useState, Suspense, useMemo } from 'react';
|
|
import { createBrowserRouter, RouterProvider, Navigate } from 'react-router-dom';
|
|
import { ThemeProvider, DensityType } from '@repo/ui/provider';
|
|
import { AgGridProvider } from '@repo/ui/components';
|
|
import { useThemeStore } from './core/stores/theme.store';
|
|
import ShowcaseLayout from './layouts/ShowcaseLayout';
|
|
|
|
// Pages
|
|
import UiComponentsPage from './pages/ui-components';
|
|
import FormsPage from './pages/forms';
|
|
import StoragePage from './pages/storage';
|
|
import EventsPage from './pages/events';
|
|
import HardwarePage from './pages/hardware';
|
|
import RbacPage from './pages/rbac';
|
|
import AuthPage from './pages/auth';
|
|
import ShellDemoPage from './pages/shell-demo';
|
|
import ActionToolsPage from './pages/action-tools';
|
|
import AgGridPage from './pages/ag-grid';
|
|
|
|
export default function App() {
|
|
const colorScheme = useThemeStore((s) => s.colorScheme);
|
|
const [density, setDensity] = useState<DensityType>('compact');
|
|
|
|
const router = useMemo(() => createBrowserRouter([
|
|
{
|
|
path: "/",
|
|
element: <ShowcaseLayout density={density} setDensity={setDensity} />,
|
|
children: [
|
|
{ index: true, element: <Navigate to="/ui-components" replace /> },
|
|
{ path: "ui-components", element: <UiComponentsPage /> },
|
|
{ path: "forms", element: <FormsPage /> },
|
|
{ path: "storage", element: <StoragePage /> },
|
|
{ path: "events", element: <EventsPage /> },
|
|
{ path: "hardware", element: <HardwarePage /> },
|
|
{ path: "rbac", element: <RbacPage /> },
|
|
{ path: "auth", element: <AuthPage /> },
|
|
{ path: "action-tools", element: <ActionToolsPage /> },
|
|
{ path: "ag-grid", element: <AgGridPage /> },
|
|
]
|
|
},
|
|
{ path: "/shell-demo", element: <ShellDemoPage /> }
|
|
]), [density]);
|
|
|
|
return (
|
|
<ThemeProvider colorScheme={colorScheme} density={density}>
|
|
<AgGridProvider bypassLicense>
|
|
<Suspense fallback={<div>Loading...</div>}>
|
|
<RouterProvider router={router} />
|
|
</Suspense>
|
|
</AgGridProvider>
|
|
</ThemeProvider>
|
|
);
|
|
}
|