cleanup and track friends data (if not being already tracked)

projects/website/config.ts

@@ -1,4 +0,0 @@
-export const config = {
-  siteUrl: process.env.NEXT_PUBLIC_SITE_URL || "https://ssr.fascinated.cc",
-  siteApi: process.env.NEXT_PUBLIC_SITE_API || "https://ssr.fascinated.cc/api",
-};

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

@@ -7,7 +7,7 @@ import { scoresaberService } from "@ssr/common/service/impl/scoresaber";
 import ScoreSaberLeaderboardScoresPageToken from "@ssr/common/types/token/scoresaber/score-saber-leaderboard-scores-page-token";
 import NodeCache from "node-cache";
 import ScoreSaberLeaderboardToken from "@ssr/common/types/token/scoresaber/score-saber-leaderboard-token";
-import { config } from "../../../../../config";
+import { Config } from "@ssr/common/config";
 
 const UNKNOWN_LEADERBOARD = {
   title: "ScoreSaber Reloaded - Unknown Leaderboard",
@@ -84,7 +84,7 @@ export async function generateMetadata(props: Props): Promise<Metadata> {
       description: `View the scores for ${leaderboard.songName} by ${leaderboard.songAuthorName}!`,
       images: [
         {
-          url: `${config.siteApi}/image/leaderboard/${leaderboard.id}`,
+          url: `${Config.apiUrl}/image/leaderboard/${leaderboard.id}`,
         },
       ],
     },

projects/website/src/app/(pages)/page.tsx

@@ -1,14 +1,14 @@
 import { Button } from "@/components/ui/button";
 import Link from "next/link";
-import { config } from "../../../config";
 import { AppStatistics } from "@ssr/common/types/backend/app-statistics";
 import Statistic from "@/components/home/statistic";
 import { kyFetch } from "@ssr/common/utils/utils";
+import { Config } from "@ssr/common/config";
 
 export const dynamic = "force-dynamic"; // Always generate the page on load
 
 export default async function HomePage() {
-  const statistics = await kyFetch<AppStatistics>(config.siteApi + "/statistics");
+  const statistics = await kyFetch<AppStatistics>(Config.apiUrl + "/statistics");
 
   return (
     <main className="flex flex-col items-center w-full gap-6 text-center">

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

@@ -7,9 +7,9 @@ import { ScoreSort } from "@ssr/common/types/score/score-sort";
 import { scoresaberService } from "@ssr/common/service/impl/scoresaber";
 import ScoreSaberPlayerScoresPageToken from "@ssr/common/types/token/scoresaber/score-saber-player-scores-page-token";
 import ScoreSaberPlayer, { getScoreSaberPlayerFromToken } from "@ssr/common/types/player/impl/scoresaber-player";
-import { config } from "../../../../../config";
 import NodeCache from "node-cache";
 import { getCookieValue } from "@ssr/common/utils/cookie-utils";
+import { Config } from "@ssr/common/config";
 
 const UNKNOWN_PLAYER = {
   title: "ScoreSaber Reloaded - Unknown Player",
@@ -55,8 +55,7 @@ const getPlayerData = async ({ params }: Props, fetchScores: boolean = true): Pr
   }
 
   const playerToken = await scoresaberService.lookupPlayer(id);
-  const player =
-    playerToken && (await getScoreSaberPlayerFromToken(playerToken, config.siteApi, await getCookieValue("playerId")));
+  const player = playerToken && (await getScoreSaberPlayerFromToken(playerToken, await getCookieValue("playerId")));
   let scores: ScoreSaberPlayerScoresPageToken | undefined;
   if (fetchScores) {
     scores = await scoresaberService.lookupPlayerScores({
@@ -98,7 +97,7 @@ export async function generateMetadata(props: Props): Promise<Metadata> {
       description: `Click here to view the scores for ${player.name}!`,
       images: [
         {
-          url: `${config.siteApi}/image/player/${player.id}`,
+          url: `${Config.apiUrl}/image/player/${player.id}`,
         },
       ],
     },

projects/website/src/common/database/database.ts

@@ -5,6 +5,7 @@ import { Friend } from "@/common/database/types/friends";
 import ScoreSaberPlayerToken from "@ssr/common/types/token/scoresaber/score-saber-player-token";
 import { scoresaberService } from "@ssr/common/service/impl/scoresaber";
 import { setCookieValue } from "@ssr/common/utils/cookie-utils";
+import { trackPlayer } from "@ssr/common/utils/player-utils";
 
 const SETTINGS_ID = "SSR"; // DO NOT CHANGE
 
@@ -114,7 +115,12 @@ export default class Database extends Dexie {
     const friends = await this.friends.toArray();
     const players = await Promise.all(
       friends.map(async ({ id }) => {
-        return await scoresaberService.lookupPlayer(id, true);
+        const token = await scoresaberService.lookupPlayer(id, true);
+        if (token == undefined) {
+          return undefined;
+        }
+        await trackPlayer(id); // Track the player
+        return token;
       })
     );
     return players.filter(player => player !== undefined) as ScoreSaberPlayerToken[];

projects/website/src/common/image-utils.ts

@@ -1,6 +1,6 @@
-import { config } from "../../config";
 import ky from "ky";
 import { Colors } from "@/common/colors";
+import { Config } from "@ssr/common/config";
 
 /**
  * Proxies all non-localhost images to make them load faster.
@@ -9,7 +9,7 @@ import { Colors } from "@/common/colors";
  * @returns the new image url
  */
 export function getImageUrl(originalUrl: string) {
-  return `${!config.siteUrl.includes("localhost") ? "https://img.fascinated.cc/upload/q_70/" : ""}${originalUrl}`;
+  return `${!Config.websiteUrl.includes("localhost") ? "https://img.fascinated.cc/upload/q_70/" : ""}${originalUrl}`;
 }
 
 /**
@@ -20,7 +20,7 @@ export function getImageUrl(originalUrl: string) {
  */
 export const getAverageColor = async (src: string) => {
   try {
-    return await ky.get<{ color: string }>(`${config.siteApi}/image/averagecolor/${encodeURIComponent(src)}`).json();
+    return await ky.get<{ color: string }>(`${Config.apiUrl}/image/averagecolor/${encodeURIComponent(src)}`).json();
   } catch {
     return {
       color: Colors.primary,

projects/website/src/components/api/api-health.tsx

@@ -3,9 +3,9 @@
 import { useQuery } from "@tanstack/react-query";
 import { useEffect, useRef, useState } from "react";
 import { getApiHealth } from "@ssr/common/utils/api-utils";
-import { config } from "../../../config";
 import { useToast } from "@/hooks/use-toast";
 import { useIsFirstRender } from "@uidotdev/usehooks";
+import { Config } from "@ssr/common/config";
 
 export function ApiHealth() {
   const { toast } = useToast();
@@ -16,7 +16,7 @@ export function ApiHealth() {
   useQuery({
     queryKey: ["api-health"],
     queryFn: async () => {
-      const status = (await getApiHealth(config.siteApi + "/health")).online;
+      const status = (await getApiHealth(Config.apiUrl + "/health")).online;
       setOnline(status);
       return status;
     },

projects/website/src/components/background-cover.tsx

@@ -1,9 +1,9 @@
 "use client";
 
 import { useLiveQuery } from "dexie-react-hooks";
-import { config } from "../../config";
 import { getImageUrl } from "@/common/image-utils";
 import useDatabase from "../hooks/use-database";
+import { Config } from "@ssr/common/config";
 
 export default function BackgroundCover() {
   const database = useDatabase();
@@ -22,7 +22,7 @@ export default function BackgroundCover() {
     backgroundCover = backgroundCover.substring(1);
   }
   if (prependWebsiteUrl) {
-    backgroundCover = config.siteUrl + "/" + backgroundCover;
+    backgroundCover = Config.websiteUrl + "/" + backgroundCover;
   }
 
   // Static background color

projects/website/src/components/friend/add-friend.tsx

@@ -7,6 +7,7 @@ import Tooltip from "../tooltip";
 import { Button } from "../ui/button";
 import { PersonIcon } from "@radix-ui/react-icons";
 import ScoreSaberPlayer from "@ssr/common/types/player/impl/scoresaber-player";
+import { trackPlayer } from "@ssr/common/utils/player-utils";
 
 type Props = {
   /**
@@ -27,6 +28,7 @@ export default function AddFriend({ player }: Props) {
    * Adds this player as a friend
    */
   async function addFriend() {
+    await trackPlayer(id);
     await database.addFriend(id);
     toast({
       title: "Friend Added",

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

@@ -14,7 +14,6 @@ import ScoreSaberPlayer, { getScoreSaberPlayerFromToken } from "@ssr/common/type
 import ScoreSaberPlayerScoresPageToken from "@ssr/common/types/token/scoresaber/score-saber-player-scores-page-token";
 import { ScoreSort } from "@ssr/common/types/score/score-sort";
 import { scoresaberService } from "@ssr/common/service/impl/scoresaber";
-import { config } from "../../../config";
 import useDatabase from "@/hooks/use-database";
 import { useLiveQuery } from "dexie-react-hooks";
 
@@ -40,16 +39,17 @@ export default function PlayerData({
   const isMiniRankingsVisible = useIsVisible(miniRankingsRef);
   const database = useDatabase();
   const settings = useLiveQuery(() => database.getSettings());
+  const isFriend = useLiveQuery(() => database.isFriend(initialPlayerData.id));
 
   let player = initialPlayerData;
   const { data, isLoading, isError } = useQuery({
-    queryKey: ["playerData", player.id, settings?.playerId],
+    queryKey: ["playerData", player.id, settings?.playerId, isFriend],
     queryFn: async (): Promise<ScoreSaberPlayer | undefined> => {
       const playerResponse = await scoresaberService.lookupPlayer(player.id);
       if (playerResponse == undefined) {
         return undefined;
       }
-      return await getScoreSaberPlayerFromToken(playerResponse, config.siteApi, settings?.playerId);
+      return await getScoreSaberPlayerFromToken(playerResponse, settings?.playerId);
     },
     refetchInterval: REFRESH_INTERVAL,
     refetchIntervalInBackground: false,

projects/website/src/components/player/player-tracked-status.tsx

@@ -2,12 +2,12 @@
 
 import { useQuery } from "@tanstack/react-query";
 import ky from "ky";
-import { config } from "../../../config";
 import Tooltip from "@/components/tooltip";
 import { InformationCircleIcon } from "@heroicons/react/16/solid";
 import { formatNumberWithCommas } from "@ssr/common/utils/number-utils";
 import { PlayerTrackedSince } from "@ssr/common/types/player/player-tracked-since";
 import ScoreSaberPlayer from "@ssr/common/types/player/impl/scoresaber-player";
+import { Config } from "@ssr/common/config";
 
 type Props = {
   player: ScoreSaberPlayer;
@@ -16,7 +16,7 @@ type Props = {
 export default function PlayerTrackedStatus({ player }: Props) {
   const { data, isLoading, isError } = useQuery({
     queryKey: ["playerIsBeingTracked", player.id],
-    queryFn: () => ky.get<PlayerTrackedSince>(`${config.siteApi}/player/tracked/${player.id}`).json(),
+    queryFn: () => ky.get<PlayerTrackedSince>(`${Config.apiUrl}/player/tracked/${player.id}`).json(),
   });
 
   if (isLoading || isError || !data?.tracked) {