Redirect user back to student list if address bar is invalid student id (#253)

Author: hieungo89

src/pages/students/[student_id].tsx

@@ -41,9 +41,17 @@ const ViewStudentPage = () => {
 
   const { data: student, isLoading } = trpc.student.getStudentById.useQuery(
     { student_id: student_id as string },
-    { enabled: Boolean(student_id) }
+    {
+      enabled: Boolean(student_id),
+      retry: false,
+      onError: () => returnToStudentList(),
+    }
   );
 
+  const returnToStudentList = async () => {
+    await router.push(`/students`);
+  };
+
   const buttonSX = {
     "&:hover": {
       background: "#3023B8",
@@ -83,7 +91,7 @@ const ViewStudentPage = () => {
       return;
     }
     await archiveMutation.mutateAsync({ student_id: student.student_id });
-    await router.push(`/students`);
+    await returnToStudentList();
   };
 
   const iepMutation = trpc.student.addIep.useMutation({
@@ -120,6 +128,8 @@ const ViewStudentPage = () => {
     return <div>Loading...</div>;
   }
 
+  if (!student) return;
+
   return (
     <Stack
       spacing={2}