From 2d82bfe45bd9ffc1c73dcbe08be1726f4f4fbd76 Mon Sep 17 00:00:00 2001 From: Victor Salomon <68683271+Victor-Salomon@users.noreply.github.com> Date: Mon, 12 Aug 2024 17:20:30 +0200 Subject: [PATCH] feat: turtle 404 error page (#84) Co-authored-by: Nuno --- app/src/app/error.tsx | 45 ++++++++++++++++++++++++++++++++++++ app/src/app/global-error.tsx | 41 ++++++++++++++++++++++++-------- app/src/app/not-found.tsx | 39 +++++++++++++++++++++++++++++++ 3 files changed, 116 insertions(+), 9 deletions(-) create mode 100644 app/src/app/error.tsx create mode 100644 app/src/app/not-found.tsx diff --git a/app/src/app/error.tsx b/app/src/app/error.tsx new file mode 100644 index 00000000..d5bda4ce --- /dev/null +++ b/app/src/app/error.tsx @@ -0,0 +1,45 @@ +'use client' +import { useEffect } from 'react' +import Image from 'next/image' +import Link from 'next/link' +import { captureException } from '@sentry/nextjs' + +const Error = ({ error }: { error: Error & { digest?: string } }) => { + useEffect(() => { + captureException(error) + }, [error]) + + return ( +
+ {/* background */} + Turtle Background + {/* background overlay*/} +
+ + {/* Content */} +
+
+

500

+

+ Oops, something went wrong. +

+
+ + Try again + +
+
+
+
+ ) +} + +export default Error diff --git a/app/src/app/global-error.tsx b/app/src/app/global-error.tsx index 3fa01938..8aaef1d3 100644 --- a/app/src/app/global-error.tsx +++ b/app/src/app/global-error.tsx @@ -1,22 +1,45 @@ 'use client' import { captureException } from '@sentry/nextjs' import { useEffect } from 'react' +import Image from 'next/image' +import Navbar from '@/components/NavBar' -interface GlobalErrorProps { - error: Error & { digest?: string } - reset: () => void -} - -const GlobalError: React.FC = ({ error, reset }) => { +const GlobalError = ({ error }: { error: Error & { digest?: string } }) => { useEffect(() => { captureException(error) }, [error]) return ( - -

Something went wrong!

- + + {/* background */} + Turtle Background + {/* background overlay*/} +
+ + {/* Header */} +
+ +
+ + {/* Content */} +
+
+

500

+

+ Turtle is temporary unavailable. +

+
Try again later
+
+
) diff --git a/app/src/app/not-found.tsx b/app/src/app/not-found.tsx new file mode 100644 index 00000000..1a7ea107 --- /dev/null +++ b/app/src/app/not-found.tsx @@ -0,0 +1,39 @@ +import Image from 'next/image' +import Link from 'next/link' + +const NotFound = () => { + return ( +
+ {/* background */} + Turtle Background for not found 404 page + {/* background overlay*/} +
+ + {/* Content */} +
+
+

404

+

+ Oops, this page is missing. +

+
+

Maybe you clicked on an old link!

+ + Back home + +
+
+
+
+ ) +} + +export default NotFound