Merge pull request #1063 from yb173/replace_old_api_recent_contest_list

RecentContestList の react-refetch を swr で置き換える

Author: kenkoooo

atcoder-problems-frontend/src/api/InternalAPIClient.ts

@@ -46,3 +46,9 @@ export const useProgressResetList = () => {
     typeCastFetcher<ProgressResetList>(url)
   );
 };
+
+export const useRecentContests = () => {
+  return useSWRData(`${BASE_URL}/contest/recent`, (url) =>
+    typeCastFetcher<VirtualContestInfo[]>(url)
+  );
+};

atcoder-problems-frontend/src/pages/Internal/ApiUrl.ts

@@ -6,7 +6,6 @@ export const CONTEST_UPDATE = `${BASE_URL}/contest/update`;
 export const CONTEST_JOIN = `${BASE_URL}/contest/join`;
 export const CONTEST_LEAVE = `${BASE_URL}/contest/leave`;
 export const CONTEST_CREATE = `${BASE_URL}/contest/create`;
-export const CONTEST_RECENT = `${BASE_URL}/contest/recent`;
 export const CONTEST_ITEM_UPDATE = `${BASE_URL}/contest/item/update`;
 
 export const LIST_MY = `${BASE_URL}/list/my`;

atcoder-problems-frontend/src/pages/Internal/VirtualContest/RecentContestList.tsx

@@ -1,29 +1,20 @@
 import React from "react";
-import { connect, PromiseState } from "react-refetch";
 import { Button, Col, Row } from "reactstrap";
 import { useHistory } from "react-router-dom";
-import { useLoginState } from "../../../api/InternalAPIClient";
+import {
+  useLoginState,
+  useRecentContests,
+} from "../../../api/InternalAPIClient";
 import { getCurrentUnixtimeInSecond } from "../../../utils/DateUtil";
 import { VirtualContestTable } from "../VirtualContestTable";
-import { CONTEST_RECENT } from "../ApiUrl";
-import { VirtualContestInfo } from "../types";
 
-interface InnerProps {
-  contestListGet: PromiseState<VirtualContestInfo[]>;
-}
-
-export const RecentContestList = connect<unknown, InnerProps>(() => ({
-  contestListGet: {
-    url: CONTEST_RECENT,
-  },
-}))((props) => {
+export const RecentContestList = () => {
   const history = useHistory();
   const loginState = useLoginState();
-  const contests = props.contestListGet.fulfilled
-    ? props.contestListGet.value.sort(
-        (a, b) => b.start_epoch_second - a.start_epoch_second
-      )
-    : [];
+  const contests =
+    useRecentContests().data?.sort(
+      (a, b) => b.start_epoch_second - a.start_epoch_second
+    ) ?? [];
   const now = getCurrentUnixtimeInSecond();
   const future = contests.filter((c) => c.start_epoch_second > now);
   const current = contests.filter(
@@ -104,4 +95,4 @@ export const RecentContestList = connect<unknown, InnerProps>(() => ({
       </Row>
     </>
   );
-});
+};