diff --git a/src/client/App.tsx b/src/client/App.tsx index 73f3cbb..4049574 100644 --- a/src/client/App.tsx +++ b/src/client/App.tsx @@ -19,16 +19,17 @@ import { ConfigProvider, theme } from 'antd'; import { useColorSchema } from './store/settings'; import { StatusPage } from './pages/Status'; import { TelemetryPage } from './pages/Telemetry'; -import { LayoutV2 } from './pages/LayoutV2'; import { isDev } from './utils/env'; import { RouterProvider, createRouter } from '@tanstack/react-router'; import { routeTree } from './routeTree.gen'; +import { DefaultNotFound } from './components/DefaultNotFound'; const router = createRouter({ routeTree, context: { userInfo: undefined, }, + defaultNotFoundComponent: DefaultNotFound, }); // Register the router instance for type safety @@ -47,7 +48,7 @@ export const AppRoutes: React.FC = React.memo(() => { return ( {userInfo ? ( - : }> + }> } /> } /> } /> diff --git a/src/client/components/Code.tsx b/src/client/components/Code.tsx new file mode 100644 index 0000000..6bbd170 --- /dev/null +++ b/src/client/components/Code.tsx @@ -0,0 +1,10 @@ +import React from 'react'; + +export const Code: React.FC = React.memo((props) => { + return ( + + {props.children} + + ); +}); +Code.displayName = 'Code'; diff --git a/src/client/components/DefaultNotFound.tsx b/src/client/components/DefaultNotFound.tsx new file mode 100644 index 0000000..f179017 --- /dev/null +++ b/src/client/components/DefaultNotFound.tsx @@ -0,0 +1,37 @@ +import React from 'react'; +import { Button } from './ui/button'; +import { Link, useRouterState } from '@tanstack/react-router'; +import { useTranslation } from '@i18next-toolkit/react'; +import { Card, CardContent, CardFooter, CardHeader } from './ui/card'; +import { Code } from './Code'; + +export const DefaultNotFound: React.FC = React.memo(() => { + const { t } = useTranslation(); + const pathname = useRouterState({ + select: (state) => state.location.pathname, + }); + + return ( +
+ + +
+ +
+
+ +
{t('Sorry, but this page is not found')}
+
+ {t('Path')}: {pathname} +
+
+ + + + + +
+
+ ); +}); +DefaultNotFound.displayName = 'DefaultNotFound'; diff --git a/src/client/routeTree.gen.ts b/src/client/routeTree.gen.ts index b3697af..d8e26e8 100644 --- a/src/client/routeTree.gen.ts +++ b/src/client/routeTree.gen.ts @@ -15,6 +15,7 @@ import { Route as WebsiteImport } from './routes/website' import { Route as RegisterImport } from './routes/register' import { Route as MonitorImport } from './routes/monitor' import { Route as LoginImport } from './routes/login' +import { Route as DashboardImport } from './routes/dashboard' import { Route as IndexImport } from './routes/index' import { Route as WebsiteAddImport } from './routes/website/add' import { Route as WebsiteWebsiteIdImport } from './routes/website/$websiteId' @@ -43,6 +44,11 @@ const LoginRoute = LoginImport.update({ getParentRoute: () => rootRoute, } as any) +const DashboardRoute = DashboardImport.update({ + path: '/dashboard', + getParentRoute: () => rootRoute, +} as any) + const IndexRoute = IndexImport.update({ path: '/', getParentRoute: () => rootRoute, @@ -76,6 +82,10 @@ declare module '@tanstack/react-router' { preLoaderRoute: typeof IndexImport parentRoute: typeof rootRoute } + '/dashboard': { + preLoaderRoute: typeof DashboardImport + parentRoute: typeof rootRoute + } '/login': { preLoaderRoute: typeof LoginImport parentRoute: typeof rootRoute @@ -115,6 +125,7 @@ declare module '@tanstack/react-router' { export const routeTree = rootRoute.addChildren([ IndexRoute, + DashboardRoute, LoginRoute, MonitorRoute.addChildren([MonitorMonitorIdRoute, MonitorAddRoute]), RegisterRoute, diff --git a/src/client/routes/dashboard.tsx b/src/client/routes/dashboard.tsx new file mode 100644 index 0000000..dac601b --- /dev/null +++ b/src/client/routes/dashboard.tsx @@ -0,0 +1,9 @@ +import { createFileRoute, redirect } from '@tanstack/react-router'; + +export const Route = createFileRoute('/dashboard')({ + beforeLoad: () => { + redirect({ + to: '/', + }); + }, +}); diff --git a/src/client/tailwind.config.ts b/src/client/tailwind.config.ts index da5d16e..448f776 100644 --- a/src/client/tailwind.config.ts +++ b/src/client/tailwind.config.ts @@ -9,6 +9,7 @@ module.exports = { relative: true, files: [ './index.html', + './App.tsx', './components/**/*.{js,jsx,ts,tsx}', './pages/**/*.{js,jsx,ts,tsx}', './routes/**/*.{js,jsx,ts,tsx}',