feat: load last submission for the user on the benchmark

Author: Mikadows

src/components/Benchmarks/BenchmarkDetail.tsx

@@ -3,7 +3,9 @@ import { RouteComponentProps } from 'react-router-dom';
 import Header from '../Page/Header';
 import Page from '../Page/Page';
 import Editor from '@monaco-editor/react';
-import useProcessInterval from '../../hooks/submissions';
+import useProcessInterval, {
+  useLastSubmissionForUser,
+} from '../../hooks/submissions';
 import Result from '../Dashboard/Result';
 import { Listbox, Transition } from '@headlessui/react';
 import { CheckIcon, SelectorIcon } from '@heroicons/react/solid';
@@ -50,6 +52,14 @@ const BenchmarkDetail = ({
     editorRef.current = editor;
   }
 
+  let lastSubmission;
+  const {
+    isLoading: isLastSubmissionLoading,
+    isError: isLastSubmissionError,
+    data: lastSubmissionData,
+    error: errorLastSubmission,
+  } = useLastSubmissionForUser(match.params.id, selected.name);
+
   // Handle code submission and job result polling
   const {
     mutate,
@@ -85,6 +95,19 @@ const BenchmarkDetail = ({
     }
   }
 
+  if (isLastSubmissionLoading) {
+    lastSubmission = 'Loading...';
+  }
+
+  if (isLastSubmissionError) {
+    if (errorLastSubmission) {
+      lastSubmission = "print('Welcome to Codebench !')";
+    }
+  }
+  if (lastSubmissionData) {
+    lastSubmission = lastSubmissionData.code;
+  }
+
   return (
     <Page>
       <Header
@@ -203,8 +226,8 @@ const BenchmarkDetail = ({
             <Editor
               onMount={handleEditorDidMount}
               height="100%"
-              defaultLanguage="python"
-              defaultValue={`print('hey!')`}
+              value={lastSubmission && lastSubmission}
+              language={selected.name}
             />
           </div>
           <div className="justify-self-start">{result && result}</div>

src/hooks/submissions.ts

@@ -96,3 +96,29 @@ function useProcessInterval({
 }
 
 export default useProcessInterval;
+
+export function useLastSubmissionForUser(
+  benchmarkId: string,
+  language: string,
+) {
+  const { token } = useToken();
+
+  return useQuery<{ code: string }, Error>(`last-submission`, async () => {
+    if (benchmarkId && language) {
+      const { data } = await axios.put(
+        `${process.env.REACT_APP_API_ENDPOINT}/submissions`,
+        {
+          benchmarkId,
+          language,
+        },
+        {
+          headers: {
+            Authorization: `Bearer ${token}`,
+          },
+        },
+      );
+      // console.log(data);
+      return data;
+    }
+  });
+}