Moved around some files to more appropriate places. (#208)

* Deleted unnecessary files and moved contents to more appropriate space.

* Prevent form from clearing after an error. Move types to table file.

src/components/table/table.tsx

@@ -15,10 +15,37 @@ import { styled } from "@mui/material/styles";
 import { visuallyHidden } from "@mui/utils";
 import SearchIcon from "@mui/icons-material/Search";
 import CloseIcon from "@mui/icons-material/Close";
-import { isStudentWithIep, HeadCell, Para, StudentWithIep } from "./tableTypes";
 import $table from "./Table.module.css";
 import $button from "@/styles/Button.module.css";
 import { useRouter } from "next/router";
+import { SelectableForTable } from "zapatos/schema";
+
+export type StudentWithIep = SelectableForTable<"student"> &
+  SelectableForTable<"iep">;
+export type Para = SelectableForTable<"user">;
+
+export interface HeadCell {
+  id: string;
+  label: string;
+  hasInput: boolean;
+}
+
+export interface StudentWithIepHeadcell extends HeadCell {
+  id: keyof StudentWithIep;
+}
+
+export interface ParaHeadCell extends HeadCell {
+  id: keyof Para;
+}
+
+export function isStudentWithIep(
+  person: StudentWithIep | Para
+): person is StudentWithIep {
+  return (
+    (person as StudentWithIep).student_id !== undefined &&
+    (person as StudentWithIep).iep_id !== undefined
+  );
+}
 
 function descendingComparator<T>(a: T, b: T, orderBy: keyof T) {
   if (b[orderBy] < a[orderBy]) {

src/components/taskCard/taskCard.tsx

@@ -5,9 +5,22 @@ import $button from "@/styles/Button.module.css";
 import $box from "@/styles/Box.module.css";
 import Link from "next/link";
 import ProgressBar from "../progressBar/progressBar";
-import { ParaTaskCard } from "@/types/global";
 import { differenceInWeeks, format } from "date-fns";
 
+interface ParaTaskCard {
+  task_id: string;
+  first_name: string;
+  last_name: string;
+  category: string;
+  description: string;
+  instructions: string | null;
+  target_max_attempts: number | null;
+  due_date: Date;
+  seen: boolean;
+  trial_count: number;
+  completed_trials: string | number | bigint | null;
+}
+
 interface TaskCardProps {
   task: ParaTaskCard;
 }

src/pages/staff/index.tsx

@@ -1,8 +1,70 @@
+import { trpc } from "@/client/lib/trpc";
 import React from "react";
-import MyParas from "@/components/myParas/MyParas";
+import PersonTable, { Para, ParaHeadCell } from "@/components/table/table";
 
-function Staff() {
-  return <MyParas />;
-}
+const Staff = () => {
+  const utils = trpc.useContext();
+  const { data: paras, isLoading } = trpc.case_manager.getMyParas.useQuery();
+
+  const createPara = trpc.para.createPara.useMutation({
+    onSuccess: async (data) => {
+      await assignParaToCaseManager.mutateAsync({
+        para_id: data?.user_id as string,
+      });
+    },
+  });
+
+  const assignParaToCaseManager = trpc.case_manager.addPara.useMutation({
+    onSuccess: () => utils.case_manager.getMyParas.invalidate(),
+  });
+
+  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
+    event.preventDefault();
+    const data = new FormData(event.currentTarget);
+
+    try {
+      await createPara.mutateAsync({
+        first_name: data.get("first_name") as string,
+        last_name: data.get("last_name") as string,
+        email: data.get("email") as string,
+      });
+      // resetting the form this way is only necessary if the form remains visible upon adding a person. due to Materials UI, the reset form(s) will show as "touched" (TT).
+      (event.target as HTMLFormElement).reset();
+    } catch (err) {
+      console.error(err);
+    }
+  };
+
+  if (isLoading) {
+    return <div>Loading...</div>;
+  }
+
+  const headCells: ParaHeadCell[] = [
+    {
+      id: "first_name",
+      label: "First Name",
+      hasInput: true,
+    },
+    {
+      id: "last_name",
+      label: "Last Name",
+      hasInput: true,
+    },
+    {
+      id: "email",
+      label: "Email",
+      hasInput: true,
+    },
+  ];
+
+  return (
+    <PersonTable
+      people={paras as Para[]}
+      onSubmit={handleSubmit}
+      headCells={headCells}
+      type="Staff"
+    />
+  );
+};
 
 export default Staff;