Working version of the error page. However, we might want to remove t…

…he cat gif? (#165)
AFA-Tooling · Sep 26, 2024 · 3b33dc4 · 3b33dc4
1 parent 994d319
commit 3b33dc4
Showing 1 changed file with 27 additions and 14 deletions.
diff --git a/website/src/views/httpError.js b/website/src/views/httpError.js
@@ -15,20 +15,33 @@ export const errorTextOptions = {
  * @param {string} errorText
  * @returns {JSX.Element} error page
  */
-export default function HTTPError({ errorCode, errorText }) {
-    const state = useLocation().state;
+export default function HTTPError({ errorCode = 500, errorText }) {
+    const state = useLocation().state || {};
+    const finalErrorCode = state.errorCode || errorCode;
+    const finalErrorText = errorText || errorTextOptions[finalErrorCode] || 'Oops!  Looks like something went wrong!';
+
     return (
-        <>
-            <Box sx={{ width: '100%', display: 'flex', flexDirection: 'column', alignItems: 'center', position: 'absolute', top: '50%', transform: 'translate(0, -50%)' }}>
-                <Typography variant='h1' component={Box} sx={{ fontWeight: '600' }}>{state.errorCode ? state.errorCode : errorCode ? errorCode : 500}</Typography>
-                <Typography variant='h4' component={Box} sx={{ marginBottom: '10px', textAlign: 'center' }}>
-                    {errorText ? errorText : errorTextOptions[errorCode] ? errorTextOptions[errorCode] : 'Oops!  Looks like something went wrong!'}
-                </Typography>
-                <Typography sx={{ marginBottom: '20px' }}>
-                    Here's a gif of a cat though :D
-                </Typography>
-                <img src="https://cataas.com/cat/gif" alt='Funny gif of a cat.' />
-            </Box>
-        </>
+        <Box
+            sx={{
+                width: '100%',
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center',
+                position: 'absolute',
+                top: '50%',
+                transform: 'translate(0, -50%)'
+            }}
+        >
+            <Typography variant='h1' component={Box} sx={{ fontWeight: '600' }}>
+                {finalErrorCode}
+            </Typography>
+            <Typography variant='h4' component={Box} sx={{ marginBottom: '10px', textAlign: 'center' }}>
+                {finalErrorText}
+            </Typography>
+            <Typography sx={{ marginBottom: '20px' }}>
+                Here's a gif of a cat though :D
+            </Typography>
+            <img src="https://cataas.com/cat/gif" alt='Funny gif of a cat.' />
+        </Box>
     );
 }