fix nits, change to mutate, add submission downloads

frontend2/src/api/compete/useCompete.ts

@@ -22,6 +22,7 @@ import type {
   CompeteSubmissionCreateRequest,
   CompeteSubmissionListRequest,
   CompeteSubmissionTournamentListRequest,
+  CompeteSubmissionDownloadRetrieveRequest,
   HistoricalRating,
   PaginatedMatchList,
   PaginatedScrimmageRequestList,
@@ -38,6 +39,7 @@ import {
   rejectScrimmage,
   requestScrimmage,
   uploadSubmission,
+  downloadSubmission,
 } from "./competeApi";
 import toast from "react-hot-toast";
 import { buildKey } from "../helpers";
@@ -533,3 +535,23 @@ export const useCancelScrimmage = (
       });
     },
   });
+
+/**
+ * For downloading a submission.
+ */
+export const useDownloadSubmission = (
+  { episodeId }: { episodeId: string },
+): UseMutationResult<void, Error, CompeteSubmissionDownloadRetrieveRequest, unknown> =>
+  useMutation({
+    mutationKey: competeMutationKeys.acceptScrim({ episodeId }),
+    mutationFn: async ({
+      episodeId,
+      id,
+    }: CompeteSubmissionDownloadRetrieveRequest) => {
+      await toast.promise(downloadSubmission({ episodeId, id }), {
+        loading: "Downloading submission...",
+        success: "Downloaded submission!",
+        error: "Error downloading submission.",
+      });
+    },
+  });

frontend2/src/components/tables/submissions/SubHistoryTable.tsx

@@ -3,6 +3,10 @@ import {
   type PaginatedSubmissionList,
   StatusBccEnum,
 } from "../../../api/_autogen";
+import { useEpisodeId } from "contexts/EpisodeContext";
+import {
+  useDownloadSubmission
+} from "../../../api/compete/useCompete";
 import type { Maybe } from "../../../utils/utilTypes";
 import { NavLink } from "react-router-dom";
 import { dateTime } from "../../../utils/dateTime";
@@ -26,12 +30,19 @@ interface SubHistoryTableProps {
   handlePage: (page: number) => void;
 }
 
+
+
+// TODO: should i pass episodeId down as a prop?
 const SubHistoryTable: React.FC<SubHistoryTableProps> = ({
   data,
   loading,
   page,
   handlePage,
+  // downloadSubmission,
 }) => {
+  const { episodeId } = useEpisodeId();
+  const downloadSubmission = useDownloadSubmission({ episodeId });
+
   return (
     <Table
       data={data?.results ?? []}
@@ -100,7 +111,10 @@ const SubHistoryTable: React.FC<SubHistoryTableProps> = ({
         {
           header: "",
           key: "download",
-          value: (sub) => "Download",
+          value: (sub) => <button className="text-cyan-600 hover:underline"
+            onClick={
+              () => { downloadSubmission.mutate({ episodeId, id: sub.id.toString() }); }
+            } > Download</button >,
         },
       ]}
     />

frontend2/src/views/Account.tsx

@@ -1,4 +1,4 @@
-import React, { type EventHandler, useState } from "react";
+import React, { useState } from "react";
 import { PageTitle } from "../components/elements/BattlecodeStyle";
 import Input from "../components/elements/Input";
 import TextArea from "../components/elements/TextArea";
@@ -46,19 +46,14 @@ const Account: React.FC = () => {
   const { register: resumeRegister, handleSubmit: handleResumeSubmit } =
     useForm<FileInput>();
 
-  const onAvatarSubmit: SubmitHandler<FileInput> = async (data) => {
+  const onAvatarSubmit: SubmitHandler<FileInput> = (data) => {
     if (uploadAvatar.isPending) return;
-    await uploadAvatar.mutateAsync({ avatar: data.file[0] });
+    uploadAvatar.mutate({ avatar: data.file[0] });
   };
 
-  const onResumeSubmit: SubmitHandler<FileInput> = async (data) => {
+  const onResumeSubmit: SubmitHandler<FileInput> = (data) => {
     if (uploadResume.isPending) return;
-    await uploadResume.mutateAsync({ resume: data.file[0] });
-  };
-
-  // eslint-disable-next-line @typescript-eslint/no-misused-promises
-  const onResumeDownload: EventHandler<React.MouseEvent<HTMLButtonElement>> = async () => {
-    await downloadResume.mutateAsync({ id: user?.id ?? 0 });
+    uploadResume.mutate({ resume: data.file[0] });
   };
 
   return (
@@ -119,7 +114,11 @@ const Account: React.FC = () => {
 
                 ? (<p className="text-sm">
                   Resume uploaded! <button className="text-cyan-600 hover:underline"
-                    onClick={onResumeDownload}>Download</button>
+                    onClick={
+                      () => {
+                        if (user !== undefined) downloadResume.mutate({ id: user.id });
+                      }
+                    }>Download</button>
                 </p>)
                 : <p className="text-sm">No resume uploaded.</p>
               }