diff --git a/explorer/pages/_app.tsx b/explorer/pages/_app.tsx index 251ea509d..ffbfde108 100644 --- a/explorer/pages/_app.tsx +++ b/explorer/pages/_app.tsx @@ -1,5 +1,6 @@ import "@clevercanary/data-explorer-ui"; import { AzulEntitiesStaticResponse } from "@clevercanary/data-explorer-ui/lib/apis/azul/common/entities"; +import { Error } from "@clevercanary/data-explorer-ui/lib/components/Error/error"; import { ErrorBoundary } from "@clevercanary/data-explorer-ui/lib/components/ErrorBoundary"; import { Head } from "@clevercanary/data-explorer-ui/lib/components/Head/head"; import { AppLayout } from "@clevercanary/data-explorer-ui/lib/components/Layout/components/AppLayout/appLayout.styles"; @@ -7,17 +8,18 @@ import { Footer } from "@clevercanary/data-explorer-ui/lib/components/Layout/com import { Header } from "@clevercanary/data-explorer-ui/lib/components/Layout/components/Header/header"; import { Main } from "@clevercanary/data-explorer-ui/lib/components/Layout/components/Main/main.styles"; import { Support } from "@clevercanary/data-explorer-ui/lib/components/Support/support"; -import { TempError } from "@clevercanary/data-explorer-ui/lib/components/TempError"; import { AuthProvider } from "@clevercanary/data-explorer-ui/lib/providers/authentication"; import { ConfigProvider as DXConfigProvider } from "@clevercanary/data-explorer-ui/lib/providers/config"; import { ExploreStateProvider } from "@clevercanary/data-explorer-ui/lib/providers/exploreState"; import { FileManifestStateProvider } from "@clevercanary/data-explorer-ui/lib/providers/fileManifestState"; import { createAppTheme } from "@clevercanary/data-explorer-ui/lib/theme/theme"; +import { DataExplorerError } from "@clevercanary/data-explorer-ui/lib/types/error"; import { ThemeProvider as EmotionThemeProvider } from "@emotion/react"; import { CssBaseline } from "@mui/material"; import { ThemeProvider } from "@mui/material/styles"; import { config } from "app/config/config"; import type { AppProps } from "next/app"; +import { useRouter } from "next/router"; import { useEffect } from "react"; import TagManager from "react-gtm-module"; @@ -26,7 +28,8 @@ const SESSION_TIMEOUT = 15 * 60 * 1000; // 15 minutes function MyApp({ Component, pageProps }: AppProps): JSX.Element { // Set up the site configuration, layout and theme. const appConfig = config(); - const { analytics, layout, themeOptions } = appConfig; + const { asPath } = useRouter(); + const { analytics, layout, redirectRootToPath, themeOptions } = appConfig; const { gtmAuth, gtmId, gtmPreview } = analytics || {}; const theme = createAppTheme(themeOptions); const { entityListType } = pageProps as AzulEntitiesStaticResponse; @@ -51,8 +54,15 @@ function MyApp({ Component, pageProps }: AppProps): JSX.Element {
( - + key={asPath} + fallbackRender={( + error: DataExplorerError + ): JSX.Element => ( + )} > diff --git a/explorer/pages/_error.tsx b/explorer/pages/_error.tsx index 4b44634f8..670218fe8 100644 --- a/explorer/pages/_error.tsx +++ b/explorer/pages/_error.tsx @@ -1,4 +1,5 @@ -import { TempError as CustomError } from "@clevercanary/data-explorer-ui/lib/components/TempError"; +import { Error as ErrorComponent } from "@clevercanary/data-explorer-ui/lib/components/Error/error"; +import { useConfig } from "@clevercanary/data-explorer-ui/lib/hooks/useConfig"; import { NextPage, NextPageContext } from "next"; interface ErrorProps { @@ -6,7 +7,13 @@ interface ErrorProps { } const Error: NextPage = ({ error }: ErrorProps) => { - return error ? : <>; + const { config } = useConfig(); + + return error ? ( + + ) : ( + <> + ); }; Error.getInitialProps = ({ err }: NextPageContext): ErrorProps => {