diff --git a/.gitignore b/.gitignore index 3e67d85ba..d34066c27 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ bin/ node_modules/ .turbo +.vscode \ No newline at end of file diff --git a/apps/console2/src/components/PageError.tsx b/apps/console2/src/components/PageError.tsx index 3144909f3..14efa64be 100644 --- a/apps/console2/src/components/PageError.tsx +++ b/apps/console2/src/components/PageError.tsx @@ -1,6 +1,7 @@ -import { useRouteError } from "react-router"; +import { useLocation, useRouteError } from "react-router"; import { IconPageCross } from "@probo/ui"; import { useTranslate } from "@probo/i18n"; +import { useEffect, useRef } from "react"; const classNames = { wrapper: "py-10 text-center space-y-2 ", @@ -8,9 +9,22 @@ const classNames = { description: "text-base text-txt-tertiary", }; -export function PageError() { +type Props = { + resetErrorBoundary: () => void; +}; + +export function PageError({ resetErrorBoundary }: Props) { const error = useRouteError(); const { __ } = useTranslate(); + const location = useLocation(); + const baseLocation = useRef(location); + + // Reset error boundary on page change + useEffect(() => { + if (location.pathname !== baseLocation.current.pathname) { + resetErrorBoundary(); + } + }, [location, resetErrorBoundary]); if (!error) { return ( diff --git a/apps/console2/src/routes.tsx b/apps/console2/src/routes.tsx index 0b88b2c54..82092c971 100644 --- a/apps/console2/src/routes.tsx +++ b/apps/console2/src/routes.tsx @@ -1,13 +1,20 @@ import { createBrowserRouter, Navigate, + redirect, useLoaderData, useRouteError, type RouteObject, } from "react-router"; import { MainLayout } from "./layouts/MainLayout"; import { AuthLayout, CenteredLayout, CenteredLayoutSkeleton } from "@probo/ui"; -import { lazy, Suspense, type FC, type LazyExoticComponent } from "react"; +import { + Fragment, + lazy, + Suspense, + type FC, + type LazyExoticComponent, +} from "react"; import { relayEnvironment, UnAuthenticatedError, @@ -25,8 +32,9 @@ import { frameworkRoutes } from "./routes/frameworkRoutes.ts"; import { PageError } from "./components/PageError.tsx"; import { taskRoutes } from "./routes/taskRoutes.ts"; -function ErrorBoundary() { +function ErrorBoundary(props) { const error = useRouteError(); + if (error instanceof UnAuthenticatedError) { return ; } @@ -74,6 +82,13 @@ const routes = [ Component: MainLayout, ErrorBoundary: ErrorBoundary, children: [ + { + path: "", + loader: () => { + throw redirect(`tasks`); + }, + Component: Fragment, + }, { path: "settings", fallback: PageSkeleton,