only show extra charts if the player is being tracked

src/common/model/player/impl/scoresaber-player.ts

@@ -37,7 +37,7 @@ export default interface ScoreSaberPlayer extends Player {
   /**
    * The rank history for this player.
    */
-  statisticHistory: { [date: string]: PlayerHistory };
+  statisticHistory: { [key: string]: PlayerHistory };
 
   /**
    * The statistics for this player.
@@ -58,6 +58,12 @@ export default interface ScoreSaberPlayer extends Player {
    * Whether the player is inactive or not.
    */
   inactive: boolean;
+
+  /**
+   * Whether the player is having their
+   * statistics being tracked or not.
+   */
+  isBeingTracked?: boolean;
 }
 
 export async function getScoreSaberPlayerFromToken(token: ScoreSaberPlayerToken): Promise<ScoreSaberPlayer> {
@@ -74,6 +80,7 @@ export async function getScoreSaberPlayerFromToken(token: ScoreSaberPlayerToken)
       };
     }) || [];
 
+  let isBeingTracked = false;
   const todayDate = formatDateMinimal(getMidnightAlignedDate(new Date()));
   let statisticHistory: { [key: string]: PlayerHistory } = {};
   try {
@@ -96,6 +103,8 @@ export async function getScoreSaberPlayerFromToken(token: ScoreSaberPlayerToken)
           averageRankedAccuracy: token.scoreStats.averageRankedAccuracy,
         },
       };
+
+      isBeingTracked = true;
     }
     statisticHistory = history;
   } catch (error) {
@@ -168,6 +177,7 @@ export async function getScoreSaberPlayerFromToken(token: ScoreSaberPlayerToken)
     permissions: token.permissions,
     banned: token.banned,
     inactive: token.inactive,
+    isBeingTracked: isBeingTracked,
   };
 }
 

src/components/player/chart/player-charts.tsx

@@ -1,10 +1,10 @@
 "use client";
 
 import ScoreSaberPlayer from "@/common/model/player/impl/scoresaber-player";
-import PlayerAccuracyChart from "@/components/player/chart/player-accuracy-chart";
 import PlayerRankingChart from "@/components/player/chart/player-ranking-chart";
 import { FC, useState } from "react";
 import Tooltip from "@/components/tooltip";
+import PlayerAccuracyChart from "@/components/player/chart/player-accuracy-chart";
 
 type PlayerChartsProps = {
   /**
@@ -37,12 +37,15 @@ export default function PlayerCharts({ player }: PlayerChartsProps) {
       chart: PlayerRankingChart,
       label: "Ranking",
     },
-    {
+  ];
+  if (player.isBeingTracked) {
+    charts.push({
       index: 1,
       chart: PlayerAccuracyChart,
       label: "Accuracy",
-    },
-  ];
+    });
+  }
+
   const [selectedChart, setSelectedChart] = useState<SelectedChart>(charts[0]);
 
   return (
@@ -50,7 +53,8 @@ export default function PlayerCharts({ player }: PlayerChartsProps) {
       {selectedChart.chart({ player })}
 
       <div className="flex items-center justify-center gap-2">
-        {charts.map(chart => {
+        {charts.length > 1 &&
+          charts.map(chart => {
             const isSelected = chart.index === selectedChart.index;
 
             return (

src/components/player/player-scores.tsx

@@ -126,9 +126,12 @@ export default function PlayerScores({ initialScoreData, initialSearch, player,
   /**
    * Gets the URL to the page.
    */
-  const getUrl = (page: number) => {
+  const getUrl = useCallback(
+    (page: number) => {
       return `/player/${player.id}/${pageState.sort}/${page}${isSearchActive ? `?search=${debouncedSearchTerm}` : ""}`;
-  };
+    },
+    [debouncedSearchTerm, player.id, pageState.sort]
+  );
 
   /**
    * Handle updating the URL when the page number,
@@ -137,7 +140,7 @@ export default function PlayerScores({ initialScoreData, initialSearch, player,
   useEffect(() => {
     const newUrl = getUrl(pageState.page);
     window.history.replaceState({ ...window.history.state, as: newUrl, url: newUrl }, "", newUrl);
-  }, [pageState, debouncedSearchTerm, player.id, isSearchActive, getUrl]);
+  }, [pageState, debouncedSearchTerm, player.id, isSearchActive]);
 
   /**k
    * Handle scrolling to the top of the