fix editing team details (#474)

* normalize judge before editing fix

* added scroll to top when edit team

* fix table number and team key

* fix team and judge id swap

Author: michelleyeoh

app/(api)/_actions/teams/updateTeamWithJudges.ts

@@ -161,7 +161,7 @@ export async function updateTeamWithJudges(
     }
 
     const deleteSubmissionResList = await Promise.all(
-      deleteList.map((judge_id) => removeJudgeFromTeam(judge_id, team_id))
+      deleteList.map((judge_id) => removeJudgeFromTeam(team_id, judge_id))
     );
     if (!deleteSubmissionResList.every((res: any) => res.ok)) {
       throw new Error(

app/(pages)/admin/_components/Judges/JudgeCard.tsx

@@ -59,8 +59,11 @@ export default function JudgeCard({
           ))}
         </div>
         <div className={styles.teams_container}>
-          {judge.teams.map((team: Team) => (
-            <div key={team._id} className={styles.team}>
+          {judge.teams.map((team: Team, index: number) => (
+            <div
+              key={team._id ? team._id : `${team.name ?? 'team'}-${index}`}
+              className={styles.team}
+            >
               {team.name}
             </div>
           ))}

app/(pages)/admin/_components/Teams/TeamForm.tsx

@@ -42,15 +42,25 @@ export default function TeamForm({
     judges.body.map((judge: any) => [judge._id, judge])
   );
 
-  if (data?._id) {
-    data.judges = data.judges.map((judge: any) => {
-      return judgeMap[judge._id];
-    });
-  }
+  const normalizeJudges = (incomingJudges: any[] = []) =>
+    incomingJudges
+      .map((judge: any) => {
+        const judgeId = typeof judge === 'string' ? judge : judge?._id;
+        if (!judgeId) return null;
+        return judgeMap[judgeId] ?? null;
+      })
+      .filter((judge): judge is User => Boolean(judge));
+
+  const normalizedJudges = normalizeJudges(data?.judges ?? []);
 
   const onSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
     event.preventDefault();
 
+    const formData: any = {
+      ...data,
+      judges: normalizeJudges(data?.judges ?? []),
+    };
+
     try {
       const verificationList = [
         {
@@ -59,7 +69,8 @@ export default function TeamForm({
         },
         {
           field: 'tableNumber',
-          validation: Number.isFinite,
+          validation: (tableNumber: any) =>
+            typeof tableNumber === 'string' && tableNumber.trim().length > 0,
         },
         {
           field: 'name',
@@ -85,7 +96,7 @@ export default function TeamForm({
       ];
 
       verificationList.forEach(({ field, validation }) => {
-        if (!validation(data?.[field])) {
+        if (!validation(formData?.[field])) {
           throw new Error(`Form field ${field} failed validation.`);
         }
       });
@@ -95,7 +106,7 @@ export default function TeamForm({
       return;
     }
 
-    const { _id, submissions: _, judges, ...body } = data;
+    const { _id, submissions: _, judges, ...body } = formData;
 
     let team_id = _id;
     if (!team_id) {
@@ -137,9 +148,9 @@ export default function TeamForm({
         required
       />
       <ShortInput
-        type="number"
+        type="text"
         label="table number"
-        value={!isNaN(data.tableNumber) ? data.tableNumber : null}
+        value={data.tableNumber ?? ''}
         updateValue={(newTableNumber) =>
           updateField('tableNumber', newTableNumber)
         }
@@ -176,7 +187,7 @@ export default function TeamForm({
       />
       <ListInput
         label="judges"
-        value={data.judges}
+        value={normalizedJudges}
         direction="column"
         updateValue={(value: any) => updateField('judges', value)}
         itemRenderer={({ key, item, deleteItem, shiftUp, shiftDown }) => {

app/(pages)/admin/teams/page.tsx

@@ -55,6 +55,16 @@ export default function Teams() {
     (team) => team.reports?.length > 0 && team.active
   );
 
+  const handleEditTeam = (team: TeamWithJudges) => {
+    setData(team);
+    window.scrollTo({ top: 0, behavior: 'smooth' });
+
+    const listContainer = document.querySelector(
+      `.${styles.teams_list}`
+    ) as HTMLElement | null;
+    listContainer?.scrollTo({ top: 0, behavior: 'smooth' });
+  };
+
   return (
     <div className={styles.container}>
       <h1 className={styles.page_title}>Team Manager</h1>
@@ -127,7 +137,10 @@ export default function Teams() {
                 className={styles.team_card_wrapper}
                 key={team._id}
               >
-                <TeamCard team={team} onEditClick={() => setData(team)} />
+                <TeamCard
+                  team={team}
+                  onEditClick={() => handleEditTeam(team)}
+                />
               </div>
             ))}
         </div>