diff --git a/src/client/App.tsx b/src/client/App.tsx index 9cb77e4..1b3e59d 100644 --- a/src/client/App.tsx +++ b/src/client/App.tsx @@ -25,6 +25,7 @@ import { routeTree } from './routeTree.gen'; import { DefaultNotFound } from './components/DefaultNotFound'; import { TooltipProvider } from './components/ui/tooltip'; import { Toaster } from './components/ui/sonner'; +import { DefaultError } from './components/DefaultError'; const router = createRouter({ routeTree, @@ -32,6 +33,7 @@ const router = createRouter({ userInfo: undefined, }, defaultNotFoundComponent: DefaultNotFound, + defaultErrorComponent: DefaultError, }); // Register the router instance for type safety diff --git a/src/client/api/model/user.ts b/src/client/api/model/user.ts index d48cf3a..a5e55d8 100644 --- a/src/client/api/model/user.ts +++ b/src/client/api/model/user.ts @@ -2,7 +2,6 @@ import dayjs from 'dayjs'; import { useUserStore } from '../../store/user'; import { useEvent } from '../../hooks/useEvent'; import { clearJWT } from '../auth'; -import { useNavigate } from '@tanstack/react-router'; /** * Mock @@ -13,15 +12,11 @@ export function getUserTimezone(): string { } export function useLogout() { - const navigate = useNavigate(); - const logout = useEvent(() => { + window.location.href = '/login'; // not good, need to invest to find better way. + useUserStore.setState({ info: null }); clearJWT(); - navigate({ - to: '/login', - replace: true, - }); }); return logout; diff --git a/src/client/components/CommandPanel.tsx b/src/client/components/CommandPanel.tsx index 0503693..5655142 100644 --- a/src/client/components/CommandPanel.tsx +++ b/src/client/components/CommandPanel.tsx @@ -26,8 +26,12 @@ import { useTranslation } from '@i18next-toolkit/react'; import { trpc } from '@/api/trpc'; import { useCurrentWorkspaceId } from '@/store/user'; import { Button } from './ui/button'; +import { Tooltip, TooltipContent, TooltipTrigger } from './ui/tooltip'; -export const CommandPanel: React.FC = React.memo(() => { +interface CommandPanelProps { + isCollapsed: boolean; +} +export const CommandPanel: React.FC = React.memo((props) => { const [open, setOpen] = useState(false); const navigate = useNavigate(); const { t } = useTranslation(); @@ -53,15 +57,34 @@ export const CommandPanel: React.FC = React.memo(() => { return ( <> - + {props.isCollapsed ? ( + + + + )} diff --git a/src/client/components/DefaultError.tsx b/src/client/components/DefaultError.tsx new file mode 100644 index 0000000..661ecca --- /dev/null +++ b/src/client/components/DefaultError.tsx @@ -0,0 +1,30 @@ +import React from 'react'; +import { Button } from './ui/button'; +import { Link } from '@tanstack/react-router'; +import { useTranslation } from '@i18next-toolkit/react'; +import { Card, CardContent, CardFooter, CardHeader } from './ui/card'; + +export const DefaultError: React.FC = React.memo(() => { + const { t } = useTranslation(); + + return ( +
+ + +
+ +
+
+ +
{t('Sorry, but something went wrong')}
+
+ + + + + +
+
+ ); +}); +DefaultError.displayName = 'DefaultError'; diff --git a/src/client/pages/Layout/DesktopLayout.tsx b/src/client/pages/Layout/DesktopLayout.tsx index 0de85fd..e79bdd1 100644 --- a/src/client/pages/Layout/DesktopLayout.tsx +++ b/src/client/pages/Layout/DesktopLayout.tsx @@ -61,7 +61,7 @@ export const DesktopLayout: React.FC = React.memo((props) => {
- +