fix(overlay): remove debug

src/app/overlay/page.tsx

@@ -19,7 +19,7 @@ interface OverlayProps {}
 interface OverlayState {
   mounted: boolean;
   player: OverlayPlayer | undefined;
-  settings: any | undefined;
+  config: any | undefined;
 }
 
 export default class Overlay extends Component<OverlayProps, OverlayState> {
@@ -28,7 +28,7 @@ export default class Overlay extends Component<OverlayProps, OverlayState> {
     this.state = {
       mounted: false,
       player: undefined,
-      settings: undefined,
+      config: undefined,
     };
   }
 
@@ -77,9 +77,6 @@ export default class Overlay extends Component<OverlayProps, OverlayState> {
       return;
     }
     this.setState({ mounted: true });
-    if (!this.state.mounted) {
-      HttpSiraStatus.connectWebSocket();
-    }
 
     const url = new URL(window.location.href);
     const searchParams = url.searchParams;
@@ -88,24 +85,26 @@ export default class Overlay extends Component<OverlayProps, OverlayState> {
     if (!data) {
       return;
     }
-    const settings = JSON.parse(data);
+    const config = JSON.parse(data);
-    this.setState({ settings: settings });
+    this.setState({ config: config });
+    const settings = config.settings;
 
-    if (settings.settings.showPlayerStats) {
+    if (settings.showPlayerStats) {
-      this.updatePlayer(settings.accountId, settings.platform);
+      this.updatePlayer(config.accountId, config.platform);
       setInterval(() => {
-        this.updatePlayer(settings.accountId, settings.platform);
+        this.updatePlayer(config.accountId, config.platform);
       }, UPDATE_INTERVAL);
     }
+
+    if (settings.showScoreStats || settings.showSongInfo) {
+      HttpSiraStatus.connectWebSocket();
+    }
   }
 
   render() {
-    const { player } = this.state;
+    const { player, config, mounted } = this.state;
 
-    if (
+    if (!mounted || (!player && config.settings.showPlayerStats)) {
-      !this.state.mounted ||
-      (!player && this.state.settings.settings.showPlayerStats)
-    ) {
       return (
         <main className="flex items-center !bg-transparent p-3">
           <Spinner />
@@ -114,7 +113,7 @@ export default class Overlay extends Component<OverlayProps, OverlayState> {
       );
     }
 
-    if (!this.state.settings) {
+    if (!config) {
       return (
         <main>
           <Container>
@@ -144,12 +143,12 @@ export default class Overlay extends Component<OverlayProps, OverlayState> {
     return (
       <main>
         <div>
-          {this.state.settings.settings.showPlayerStats && player && (
+          {config.settings.showPlayerStats && player && (
-            <PlayerStats player={player} settings={this.state.settings} />
+            <PlayerStats player={player} config={config} />
           )}
-          {this.state.settings.settings.showScoreStats && <ScoreStats />}
+          {config.settings.showScoreStats && <ScoreStats />}
         </div>
-        {this.state.settings.settings.showSongInfo && (
+        {config.settings.showSongInfo && (
           <div className="absolute bottom-0 left-0">
             <SongInfo />
           </div>

src/components/overlay/PlayerStats.tsx

@@ -6,7 +6,7 @@ import CountyFlag from "../CountryFlag";
 
 type PlayerStatsProps = {
   player: OverlayPlayer;
-  settings: any;
+  config: any;
 };
 
 const leaderboardImages: Record<string, string> = {
@@ -14,7 +14,7 @@ const leaderboardImages: Record<string, string> = {
   beatleader: "/assets/logos/beatleader.png",
 };
 
-export default function PlayerStats({ player, settings }: PlayerStatsProps) {
+export default function PlayerStats({ player, config }: PlayerStatsProps) {
   return (
     <div className="flex gap-2 p-2">
       <Image
@@ -28,7 +28,7 @@ export default function PlayerStats({ player, settings }: PlayerStatsProps) {
         <div className="flex gap-1">
           <Image
             alt="Leaderboard logo"
-            src={leaderboardImages[settings.platform]}
+            src={leaderboardImages[config.platform]}
             width={36}
             height={36}
           />

src/utils/beatleader/api.ts

@@ -28,9 +28,6 @@ async function fetchPlayerData(
   );
   const json = await response.json();
 
-  // Check if there was an error fetching the user data
-  console.log(json);
-
   return json as BeatLeaderPlayer;
 }
 
@@ -67,9 +64,6 @@ async function fetchScores(
   );
   const json = await response.json();
 
-  // Check if there was an error fetching the user data
-  console.log(json);
-
   const metadata = json.metadata;
   return {
     scores: json.data as BeatleaderScore[],