fix commander damage text not being centered on chrome

2025-11-17 00:08:01 +00:00 · 2025-02-22 11:45:05 +01:00
15 changed files with 3674 additions and 4171 deletions
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
  "name": "life-trinket",
  "private": true,
-  "version": "1.0.2",
+  "version": "1.0.1",
  "type": "commonjs",
  "engines": {
    "node": ">=20",
@@ -17,39 +17,39 @@
    "deploy": "bun run build && firebase deploy --only hosting"
  },
  "dependencies": {
-    "firebase": "^10.14.1",
+    "firebase": "^10.3.0",
    "ga-4-react": "^0.1.281",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
    "react-screen-wake-lock": "^3.0.2",
-    "react-swipeable": "^7.0.2",
-    "react-twc": "^1.4.2",
-    "semver": "^7.7.1",
-    "zod": "^3.24.2"
+    "react-swipeable": "^7.0.1",
+    "react-twc": "^1.3.0",
+    "semver": "^7.6.2",
+    "zod": "^3.22.4"
  },
  "devDependencies": {
-    "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.14.0",
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.5",
    "@savvywombat/tailwindcss-grid-areas": "^4.0.0",
    "@svgr/cli": "^8.1.0",
-    "@types/react": "^18.3.18",
-    "@types/react-dom": "^18.3.5",
+    "@types/react": "^18.3.1",
+    "@types/react-dom": "^18.3.0",
    "@types/semver": "^7.5.8",
-    "@typescript-eslint/eslint-plugin": "^7.18.0",
-    "@typescript-eslint/parser": "^7.18.0",
-    "@vitejs/plugin-react-swc": "^3.8.0",
-    "autoprefixer": "^10.4.20",
-    "eslint": "^8.57.1",
+    "@typescript-eslint/eslint-plugin": "^7.8.0",
+    "@typescript-eslint/parser": "^7.8.0",
+    "@vitejs/plugin-react-swc": "^3.6.0",
+    "autoprefixer": "^10.4.19",
+    "eslint": "^8.45.0",
    "eslint-plugin-react-hooks": "^4.6.2",
-    "eslint-plugin-react-refresh": "^0.4.19",
-    "firebase-tools": "^13.31.2",
+    "eslint-plugin-react-refresh": "^0.4.6",
+    "firebase-tools": "^13.7.5",
    "install": "^0.13.0",
-    "postcss": "^8.5.3",
+    "postcss": "^8.4.38",
    "prettier": "2.8.8",
    "prop-types": "^15.8.1",
-    "tailwindcss": "^3.4.17",
-    "typescript": "^5.7.3",
-    "vite": "^5.4.14",
-    "vite-plugin-pwa": "^0.20.5"
+    "tailwindcss": "^3.4.3",
+    "typescript": "^5.4.5",
+    "vite": "^5.2.10",
+    "vite-plugin-pwa": "^0.20.0"
  }
 }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/src/Components/Dialogs/SettingsDialog.tsx
+++ b/src/Components/Dialogs/SettingsDialog.tsx
@@ -242,23 +242,6 @@ export const SettingsDialog = ({
          </ul>
        </Description>
      </SettingContainer>
-      <SettingContainer>
-        <ToggleContainer>
-          <label>Show Match Score</label>
-          <ToggleButton
-            checked={settings.showMatchScore}
-            onChange={() => {
-              setSettings({
-                ...settings,
-                showMatchScore: !settings.showMatchScore,
-              });
-            }}
-          />
-        </ToggleContainer>
-        <Description>
-          Shows a score badge on each player's card to track wins across multiple games.
-        </Description>
-      </SettingContainer>
      <Separator height="1px" />
      <div className="flex w-full justify-center">
        <button
--- a/src/Components/GameOver/GameOver.tsx
+++ b/src/Components/GameOver/GameOver.tsx
@@ -1,85 +0,0 @@
-import { twc } from 'react-twc';
-import { Player } from '../../Types/Player';
-
-const Overlay = twc.div`
-  absolute top-0 left-0 w-full h-full
-  bg-black/80 backdrop-blur-sm
-  flex items-center justify-center
-  z-50
-`;
-
-const Modal = twc.div`
-  bg-background-default
-  rounded-2xl p-8
-  max-w-md w-[90%]
-  shadow-2xl
-  flex flex-col gap-6
-`;
-
-const Title = twc.h2`
-  text-[7vmin] font-bold text-center
-  text-text-primary
-  -mb-4
-`;
-
-const ButtonContainer = twc.div`
-  flex flex-col gap-3
-`;
-
-const WinnerName = twc.div`
-  text-[6vmin] font-bold text-center
-  py-[2vmin] px-[3vmin] rounded-xl
-  text-white
-  mb-0
-`;
-
-const PrimaryButton = twc.button`
-  py-[2vmin] px-[3vmin] rounded-xl
-  text-[4vmin] font-semibold
-  bg-interface-primary
-  text-white
-  transition-all duration-200
-  hover:scale-105 active:scale-95
-  border-3 border-white/50
-  shadow-lg shadow-interface-primary/50
-`;
-
-const SecondaryButton = twc.button`
-  py-[2vmin] px-[3vmin] rounded-xl
-  text-[4vmin] font-semibold
-  bg-secondary-main
-  text-text-primary
-  transition-all duration-200
-  hover:scale-105 active:scale-95
-  border-3 border-primary-main
-  shadow-lg shadow-secondary-main/50
-`;
-
-type GameOverProps = {
-  winner: Player;
-  onStartNextGame: () => void;
-  onStay: () => void;
-};
-
-export const GameOver = ({
-  winner,
-  onStartNextGame,
-  onStay,
-}: GameOverProps) => {
-  return (
-    <Overlay>
-      <Modal>
-        <Title>Winner</Title>
-        <WinnerName style={{ backgroundColor: winner.color }}>
-          {winner.name || `Player ${winner.index + 1}`}
-        </WinnerName>
-        <ButtonContainer>
-          <SecondaryButton onClick={onStartNextGame}>
-            Start Next Game
-          </SecondaryButton>
-          <PrimaryButton onClick={onStay}>Close</PrimaryButton>
-        </ButtonContainer>
-      </Modal>
-    </Overlay>
-  );
-};
--- a/src/Components/LifeCounter/LifeCounter.tsx
+++ b/src/Components/LifeCounter/LifeCounter.tsx
@@ -24,21 +24,6 @@ const SettingsButtonTwc = twc.button<RotationButtonProps>((props) => [
    : 'top-1/4 right-[1vmax]',
 ]);

-const MatchScoreBadge = twc.div<RotationDivProps>((props) => [
-  'absolute flex items-center justify-center',
-  'bg-black/70 backdrop-blur-sm',
-  'rounded-full',
-  'w-[5vmin] h-[5vmin]',
-  'text-white font-bold',
-  'text-[3vmin]',
-  'z-[1]',
-  'pointer-events-none',
-  'select-none webkit-user-select-none',
-  props.$rotation === Rotation.Side || props.$rotation === Rotation.SideFlipped
-    ? `left-[6.5vmax] bottom-[1vmax]`
-    : 'left-[0.5vmax] top-[11.5vmin]',
-]);
-
 type SettingsButtonProps = {
  onClick: () => void;
  rotation: Rotation;
@@ -113,12 +98,11 @@ type LifeCounterProps = {
  player: Player;
  opponents: Player[];
  isStartingPlayer?: boolean;
-  matchScore?: number;
 };

 const RECENT_DIFFERENCE_TTL = 3_000;

-const LifeCounter = ({ player, opponents, matchScore }: LifeCounterProps) => {
+const LifeCounter = ({ player, opponents }: LifeCounterProps) => {
  const { updatePlayer, updateLifeTotal } = usePlayers();
  const { settings, playing } = useGlobalSettings();
  const recentDifferenceTimerRef = useRef<NodeJS.Timeout | undefined>(
@@ -231,20 +215,6 @@ const LifeCounter = ({ player, opponents, matchScore }: LifeCounterProps) => {
          key={player.index}
          handleLifeChange={handleLifeChange}
        />
-        {matchScore !== undefined && matchScore > 0 && (
-          <MatchScoreBadge
-            $rotation={player.settings.rotation}
-            style={{
-              rotate:
-                player.settings.rotation === Rotation.Side ||
-                player.settings.rotation === Rotation.SideFlipped
-                  ? `-90deg`
-                  : '0deg',
-            }}
-          >
-            {matchScore}
-          </MatchScoreBadge>
-        )}
        {settings.showPlayerMenuCog && (
          <SettingsButton
            onClick={() => {
@@ -274,8 +244,6 @@ const LifeCounter = ({ player, opponents, matchScore }: LifeCounterProps) => {
          isShown={showPlayerMenu}
          player={player}
          setShowPlayerMenu={setShowPlayerMenu}
-          onForfeit={toggleGameLost}
-          totalPlayers={opponents.length + 1}
        />
      </LifeCounterWrapper>
    </LifeCounterContentWrapper>
--- a/src/Components/Misc/TextComponents.tsx
+++ b/src/Components/Misc/TextComponents.tsx
@@ -2,4 +2,5 @@ import { twc } from 'react-twc';

 export const Paragraph = twc.p`text-text-primary`;

+// eslint-disable-next-line react-refresh/only-export-components
 export const H1 = twc.h1`text-text-primary;`;
--- a/src/Components/Players/PlayerMenu.tsx
+++ b/src/Components/Players/PlayerMenu.tsx
@@ -16,7 +16,6 @@ import {
  PartnerTax,
  Poison,
  ResetGame,
-  Skull,
 } from '../../Icons/generated';
 import { Player, Rotation } from '../../Types/Player';
 import { PreStartMode } from '../../Types/Settings';
@@ -91,21 +90,16 @@ type PlayerMenuProps = {
  player: Player;
  setShowPlayerMenu: (showPlayerMenu: boolean) => void;
  isShown: boolean;
-  onForfeit?: () => void;
-  totalPlayers: number;
 };

 const PlayerMenu = ({
  player,
  setShowPlayerMenu,
  isShown,
-  onForfeit,
-  totalPlayers,
 }: PlayerMenuProps) => {
  const settingsContainerRef = useRef<HTMLDivElement | null>(null);
  const resetGameDialogRef = useRef<HTMLDialogElement | null>(null);
  const endGameDialogRef = useRef<HTMLDialogElement | null>(null);
-  const forfeitGameDialogRef = useRef<HTMLDialogElement | null>(null);

  const { isSide } = useSafeRotate({
    rotation: player.settings.rotation,
@@ -123,7 +117,6 @@ const PlayerMenu = ({
    saveCurrentGame,
    initialGameSettings,
    setPreStartCompleted,
-    gameScore,
  } = useGlobalSettings();

  const analytics = useAnalytics();
@@ -166,7 +159,7 @@ const PlayerMenu = ({
  };

  const handleGoToStart = () => {
-    saveCurrentGame({ players, initialGameSettings, gameScore });
+    saveCurrentGame({ players, initialGameSettings });
    goToStart();
    setRandomizingPlayer(true);
  };
@@ -486,32 +479,6 @@ const PlayerMenu = ({
            >
              <ResetGame size={iconSize} />
            </button>
-
-            <button
-              style={{
-                cursor: 'pointer',
-                userSelect: 'none',
-                fontSize: buttonFontSize,
-                padding: '2px',
-              }}
-              className="text-red-500"
-              onClick={() => {
-                if (totalPlayers === 2) {
-                  forfeitGameDialogRef.current?.show();
-                } else {
-                  if (onForfeit) {
-                    analytics.trackEvent('forfeit_game', {
-                      player: player.index,
-                    });
-                    onForfeit();
-                    setShowPlayerMenu(false);
-                  }
-                }
-              }}
-              aria-label="Forfeit Game"
-            >
-              <Skull size={iconSize} />
-            </button>
          </ButtonsSections>
        </BetterRowContainer>

@@ -592,48 +559,6 @@ const PlayerMenu = ({
            </div>
          </div>
        </dialog>
-
-        <dialog
-          ref={forfeitGameDialogRef}
-          className="z-[999] size-full bg-background-settings overflow-y-scroll"
-          onClick={() => forfeitGameDialogRef.current?.close()}
-        >
-          <div className="flex size-full items-center justify-center">
-            <div className="flex flex-col justify-center p-4 gap-2 bg-background-default rounded-xl border-none">
-              <h1
-                className="text-center text-text-primary"
-                style={{ fontSize: extraCountersSize }}
-              >
-                Forfeit Game?
-              </h1>
-              <div className="flex justify-evenly gap-2">
-                <button
-                  className="bg-primary-main border border-primary-dark text-text-primary rounded-lg flex-grow"
-                  style={{ fontSize: iconSize }}
-                  onClick={() => forfeitGameDialogRef.current?.close()}
-                >
-                  No
-                </button>
-                <button
-                  className="bg-primary-main border border-primary-dark text-text-primary rounded-lg flex-grow"
-                  onClick={() => {
-                    if (onForfeit) {
-                      analytics.trackEvent('forfeit_game', {
-                        player: player.index,
-                      });
-                      onForfeit();
-                      setShowPlayerMenu(false);
-                      forfeitGameDialogRef.current?.close();
-                    }
-                  }}
-                  style={{ fontSize: iconSize }}
-                >
-                  Yes
-                </button>
-              </div>
-            </div>
-          </div>
-        </dialog>
      </SettingsContainer>
    </PlayerMenuWrapper>
  );
--- a/src/Components/Players/Players.tsx
+++ b/src/Components/Players/Players.tsx
@@ -31,7 +31,7 @@ const PlayersWrapper = twc.div`w-full h-full bg-black`;
 export const Players = ({ gridLayout }: { gridLayout: GridLayout }) => {
  const { players } = usePlayers();

-  const { playing, settings, preStartCompleted, gameScore } = useGlobalSettings();
+  const { playing, settings, preStartCompleted } = useGlobalSettings();

  return (
    <PlayersWrapper>
@@ -48,11 +48,6 @@ export const Players = ({ gridLayout }: { gridLayout: GridLayout }) => {
                opponents={players.filter(
                  (opponent) => opponent.index !== player.index
                )}
-                matchScore={
-                  settings.showMatchScore
-                    ? gameScore[player.index]
-                    : undefined
-                }
              />

              {settings.preStartMode === PreStartMode.RandomKing &&
--- a/src/Components/ScoreDisplay/ScoreDisplay.tsx
+++ b/src/Components/ScoreDisplay/ScoreDisplay.tsx
@@ -1,71 +0,0 @@
-import { twc } from 'react-twc';
-import { Player } from '../../Types/Player';
-import { GameScore } from '../../Contexts/GlobalSettingsContext';
-
-const ScoreContainer = twc.div`
-  absolute bottom-4 left-1/2 -translate-x-1/2
-  bg-background-default/90 backdrop-blur-sm
-  rounded-lg p-4
-  shadow-lg
-  z-40
-  min-w-[200px]
-`;
-
-const Title = twc.h3`
-  text-sm font-semibold text-text-secondary
-  uppercase tracking-wide mb-3
-`;
-
-const ScoreList = twc.div`
-  flex flex-col gap-2
-`;
-
-const ScoreItem = twc.div`
-  flex items-center justify-between gap-4
-`;
-
-const PlayerInfo = twc.div`
-  flex items-center gap-2
-`;
-
-const PlayerColor = twc.div`
-  w-4 h-4 rounded-full
-`;
-
-const PlayerName = twc.span`
-  text-text-primary font-medium
-`;
-
-const Score = twc.span`
-  text-text-primary font-bold text-lg
-`;
-
-type ScoreDisplayProps = {
-  players: Player[];
-  gameScore: GameScore;
-};
-
-export const ScoreDisplay = ({ players, gameScore }: ScoreDisplayProps) => {
-  const hasAnyScore = Object.values(gameScore).some((score) => score > 0);
-
-  if (!hasAnyScore) {
-    return null;
-  }
-
-  return (
-    <ScoreContainer>
-      <Title>Match Score</Title>
-      <ScoreList>
-        {players.map((player) => (
-          <ScoreItem key={player.index}>
-            <PlayerInfo>
-              <PlayerColor style={{ backgroundColor: player.color }} />
-              <PlayerName>{player.name || `Player ${player.index + 1}`}</PlayerName>
-            </PlayerInfo>
-            <Score>{gameScore[player.index] || 0}</Score>
-          </ScoreItem>
-        ))}
-      </ScoreList>
-    </ScoreContainer>
-  );
-};
--- a/src/Components/Views/Play.tsx
+++ b/src/Components/Views/Play.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { useEffect } from 'react';
 import { twc } from 'react-twc';
 import { twGridTemplateAreas } from '../../../tailwind.config';
 import { useGlobalSettings } from '../../Hooks/useGlobalSettings';
@@ -6,7 +6,6 @@ import { usePlayers } from '../../Hooks/usePlayers';
 import { Orientation, PreStartMode } from '../../Types/Settings';
 import { Players } from '../Players/Players';
 import { PreStart } from '../PreStartGame/PreStart';
-import { GameOver } from '../GameOver/GameOver';

 const MainWrapper = twc.div`w-[100dvmax] h-[100dvmin] overflow-hidden, setPlayers`;

@@ -15,10 +14,9 @@ type GridTemplateAreasKeys = keyof typeof twGridTemplateAreas;
 export type GridLayout = `grid-areas-${GridTemplateAreasKeys}`;

 export const Play = () => {
-  const { players, setPlayers, resetCurrentGame, setStartingPlayerIndex } = usePlayers();
-  const { initialGameSettings, playing, settings, preStartCompleted, gameScore, setGameScore } =
+  const { players, setPlayers } = usePlayers();
+  const { initialGameSettings, playing, settings, preStartCompleted } =
    useGlobalSettings();
-  const [winner, setWinner] = useState<number | null>(null);

  let gridLayout: GridLayout;
  switch (players.length) {
@@ -96,57 +94,6 @@ export const Play = () => {
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);

-  // Check for game over when only one player remains
-  useEffect(() => {
-    if (players.length < 2 || winner !== null || !settings.showMatchScore) {
-      return;
-    }
-
-    const activePlayers = players.filter((p) => !p.hasLost);
-
-    // If only one player is alive, they are the winner
-    if (activePlayers.length === 1) {
-      setWinner(activePlayers[0].index);
-    }
-  }, [players, winner, settings.showMatchScore]);
-
-  const handleStartNextGame = () => {
-    if (winner === null) return;
-
-    // Update score
-    const newScore = { ...gameScore };
-    newScore[winner] = (newScore[winner] || 0) + 1;
-    setGameScore(newScore);
-
-    // Set the loser as the starting player for next game
-    const loserIndex = players.find((p) => p.index !== winner)?.index ?? 0;
-    setStartingPlayerIndex(loserIndex);
-
-    // Reset game
-    resetCurrentGame();
-    setWinner(null);
-  };
-
-  const handleStay = () => {
-    if (winner === null) return;
-
-    // Update score
-    const newScore = { ...gameScore };
-    newScore[winner] = (newScore[winner] || 0) + 1;
-    setGameScore(newScore);
-
-    // Reset hasLost state for all players
-    setPlayers(
-      players.map((p) => ({
-        ...p,
-        hasLost: false,
-      }))
-    );
-
-    // Clear winner to allow new game over detection
-    setWinner(null);
-  };
-
  return (
    <MainWrapper>
      {players.length > 1 &&
@@ -156,14 +103,6 @@ export const Play = () => {
        settings.showStartingPlayer && <PreStart />}

      <Players gridLayout={gridLayout} />
-
-      {winner !== null && (
-        <GameOver
-          winner={players[winner]}
-          onStartNextGame={handleStartNextGame}
-          onStay={handleStay}
-        />
-      )}
    </MainWrapper>
  );
 };
--- a/src/Components/Views/StartMenu/StartMenu.tsx
+++ b/src/Components/Views/StartMenu/StartMenu.tsx
@@ -64,7 +64,6 @@ const Start = () => {
    setPlaying,
    savedGame,
    saveCurrentGame,
-    setGameScore,
  } = useGlobalSettings();

  const infoDialogRef = useRef<HTMLDialogElement | null>(null);
@@ -214,9 +213,6 @@ const Start = () => {

    setInitialGameSettings(savedGame.initialGameSettings);
    setPlayers(savedGame.players);
-    if (savedGame.gameScore) {
-      setGameScore(savedGame.gameScore);
-    }
    saveCurrentGame(null);
    setRandomizingPlayer(false);
    setShowPlay(true);
@@ -411,31 +407,15 @@ const Start = () => {
            {savedGame && (
              <button
                className="flex flex-grow basis-0 justify-center self-center items-center bg-secondary-main px-3 py-2 rounded-md text-text-primary min-w-[150px]
-
+              
              duration-200 ease-in-out shadow-[1px_2px_4px_0px_rgba(0,0,0,0.3)] hover:bg-secondary-dark font-bold"
                onClick={doResumeGame}
              >
-                <div className="flex flex-col items-center">
-                  <div>
-                    RESUME&nbsp;
-                    <span className="text-xs">
-                      ({savedGame.players.length}&nbsp;
-                      {savedGame.players.length > 1 ? 'players' : 'player'})
-                    </span>
-                  </div>
-                  {savedGame.gameScore && Object.keys(savedGame.gameScore).length > 0 && (
-                    <div className="text-xs opacity-75">
-                      Score: {Object.entries(savedGame.gameScore)
-                        .map(([playerIndex, score]) => {
-                          const player = savedGame.players.find(
-                            (p) => p.index === Number(playerIndex)
-                          );
-                          return `${player?.name || `P${Number(playerIndex) + 1}`}: ${score}`;
-                        })
-                        .join(' | ')}
-                    </div>
-                  )}
-                </div>
+                RESUME&nbsp;
+                <span className="text-xs">
+                  ({savedGame.players.length}&nbsp;
+                  {savedGame.players.length > 1 ? 'players' : 'player'})
+                </span>
              </button>
            )}
          </StartButtonFooter>
--- a/src/Contexts/GlobalSettingsContext.tsx
+++ b/src/Contexts/GlobalSettingsContext.tsx
@@ -12,13 +12,8 @@ type Version = {
 export type SavedGame = {
  initialGameSettings: InitialGameSettings;
  players: Player[];
-  gameScore?: GameScore;
 } | null;

-export type GameScore = {
-  [playerIndex: number]: number;
-};
-
 export type GlobalSettingsContextType = {
  fullscreen: {
    isFullscreen: boolean;
@@ -50,9 +45,6 @@ export type GlobalSettingsContextType = {
  version: Version;
  savedGame: SavedGame;
  saveCurrentGame: (currentGame: SavedGame) => void;
-  gameScore: GameScore;
-  setGameScore: (score: GameScore) => void;
-  resetGameScore: () => void;
 };

 export const GlobalSettingsContext =
--- a/src/Providers/GlobalSettingsProvider.tsx
+++ b/src/Providers/GlobalSettingsProvider.tsx
@@ -1,7 +1,6 @@
 import { ReactNode, useEffect, useMemo, useState } from 'react';
 import { useWakeLock } from 'react-screen-wake-lock';
 import {
-  GameScore,
  GlobalSettingsContext,
  GlobalSettingsContextType,
  SavedGame,
@@ -95,19 +94,6 @@ export const GlobalSettingsProvider = ({
    );
  };

-  const savedGameScore = localStorage.getItem('gameScore');
-  const [gameScore, setGameScore] = useState<GameScore>(
-    savedGameScore ? JSON.parse(savedGameScore) : {}
-  );
-  const setGameScoreAndLocalStorage = (score: GameScore) => {
-    setGameScore(score);
-    localStorage.setItem('gameScore', JSON.stringify(score));
-  };
-  const resetGameScore = () => {
-    setGameScore({});
-    localStorage.removeItem('gameScore');
-  };
-
  // Set settings if they are not valid
  useEffect(() => {
    // If there are no saved settings, set default settings
@@ -185,13 +171,11 @@ export const GlobalSettingsProvider = ({
      localStorage.removeItem('playing');
      localStorage.removeItem('showPlay');
      localStorage.removeItem('preStartComplete');
-      localStorage.removeItem('gameScore');

      setPlaying(false);
      setShowPlay(false);
      setPreStartCompleted(false);
      setSettings({ ...settings, useMonarch: false });
-      setGameScore({});
    };

    const goToStart = async () => {
@@ -315,9 +299,6 @@ export const GlobalSettingsProvider = ({
        isLatest: isLatestVersion,
        checkForNewVersion,
      },
-      gameScore,
-      setGameScore: setGameScoreAndLocalStorage,
-      resetGameScore,
    };
  }, [
    isFullscreen,
@@ -336,7 +317,6 @@ export const GlobalSettingsProvider = ({
    remoteVersion,
    isLatestVersion,
    analytics,
-    gameScore,
  ]);

  return (
--- a/src/Providers/PlayersProvider.tsx
+++ b/src/Providers/PlayersProvider.tsx
@@ -61,11 +61,7 @@ export const PlayersProvider = ({ children }: { children: ReactNode }) => {
        return;
      }

-      // Use the saved starting player index if available, otherwise random
-      const newStartingPlayerIndex =
-        startingPlayerIndex >= 0
-          ? startingPlayerIndex
-          : Math.floor(Math.random() * players.length);
+      const newStartingPlayerIndex = Math.floor(Math.random() * players.length);

      players.forEach((player: Player) => {
        player.commanderDamage.map((damage) => {
--- a/src/Types/Settings.ts
+++ b/src/Types/Settings.ts
@@ -27,7 +27,6 @@ export type Settings = {
  preStartMode: PreStartMode;
  showAnimations: boolean;
  useMonarch: boolean;
-  showMatchScore: boolean;
 };

 export type InitialGameSettings = {
@@ -62,7 +61,6 @@ export const settingsSchema = z.object({
  preStartMode: z.nativeEnum(PreStartMode),
  showAnimations: z.boolean(),
  useMonarch: z.boolean().default(false),
-  showMatchScore: z.boolean().default(true),
 });

 export const defaultSettings: Settings = {
@@ -73,5 +71,4 @@ export const defaultSettings: Settings = {
  preStartMode: PreStartMode.None,
  showAnimations: true,
  useMonarch: false,
-  showMatchScore: true,
 };