45 lines
1.7 KiB
TypeScript
45 lines
1.7 KiB
TypeScript
|
import React, { lazy, Suspense } from 'react';
|
||
|
|
import type { RouteObject } from 'react-router-dom';
|
||
|
|
import { Navigate } from 'react-router-dom';
|
||
|
|
import { Spin } from 'antd';
|
||
|
|
import MainLayout from './layouts/MainLayout';
|
||
|
|
|
||
|
|
const CaseList = lazy(() => import('./pages/cases/CaseList'));
|
||
|
|
const Workspace = lazy(() => import('./pages/workspace/Workspace'));
|
||
|
|
const Screenshots = lazy(() => import('./pages/screenshots/Screenshots'));
|
||
|
|
const Transactions = lazy(() => import('./pages/transactions/Transactions'));
|
||
|
|
const Analysis = lazy(() => import('./pages/analysis/Analysis'));
|
||
|
|
const Review = lazy(() => import('./pages/review/Review'));
|
||
|
|
const Reports = lazy(() => import('./pages/reports/Reports'));
|
||
|
|
|
||
|
|
const Loading = () => (
|
||
|
|
<div style={{ display: 'flex', justifyContent: 'center', paddingTop: 120 }}>
|
||
|
|
<Spin size="large" />
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
|
||
|
|
function withSuspense(Component: React.LazyExoticComponent<React.ComponentType>) {
|
||
|
|
return (
|
||
|
|
<Suspense fallback={<Loading />}>
|
||
|
|
<Component />
|
||
|
|
</Suspense>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export const routes: RouteObject[] = [
|
||
|
|
{
|
||
|
|
path: '/',
|
||
|
|
element: <MainLayout />,
|
||
|
|
children: [
|
||
|
|
{ index: true, element: <Navigate to="/cases" replace /> },
|
||
|
|
{ path: 'cases', element: withSuspense(CaseList) },
|
||
|
|
{ path: 'cases/:id/workspace', element: withSuspense(Workspace) },
|
||
|
|
{ path: 'cases/:id/screenshots', element: withSuspense(Screenshots) },
|
||
|
|
{ path: 'cases/:id/transactions', element: withSuspense(Transactions) },
|
||
|
|
{ path: 'cases/:id/analysis', element: withSuspense(Analysis) },
|
||
|
|
{ path: 'cases/:id/review', element: withSuspense(Review) },
|
||
|
|
{ path: 'cases/:id/reports', element: withSuspense(Reports) },
|
||
|
|
],
|
||
|
|
},
|
||
|
|
];
|