Perf Problem

oj-lab · Sep 29, 2024 · 2bd8dd3 · 2bd8dd3
1 parent 3ef2bc4
commit 2bd8dd3
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 11 deletions.
diff --git a/src/hooks/problem.ts b/src/hooks/problem.ts
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import * as ProblemServiceModel from "@/models/service/problem";
 import * as ProblemService from "@/apis/problem";
 import { useDispatch } from "react-redux";
@@ -52,8 +52,13 @@ export const useProblemInfoList = () => {
   const [titleQuery, setTitleQuery] = useState<string>("");
   const [difficultyQuery, setDifficultyQuery] = useState<string>("");
 
-  useEffect(() => {
-    ProblemService.getProblemInfoList(limit, offset)
+  const getProblemInfoListFromServer = useCallback(() => {
+    ProblemService.getProblemInfoList(
+      limit,
+      offset,
+      titleQuery,
+      difficultyQuery,
+    )
       .then((res) => {
         setProblemList(res.list);
         setTotal(res.total);
@@ -63,6 +68,16 @@ export const useProblemInfoList = () => {
       });
   }, [limit, offset, titleQuery, difficultyQuery]);
 
+  useEffect(() => {
+    getProblemInfoListFromServer();
+  }, [
+    limit,
+    offset,
+    titleQuery,
+    difficultyQuery,
+    getProblemInfoListFromServer,
+  ]);
+
   function getProblemInfoList() {
     return problemList;
   }
@@ -81,5 +96,15 @@ export const useProblemInfoList = () => {
     setDifficultyQuery(difficultyQuery);
   }
 
-  return { getProblemInfoList, getPageCount, setPagenation, setSearch };
+  function refreshProblemInfoList() {
+    getProblemInfoListFromServer();
+  }
+
+  return {
+    getProblemInfoList,
+    getPageCount,
+    setPagenation,
+    setSearch,
+    refreshProblemInfoList,
+  };
 };
diff --git a/src/pages/problem/Problem.tsx b/src/pages/problem/Problem.tsx
@@ -5,8 +5,9 @@ import CodeEditor from "@/components/input/CodeEditor";
 import MarkdownRender from "@/components/display/MarkdownRender";
 import { useProblem } from "@/hooks/problem";
 import { useRunJudge } from "@/hooks/judge";
+import { isGhPages, isMock } from "@/utils/environment";
 
-const defaultCode = `#include <iostream>
+const mockDefaultCode = `#include <iostream>
 using namespace std;
 
 int main() {
@@ -65,7 +66,7 @@ const Problem: React.FC = () => {
       >
         <CodeEditor
           className="h-full overflow-hidden rounded"
-          value={defaultCode}
+          value={isMock() || isGhPages() ? mockDefaultCode : ""}
           onChange={(value: string) => {
             setSrc(value);
           }}

diff --git a/src/pages/problem/ProblemList.tsx b/src/pages/problem/ProblemList.tsx
@@ -9,8 +9,13 @@ import ProblemSearch, {
 const countPerPageSelections = [10, 25, 50];
 
 const ProblemList: React.FC = () => {
-  const { getProblemInfoList, getPageCount, setPagenation } =
-    useProblemInfoList();
+  const {
+    getProblemInfoList,
+    getPageCount,
+    setPagenation,
+    setSearch,
+    refreshProblemInfoList,
+  } = useProblemInfoList();
   const [countPerPage, setCountPerPage] = React.useState(
     countPerPageSelections[0],
   );
@@ -21,8 +26,7 @@ const ProblemList: React.FC = () => {
 
   useEffect(() => {
     setPagenation(countPerPage, page * countPerPage);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [countPerPage, page]);
+  }, [countPerPage, page, setPagenation]);
 
   return (
     <div className="flex w-full flex-auto flex-col gap-8 sm:flex-row">
@@ -35,7 +39,10 @@ const ProblemList: React.FC = () => {
             onChangeDifficulty={(d) => {
               setSearchingDifficulty(d);
             }}
-            onSearch={() => {}}
+            onSearch={() => {
+              setSearch(searchingTitle, searchingDifficulty);
+              refreshProblemInfoList();
+            }}
             title={searchingTitle}
             difficulty={searchingDifficulty}
           />