chore: bump version to 2.23.14 and refactor error handling components (#451)
- Updated application version from 2.23.13 to 2.23.14 in package.json. - Refactored error handling components in web app to utilize a new ErrorPageContent component for improved code organization and readability. - Simplified error and not found page layouts by removing redundant code and enhancing localization keys for better user experience.
This commit is contained in:
committed by
GitHub
parent
68276fda8a
commit
059408a70a
88
apps/web/components/error-page-content.tsx
Normal file
88
apps/web/components/error-page-content.tsx
Normal file
@@ -0,0 +1,88 @@
|
||||
'use client';
|
||||
|
||||
import Link from 'next/link';
|
||||
|
||||
import { ArrowLeft, MessageCircleQuestion } from 'lucide-react';
|
||||
|
||||
import { Button } from '@kit/ui/button';
|
||||
import { Trans } from '@kit/ui/trans';
|
||||
|
||||
export function ErrorPageContent({
|
||||
statusCode,
|
||||
heading,
|
||||
subtitle,
|
||||
reset,
|
||||
backLink = '/',
|
||||
backLabel = 'common:backToHomePage',
|
||||
contactLabel = 'common:contactUs',
|
||||
}: {
|
||||
statusCode: string;
|
||||
heading: string;
|
||||
subtitle: string;
|
||||
reset?: () => void;
|
||||
backLink?: string;
|
||||
backLabel?: string;
|
||||
contactLabel?: string;
|
||||
}) {
|
||||
return (
|
||||
<div
|
||||
className={
|
||||
'relative flex w-full flex-1 flex-col items-center justify-center overflow-hidden px-4'
|
||||
}
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
className={
|
||||
'font-heading pointer-events-none absolute top-1/2 left-1/2 z-0 -translate-x-1/2 -translate-y-1/2 text-[16rem] leading-none font-extrabold tracking-tighter opacity-[0.02] select-none sm:text-[22rem] lg:text-[28rem]'
|
||||
}
|
||||
>
|
||||
<Trans i18nKey={statusCode} />
|
||||
</span>
|
||||
|
||||
<div
|
||||
className={
|
||||
'relative z-10 flex max-w-md flex-col items-center text-center'
|
||||
}
|
||||
>
|
||||
<h1
|
||||
className={
|
||||
'font-heading text-2xl font-semibold tracking-tight sm:text-3xl'
|
||||
}
|
||||
>
|
||||
<Trans i18nKey={heading} />
|
||||
</h1>
|
||||
|
||||
<p
|
||||
className={
|
||||
'text-muted-foreground mt-3 max-w-sm text-sm leading-relaxed'
|
||||
}
|
||||
>
|
||||
<Trans i18nKey={subtitle} />
|
||||
</p>
|
||||
|
||||
<div className={'mt-8 flex items-center gap-3'}>
|
||||
{reset ? (
|
||||
<Button onClick={reset}>
|
||||
<ArrowLeft className={'h-4 w-4'} />
|
||||
<Trans i18nKey={backLabel} />
|
||||
</Button>
|
||||
) : (
|
||||
<Button asChild>
|
||||
<Link href={backLink}>
|
||||
<ArrowLeft className={'h-4 w-4 mr-1'} />
|
||||
<Trans i18nKey={backLabel} />
|
||||
</Link>
|
||||
</Button>
|
||||
)}
|
||||
|
||||
<Button asChild variant={'ghost'}>
|
||||
<Link href={'/contact'}>
|
||||
<MessageCircleQuestion className={'h-4 w-4 mr-1'} />
|
||||
<Trans i18nKey={contactLabel} />
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user