eigen/trackgo-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 12 Wiki Activity

feat: add optional action props to system pages for enhanced user navigation

Browse Source
This commit is contained in:
Firman Ramdhani
2026-01-21 10:10:52 +07:00
parent 6003d3cea2
commit 9fc1ef029c
4 changed files with 94 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/components/system-pages/not-found.tsx
+29 -13
View File
@@ -1,27 +1,43 @@
export function NotFound() {
interface NotFoundProps {
showActionsBack?: boolean;
showActionsHome?: boolean;
}
export function NotFound(props: NotFoundProps) {
const { showActionsBack = true, showActionsHome = true } = props;
return (
<div className="flex min-h-screen items-center justify-center bg-white px-4">
<div className="w-full max-w-md text-center">
<p className="text-sm font-medium uppercase tracking-widest text-gray-400">404 Error</p>
<h1 className="mt-3 text-6xl font-extrabold text-gray-900">Page Not Found</h1>
<h1 className="mt-3 text-6xl font-extrabold text-brand-900">Page Not Found</h1>
<p className="mt-4 text-base text-gray-500">
Sorry, the page you’re looking for doesn’t exist or has been moved.
</p>
<div className="mt-8 flex justify-center gap-3">
<button
onClick={() => window.history.back()}
className="rounded-md border border-gray-300 px-5 py-2.5 text-sm font-medium text-gray-700 hover:bg-gray-100"
>
Go Back
</button>
{(showActionsBack || showActionsHome) && (
<div className="mt-8 flex justify-center gap-3">
{showActionsBack && (
<button
onClick={() => window.history.back()}
className="rounded-md border border-gray-300 px-5 py-2.5 text-sm font-medium text-gray-700 hover:bg-gray-100 cursor-pointer"
>
Go Back
</button>
)}
<a href="/" className="rounded-md bg-gray-900 px-5 py-2.5 text-sm font-medium text-white hover:bg-gray-800">
Back to Home
</a>
</div>
{showActionsHome && (
<a
href="/"
className="rounded-md bg-brand-900 px-5 py-2.5 text-sm font-medium text-white hover:bg-brand-800"
>
Back to Home
</a>
)}
</div>
)}
</div>
</div>
);