projects/common/src/types/player/impl/scoresaber-player.ts

@@ -4,6 +4,9 @@ import { PlayerHistory } from "../player-history";
 import ScoreSaberPlayerToken from "../../token/scoresaber/score-saber-player-token";
 import { formatDateMinimal, getDaysAgoDate, getMidnightAlignedDate } from "../../../utils/time-utils";
 import { getPageFromRank } from "../../../utils/utils";
+import { db } from "website/src/common/database/database";
+import { isServer } from "@tanstack/react-query";
+import { getCookieValue } from "../../../utils/cookie-utils";
 
 /**
  * A ScoreSaber player.
@@ -76,12 +79,10 @@ export default interface ScoreSaberPlayer extends Player {
  *
  * @param token the player token
  * @param apiUrl the api url for SSR
- * @param playerIdCookie the id of the claimed player
  */
 export async function getScoreSaberPlayerFromToken(
   token: ScoreSaberPlayerToken,
-  apiUrl: string,
+  apiUrl: string
-  playerIdCookie?: string
 ): Promise<ScoreSaberPlayer> {
   const bio: ScoreSaberBio = {
     lines: token.bio?.split("\n") || [],
@@ -100,12 +101,13 @@ export async function getScoreSaberPlayerFromToken(
   const todayDate = formatDateMinimal(getMidnightAlignedDate(new Date()));
   let statisticHistory: { [key: string]: PlayerHistory } = {};
 
+  const playerIdCookie = isServer ? await getCookieValue("playerId") : (await db.getSettings())?.playerId;
   try {
     const { statistics: history } = await ky
       .get<{
         statistics: { [key: string]: PlayerHistory };
       }>(
-        `${apiUrl}/player/history/${token.id}${playerIdCookie && playerIdCookie == token.id ? "?createIfMissing=true" : ""}`
+        `${apiUrl}/player/history/${token.id}${playerIdCookie && playerIdCookie === token.id ? "?createIfMissing=true" : ""}`
       )
       .json();
     if (history) {

projects/website/src/app/(pages)/player/[...slug]/page.tsx

@@ -55,8 +55,7 @@ const getPlayerData = async ({ params }: Props, fetchScores: boolean = true): Pr
   }
 
   const playerToken = await scoresaberService.lookupPlayer(id);
-  const player =
+  const player = playerToken && (await getScoreSaberPlayerFromToken(playerToken, config.siteApi));
-    playerToken && (await getScoreSaberPlayerFromToken(playerToken, config.siteApi, await getCookieValue("playerId")));
   let scores: ScoreSaberPlayerScoresPageToken | undefined;
   if (fetchScores) {
     scores = await scoresaberService.lookupPlayerScores({

projects/website/src/components/player/player-data.tsx

@@ -49,7 +49,7 @@ export default function PlayerData({
       if (playerResponse == undefined) {
         return undefined;
       }
-      return await getScoreSaberPlayerFromToken(playerResponse, config.siteApi, settings?.playerId);
+      return await getScoreSaberPlayerFromToken(playerResponse, config.siteApi);
     },
     refetchInterval: REFRESH_INTERVAL,
     refetchIntervalInBackground: false,
@@ -63,10 +63,12 @@ export default function PlayerData({
     <div className="flex gap-2">
       <article className="flex flex-col gap-2">
         <PlayerHeader player={player} />
-        <Card className="gap-1">
+        {!player.inactive && (
-          <PlayerBadges player={player} />
+          <Card className="gap-1">
-          {!player.inactive && <PlayerCharts player={player} />}
+            <PlayerBadges player={player} />
-        </Card>
+            <PlayerCharts player={player} />
+          </Card>
+        )}
         <PlayerScores
           initialScoreData={initialScoreData}
           initialSearch={initialSearch}