Adding default error pages to all routes. Will later customize to eac…

…h page. No other configuration needed, NextJS will automatically wrap all adjacent page files with the error.tsx file

frontend/app/(hub)/dashboard/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/alltaxonomies/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/attributes/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/census/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/personnel/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/quadratpersonnel/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/quadrats/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/species/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/stemdimensions/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/stemtaxonomies/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/fixeddatainput/subquadrats/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/layout.tsx

@@ -122,7 +122,7 @@ export default function HubLayout({ children }: { children: React.ReactNode }) {
     setLoading(true, 'Converting raw census data...');
     const censusList = await createAndUpdateCensusList(censusRDSLoad);
     if (censusListDispatch) {
-      await censusListDispatch({censusList});
+      await censusListDispatch({ censusList });
     }
     setLoading(false);
     setCensusListLoaded(true);
@@ -378,6 +378,7 @@ export default function HubLayout({ children }: { children: React.ReactNode }) {
         </Box>
       </Box>
       <GithubFeedbackModal open={isFeedbackModalOpen} onClose={() => setIsFeedbackModalOpen(false)} />
+      {/* <GithubFeedbackModal open={true} onClose={() => setIsFeedbackModalOpen(false)} /> */}
     </>
   );
 }

frontend/app/(hub)/measurementshub/summary/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/measurementshub/uploadedfiles/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;

frontend/app/(hub)/measurementshub/validationhistory/error.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import React, { useEffect } from 'react';
+import { Box, Typography, Button } from '@mui/joy';
+
+const ErrorPage = ({ error, reset }: { error: Error; reset: () => void }) => {
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      reset();
+    }, 5000);
+    return () => clearTimeout(timer);
+  }, [reset]);
+
+  return (
+    <Box sx={{ p: 3, textAlign: 'center' }}>
+      <Typography level="h1">Something went wrong</Typography>
+      <Typography level="body-lg">{error.message}</Typography>
+      <Typography level="body-lg">Retrying in 5 seconds...</Typography>
+      <Button onClick={reset}>Retry Now</Button>
+    </Box>
+  );
+};
+
+export default ErrorPage;