web worker test

src/components/player/player-data.tsx

@@ -8,6 +8,8 @@ import { useQuery } from "@tanstack/react-query";
 import PlayerHeader from "./player-header";
 import PlayerRankChart from "./player-rank-chart";
 import PlayerScores from "./player-scores";
+import { useEffect } from "react";
+import { scoresaberReloadedWorker } from "@/common/workers/workers";
 
 const REFRESH_INTERVAL = 5 * 60 * 1000; // 5 minutes
 
@@ -31,6 +33,13 @@ export default function PlayerData({
     refetchInterval: REFRESH_INTERVAL,
   });
 
+  useEffect(() => {
+    (async () => {
+      const worker = scoresaberReloadedWorker();
+      console.log(await worker.getName());
+    })();
+  }, []);
+
   if (data && (!isLoading || !isError)) {
     player = data;
   }

src/components/player/player-scores.tsx

@@ -15,6 +15,41 @@ import Pagination from "../input/pagination";
 import { Button } from "../ui/button";
 import Score from "./score/score";
 
+type Props = {
+  initialScoreData?: ScoreSaberPlayerScoresPage;
+  player: ScoreSaberPlayer;
+  sort: ScoreSort;
+  page: number;
+};
+
+type PageState = {
+  /**
+   * The current page
+   */
+  page: number;
+
+  /**
+   * The current sort
+   */
+  sort: ScoreSort;
+};
+
+const leaderboards = {
+  ScoreSaber: {
+    capabilities: {
+      search: true,
+    },
+    queries: {
+      lookupScores: (player: ScoreSaberPlayer, pageState: PageState) =>
+        scoresaberFetcher.lookupPlayerScores({
+          playerId: player.id,
+          sort: ScoreSort.top,
+          page: 1,
+        }),
+    },
+  },
+};
+
 const scoreSort = [
   {
     name: "Top",
@@ -52,31 +87,13 @@ const scoreAnimation: Variants = {
   },
 };
 
-type Props = {
-  initialScoreData?: ScoreSaberPlayerScoresPage;
-  player: ScoreSaberPlayer;
-  sort: ScoreSort;
-  page: number;
-};
-
-type PageState = {
-  /**
-   * The current page
-   */
-  page: number;
-
-  /**
-   * The current sort
-   */
-  sort: ScoreSort;
-};
-
 export default function PlayerScores({
   initialScoreData,
   player,
   sort,
   page,
 }: Props) {
+  const leaderboard = leaderboards.ScoreSaber;
   const { width } = useWindowDimensions();
   const controls = useAnimation();
 
@@ -96,13 +113,8 @@ export default function PlayerScores({
     isLoading,
     refetch,
   } = useQuery({
-    queryKey: ["playerScores", player.id, pageState],
-    queryFn: () =>
-      scoresaberFetcher.lookupPlayerScores({
-        playerId: player.id,
-        sort: pageState.sort,
-        page: pageState.page,
-      }),
+    queryKey: ["playerScores", player.id, leaderboard, pageState],
+    queryFn: () => leaderboard.queries.lookupScores(player, pageState),
     staleTime: 30 * 1000, // Cache data for 30 seconds
   });