Add RootProviders to global-error.tsx

This commit is contained in:
gbuomprisco
2025-03-31 14:06:55 +08:00
parent 6a06d6ef8e
commit 7b1e261750
2 changed files with 47 additions and 44 deletions

View File

@@ -10,6 +10,7 @@ import { Heading } from '@kit/ui/heading';
import { Trans } from '@kit/ui/trans'; import { Trans } from '@kit/ui/trans';
import { SiteHeader } from '~/(marketing)/_components/site-header'; import { SiteHeader } from '~/(marketing)/_components/site-header';
import { RootProviders } from '~/components/root-providers';
const GlobalErrorPage = ({ const GlobalErrorPage = ({
error, error,
@@ -23,61 +24,63 @@ const GlobalErrorPage = ({
return ( return (
<html> <html>
<body> <body>
<div className={'flex h-screen flex-1 flex-col'}> <RootProviders>
<SiteHeader /> <div className={'flex h-screen flex-1 flex-col'}>
<SiteHeader />
<div
className={
'container m-auto flex w-full flex-1 flex-col items-center justify-center'
}
>
<div className={'flex flex-col items-center space-y-8'}>
<div>
<h1 className={'font-heading text-9xl font-semibold'}>
<Trans i18nKey={'common:errorPageHeading'} />
</h1>
</div>
<div
className={
'container m-auto flex w-full flex-1 flex-col items-center justify-center'
}
>
<div className={'flex flex-col items-center space-y-8'}> <div className={'flex flex-col items-center space-y-8'}>
<div <div>
className={ <h1 className={'font-heading text-9xl font-semibold'}>
'flex max-w-xl flex-col items-center gap-y-2 text-center' <Trans i18nKey={'common:errorPageHeading'} />
} </h1>
>
<div>
<Heading level={2}>
<Trans i18nKey={'common:genericError'} />
</Heading>
</div>
<p className={'text-muted-foreground text-lg'}>
<Trans i18nKey={'common:genericErrorSubHeading'} />
</p>
</div> </div>
<div> <div className={'flex flex-col items-center space-y-8'}>
<Button <div
className={'w-full'} className={
variant={'default'} 'flex max-w-xl flex-col items-center gap-y-2 text-center'
onClick={reset} }
> >
<ArrowLeft className={'mr-2 h-4'} /> <div>
<Heading level={2}>
<Trans i18nKey={'common:genericError'} />
</Heading>
</div>
<Trans i18nKey={'common:goBack'} /> <p className={'text-muted-foreground text-lg'}>
</Button> <Trans i18nKey={'common:genericErrorSubHeading'} />
</p>
</div>
<Button className={'w-full'} variant={'outline'} asChild> <div className={'flex space-x-4'}>
<Link href={'/contact'}> <Button
<MessageCircle className={'mr-2 h-4'} /> className={'w-full'}
variant={'default'}
onClick={reset}
>
<ArrowLeft className={'mr-2 h-4'} />
<Trans i18nKey={'common:contactUs'} /> <Trans i18nKey={'common:goBack'} />
</Link> </Button>
</Button>
<Button className={'w-full'} variant={'outline'} asChild>
<Link href={'/contact'}>
<MessageCircle className={'mr-2 h-4'} />
<Trans i18nKey={'common:contactUs'} />
</Link>
</Button>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </RootProviders>
</body> </body>
</html> </html>
); );

View File

@@ -42,7 +42,7 @@ export function RootProviders({
theme = appConfig.theme, theme = appConfig.theme,
children, children,
}: React.PropsWithChildren<{ }: React.PropsWithChildren<{
lang: string; lang?: string;
theme?: string; theme?: string;
}>) { }>) {
const i18nSettings = useMemo(() => getI18nSettings(lang), [lang]); const i18nSettings = useMemo(() => getI18nSettings(lang), [lang]);