Save rating and rankings on change (#121)

* Save on change rank * Save proj rating on change
ducompsoc · Aug 28, 2024 · 1c9919c · 1c9919c
1 parent a431c25
commit 1c9919c
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 36 deletions.
diff --git a/client/src/components/judge/Ratings.tsx b/client/src/components/judge/Ratings.tsx
@@ -4,7 +4,7 @@ import { errorAlert } from '../../util';
 import Button from '../Button';
 
 interface RatingsProps {
-    callback: () => void;
+    callback?: () => void;
     submitText?: string;
     prior?: { [x: string]: number }; // TODO: wtf is this type
     small?: boolean;
@@ -19,8 +19,6 @@ const Ratings = (props: RatingsProps) => {
     useEffect(() => {
         if (!props.prior || categories.length === 0) return;
 
-        console.log(props.prior);
-
         const newScores = categories.map((v) => (props.prior as any)[v] ?? 0); // TODO: fix this
         setCategoryScores(newScores);
     }, [props.prior, categories]);
@@ -46,10 +44,12 @@ const Ratings = (props: RatingsProps) => {
     }, []);
 
     // Submit the scores
-    const submit = async () => {
+    const submit = async (newScores: number[]) => {
+        const scoresToUse = props.update ? newScores : categoryScores;
+
         // Create the scores object
         const scores = categories
-            .map((v, i) => ({ [v]: categoryScores[i] }))
+            .map((v, i) => ({ [v]: scoresToUse[i] }))
             .reduce((a, b) => ({ ...a, ...b }), {});
 
         // Score the current project
@@ -66,7 +66,7 @@ const Ratings = (props: RatingsProps) => {
             return;
         }
 
-        props.callback();
+        if (props.callback) props.callback();
     };
 
     return (
@@ -85,20 +85,25 @@ const Ratings = (props: RatingsProps) => {
                             const newScores = [...categoryScores];
                             newScores[i] = parseInt(e.target.value);
                             setCategoryScores(newScores);
+                            if (props.update) submit(newScores);
                         }}
                         className="w-full"
                     />
                 </div>
             ))}
-            <div className="flex justify-center mt-4">
-                <Button
-                    type="primary"
-                    onClick={submit}
-                    className={props.small ? 'p-1 mb-4' : 'mb-4'}
-                >
-                    {props.submitText ?? 'Submit'}
-                </Button>
-            </div>
+            {!props.update ? (
+                <div className="flex justify-center mt-4">
+                    <Button
+                        type="primary"
+                        onClick={submit.bind(this, [])}
+                        className={props.small ? 'p-1 mb-4' : 'mb-4'}
+                    >
+                        {props.submitText ?? 'Submit'}
+                    </Button>
+                </div>
+            ) : (
+                <div className="h-4 w-full"></div>
+            )}
         </div>
     );
 };

diff --git a/client/src/pages/judge/index.tsx b/client/src/pages/judge/index.tsx
@@ -37,7 +37,7 @@ const Judge = () => {
         useSensor(PointerSensor, {
             activationConstraint: {
                 distance: 5,
-            }
+            },
         }),
         useSensor(KeyboardSensor, {
             coordinateGetter: sortableKeyboardCoordinates,
@@ -156,23 +156,22 @@ const Judge = () => {
         const { active, over } = event;
 
         if (over != null) {
-            setProjects((items) => {
-                const oldIndex = projects.findIndex((i) => i.id === active.id);
-                const newIndex = projects.findIndex((i) => i.id === over.id);
-
-                return arrayMove(items, oldIndex, newIndex);
-            });
+            const oldIndex = projects.findIndex((i) => i.id === active.id);
+            const newIndex = projects.findIndex((i) => i.id === over.id);
+            const newProjects = arrayMove(projects, oldIndex, newIndex);
+            setProjects(newProjects);
+            saveSort(newProjects);
         }
 
         setActiveId(null);
     };
 
-    const saveSort = async () => {
+    const saveSort = async (newProjects: SortableJudgedProject[]) => {
         // Split index
-        const splitIndex = projects.findIndex((p) => p.id === -1);
+        const splitIndex = newProjects.findIndex((p) => p.id === -1);
 
         // Get the ranked projects
-        const rankedProjects = projects.slice(0, splitIndex);
+        const rankedProjects = newProjects.slice(0, splitIndex);
 
         // Save the rankings
         const saveRes = await postRequest<OkResponse>('/judge/rank', 'judge', {
@@ -182,14 +181,12 @@ const Judge = () => {
             errorAlert(saveRes);
             return;
         }
-
-        alert('Rankings saved!');
     };
 
     return (
         <>
             <JuryHeader withLogout />
-            <Container noCenter className="px-2">
+            <Container noCenter className="px-2 pb-4">
                 <h1 className="text-2xl my-2">Welcome, {judge?.name}!</h1>
                 <div className="w-full mb-6">
                     <Button type="primary" full square href="/judge/live">
@@ -224,11 +221,6 @@ const Judge = () => {
                         ) : null}
                     </DragOverlay>
                 </DndContext>
-                <div className="flex justify-center mt-4">
-                    <Button type="primary" onClick={saveSort}>
-                        Save
-                    </Button>
-                </div>
             </Container>
         </>
     );

diff --git a/client/src/pages/judge/project.tsx b/client/src/pages/judge/project.tsx
@@ -45,9 +45,6 @@ const Project = () => {
                 </h1>
                 <h2 className="text-xl font-bold text-light mb-2">Table {project.location}</h2>
                 <Ratings
-                    callback={() => {
-                        alert('Ratings submitted!');
-                    }}
                     prior={project.categories}
                     project={project}
                     small