44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
import {
|
|
type AnyRoute,
|
|
type ParsedLocation,
|
|
redirect,
|
|
} from '@tanstack/solid-router';
|
|
import { ProLink } from '../ui/pro-link';
|
|
|
|
export function guardRouteIndexAsNotFound(
|
|
this: AnyRoute,
|
|
{ location }: { location: ParsedLocation<any> }
|
|
) {
|
|
// biome-ignore lint/performance/useTopLevelRegex: <explanation>
|
|
if (location.pathname.replace(/\/+$/, '') === this.id) {
|
|
throw redirect({
|
|
href: '/404',
|
|
replace: true,
|
|
reloadDocument: true,
|
|
});
|
|
}
|
|
}
|
|
|
|
export function AppNotFoundComponent() {
|
|
return (
|
|
<div class="flex h-svh items-center px-4 py-12 sm:px-6 md:px-8 lg:px-12 xl:px-16">
|
|
<div class="w-full space-y-6 text-center">
|
|
<div class="space-y-3">
|
|
<h1 class="font-bold text-4xl tracking-tighter sm:text-5xl">
|
|
404 Page Not Found
|
|
</h1>
|
|
<p class="text-gray-500">
|
|
Sorry, we couldn't find the page you're looking for.
|
|
</p>
|
|
</div>
|
|
<ProLink
|
|
to="/"
|
|
class="inline-flex h-10 items-center rounded-md border border-gray-200 border-gray-200 bg-white px-8 font-medium text-sm shadow-sm transition-colors hover:bg-gray-100 hover:text-gray-900 dark:border-gray-800 dark:border-gray-800 dark:bg-gray-950 dark:focus-visible:ring-gray-300 dark:hover:bg-gray-800 dark:hover:text-gray-50"
|
|
>
|
|
Return to website
|
|
</ProLink>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|