icon

package.json

@@ -1,7 +1,7 @@
 {
   "name": "life-trinket",
   "private": true,
-  "version": "1.0.4",
+  "version": "1.0.1",
   "type": "commonjs",
   "engines": {
     "node": ">=20",
@@ -14,16 +14,18 @@
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview",
     "generate-icons": "npx @svgr/cli src/Icons/svgs",
-    "deploy": "bun run build && firebase deploy --only hosting",
+    "deploy": "bun run build && firebase deploy --only hosting"
-    "release": "bash scripts/create-release.sh"
   },
   "dependencies": {
+    "@mui/icons-material": "^6.4.5",
+    "@mui/material": "^6.4.5",
     "firebase": "^10.14.1",
     "ga-4-react": "^0.1.281",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-screen-wake-lock": "^3.0.2",
     "react-swipeable": "^7.0.2",
+    "react-timer-hook": "^3.0.8",
     "react-twc": "^1.4.2",
     "semver": "^7.7.1",
     "zod": "^3.24.2"

pnpm-lock.yaml

@@ -8,6 +8,12 @@ importers:
 
   .:
     dependencies:
+      '@mui/icons-material':
+        specifier: ^6.4.5
+        version: 6.4.5(@mui/material@6.4.5(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@18.3.18)(react@18.3.1)
+      '@mui/material':
+        specifier: ^6.4.5
+        version: 6.4.5(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       firebase:
         specifier: ^10.14.1
         version: 10.14.1
@@ -26,6 +32,9 @@ importers:
       react-swipeable:
         specifier: ^7.0.2
         version: 7.0.2(react@18.3.1)
+      react-timer-hook:
+        specifier: ^3.0.8
+        version: 3.0.8(react@18.3.1)
       react-twc:
         specifier: ^1.4.2
         version: 1.4.2(@types/react@18.3.18)(react@18.3.1)
@@ -1113,6 +1122,97 @@ packages:
   '@jsdevtools/ono@7.1.3':
     resolution: {integrity: sha512-4JQNk+3mVzK3xh2rqd6RB4J46qUR19azEHBneZyTZM+c456qOrbbM/5xcR8huNCCcbVt7+UmizG6GuUvPvKUYg==}
 
+  '@mui/core-downloads-tracker@6.4.5':
+    resolution: {integrity: sha512-zoXvHU1YuoodgMlPS+epP084Pqv9V+Vg+5IGv9n/7IIFVQ2nkTngYHYxElCq8pdTTbDcgji+nNh0lxri2abWgA==}
+
+  '@mui/icons-material@6.4.5':
+    resolution: {integrity: sha512-4A//t8Nrc+4u4pbVhGarIFU98zpuB5AV9hTNzgXx1ySZJ1tWtx+i/1SbQ8PtGJxWeXlljhwimZJNPQ3x0CiIFw==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      '@mui/material': ^6.4.5
+      '@types/react': ^17.0.0 || ^18.0.0 || ^19.0.0
+      react: ^17.0.0 || ^18.0.0 || ^19.0.0
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@mui/material@6.4.5':
+    resolution: {integrity: sha512-5eyEgSXocIeV1JkXs8mYyJXU0aFyXZIWI5kq2g/mCnIgJe594lkOBNAKnCIaGVfQTu2T6TTEHF8/hHIqpiIRGA==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      '@emotion/react': ^11.5.0
+      '@emotion/styled': ^11.3.0
+      '@mui/material-pigment-css': ^6.4.3
+      '@types/react': ^17.0.0 || ^18.0.0 || ^19.0.0
+      react: ^17.0.0 || ^18.0.0 || ^19.0.0
+      react-dom: ^17.0.0 || ^18.0.0 || ^19.0.0
+    peerDependenciesMeta:
+      '@emotion/react':
+        optional: true
+      '@emotion/styled':
+        optional: true
+      '@mui/material-pigment-css':
+        optional: true
+      '@types/react':
+        optional: true
+
+  '@mui/private-theming@6.4.3':
+    resolution: {integrity: sha512-7x9HaNwDCeoERc4BoEWLieuzKzXu5ZrhRnEM6AUcRXUScQLvF1NFkTlP59+IJfTbEMgcGg1wWHApyoqcksrBpQ==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      '@types/react': ^17.0.0 || ^18.0.0 || ^19.0.0
+      react: ^17.0.0 || ^18.0.0 || ^19.0.0
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@mui/styled-engine@6.4.3':
+    resolution: {integrity: sha512-OC402VfK+ra2+f12Gef8maY7Y9n7B6CZcoQ9u7mIkh/7PKwW/xH81xwX+yW+Ak1zBT3HYcVjh2X82k5cKMFGoQ==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      '@emotion/react': ^11.4.1
+      '@emotion/styled': ^11.3.0
+      react: ^17.0.0 || ^18.0.0 || ^19.0.0
+    peerDependenciesMeta:
+      '@emotion/react':
+        optional: true
+      '@emotion/styled':
+        optional: true
+
+  '@mui/system@6.4.3':
+    resolution: {integrity: sha512-Q0iDwnH3+xoxQ0pqVbt8hFdzhq1g2XzzR4Y5pVcICTNtoCLJmpJS3vI4y/OIM1FHFmpfmiEC2IRIq7YcZ8nsmg==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      '@emotion/react': ^11.5.0
+      '@emotion/styled': ^11.3.0
+      '@types/react': ^17.0.0 || ^18.0.0 || ^19.0.0
+      react: ^17.0.0 || ^18.0.0 || ^19.0.0
+    peerDependenciesMeta:
+      '@emotion/react':
+        optional: true
+      '@emotion/styled':
+        optional: true
+      '@types/react':
+        optional: true
+
+  '@mui/types@7.2.21':
+    resolution: {integrity: sha512-6HstngiUxNqLU+/DPqlUJDIPbzUBxIVHb1MmXP0eTWDIROiCR2viugXpEif0PPe2mLqqakPzzRClWAnK+8UJww==}
+    peerDependencies:
+      '@types/react': ^17.0.0 || ^18.0.0 || ^19.0.0
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
+  '@mui/utils@6.4.3':
+    resolution: {integrity: sha512-jxHRHh3BqVXE9ABxDm+Tc3wlBooYz/4XPa0+4AI+iF38rV1/+btJmSUgG4shDtSWVs/I97aDn5jBCt6SF2Uq2A==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      '@types/react': ^17.0.0 || ^18.0.0 || ^19.0.0
+      react: ^17.0.0 || ^18.0.0 || ^19.0.0
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
   '@nodelib/fs.scandir@2.1.5':
     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
     engines: {node: '>= 8'}
@@ -1157,6 +1257,9 @@ packages:
     resolution: {integrity: sha512-c83qWb22rNRuB0UaVCI0uRPNRr8Z0FWnEIvT47jiHAmOIUHbBOg5XvV7pM5x+rKn9HRpjxquDbXYSXr3fAKFcw==}
     engines: {node: '>=12'}
 
+  '@popperjs/core@2.11.8':
+    resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
+
   '@protobufjs/aspromise@1.1.2':
     resolution: {integrity: sha512-j+gKExEuLmKwvz3OgROXtrJ2UG2x8Ch2YZUxahh+s1F2HZ+wAceUNLkvy6zKCPVRkU++ZWQrdxsUeQXmcg4uoQ==}
 
@@ -1562,6 +1665,11 @@ packages:
     peerDependencies:
       '@types/react': ^18.0.0
 
+  '@types/react-transition-group@4.4.12':
+    resolution: {integrity: sha512-8TV6R3h2j7a91c+1DXdJi3Syo69zzIZbz7Lg5tORM5LEJG7X/E6a1V3drRyBRZq7/utz7A+c4OgYLiLcYGHG6w==}
+    peerDependencies:
+      '@types/react': '*'
+
   '@types/react@18.3.18':
     resolution: {integrity: sha512-t4yC+vtgnkYjNSKlFx1jkAhH8LgTo2N/7Qvi83kdEaUtMDiwpbLAktKDaAMlRcJ5eSxZkH74eEGt1ky31d7kfQ==}
 
@@ -2312,6 +2420,9 @@ packages:
     resolution: {integrity: sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==}
     engines: {node: '>=6.0.0'}
 
+  dom-helpers@5.2.1:
+    resolution: {integrity: sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==}
+
   dom-serializer@2.0.0:
     resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}
 
@@ -4005,6 +4116,9 @@ packages:
   react-is@16.13.1:
     resolution: {integrity: sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==}
 
+  react-is@19.0.0:
+    resolution: {integrity: sha512-H91OHcwjZsbq3ClIDHMzBShc1rotbfACdWENsmEf0IFvZ3FgGPtdHMcsv45bQ1hAbgdfiA8SnxTKfDS+x/8m2g==}
+
   react-screen-wake-lock@3.0.2:
     resolution: {integrity: sha512-f88vcfMG1AWYRSIWQ5Qx5YVboH6TSL0F4ZlFLERZp6aKiZRGVRAAJ9wedJdO5jqTMcCDZ4OXJ8PjcSkDmvGSBg==}
     engines: {node: '>=14.16'}
@@ -4016,6 +4130,17 @@ packages:
     peerDependencies:
       react: ^16.8.3 || ^17 || ^18 || ^19.0.0 || ^19.0.0-rc
 
+  react-timer-hook@3.0.8:
+    resolution: {integrity: sha512-bi2e7DhPBU1MRPU4ZHaVqBmgM9e2HK0ae8O2AIqwqjcPo4/qR7lVGQonOQLAKOZPQCJSYfV8F5aBWzOLXElzqQ==}
+    peerDependencies:
+      react: '>=16.8.0'
+
+  react-transition-group@4.4.5:
+    resolution: {integrity: sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==}
+    peerDependencies:
+      react: '>=16.6.0'
+      react-dom: '>=16.6.0'
+
   react-twc@1.4.2:
     resolution: {integrity: sha512-ix8Z1dNacL29Vri3rWsQqRYMQXWCNzbI1qhz0yyvcbO057HZwz3rXZDQ7TcOE1hQ7EHornX3ka2reO27RmXiYA==}
 
@@ -6216,6 +6341,91 @@ snapshots:
 
   '@jsdevtools/ono@7.1.3': {}
 
+  '@mui/core-downloads-tracker@6.4.5': {}
+
+  '@mui/icons-material@6.4.5(@mui/material@6.4.5(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@18.3.18)(react@18.3.1)':
+    dependencies:
+      '@babel/runtime': 7.26.9
+      '@mui/material': 6.4.5(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      react: 18.3.1
+    optionalDependencies:
+      '@types/react': 18.3.18
+
+  '@mui/material@6.4.5(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
+    dependencies:
+      '@babel/runtime': 7.26.9
+      '@mui/core-downloads-tracker': 6.4.5
+      '@mui/system': 6.4.3(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1)
+      '@mui/types': 7.2.21(@types/react@18.3.18)
+      '@mui/utils': 6.4.3(@types/react@18.3.18)(react@18.3.1)
+      '@popperjs/core': 2.11.8
+      '@types/react-transition-group': 4.4.12(@types/react@18.3.18)
+      clsx: 2.1.1
+      csstype: 3.1.3
+      prop-types: 15.8.1
+      react: 18.3.1
+      react-dom: 18.3.1(react@18.3.1)
+      react-is: 19.0.0
+      react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+    optionalDependencies:
+      '@emotion/react': 11.14.0(@types/react@18.3.18)(react@18.3.1)
+      '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1)
+      '@types/react': 18.3.18
+
+  '@mui/private-theming@6.4.3(@types/react@18.3.18)(react@18.3.1)':
+    dependencies:
+      '@babel/runtime': 7.26.9
+      '@mui/utils': 6.4.3(@types/react@18.3.18)(react@18.3.1)
+      prop-types: 15.8.1
+      react: 18.3.1
+    optionalDependencies:
+      '@types/react': 18.3.18
+
+  '@mui/styled-engine@6.4.3(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1))(react@18.3.1)':
+    dependencies:
+      '@babel/runtime': 7.26.9
+      '@emotion/cache': 11.14.0
+      '@emotion/serialize': 1.3.3
+      '@emotion/sheet': 1.4.0
+      csstype: 3.1.3
+      prop-types: 15.8.1
+      react: 18.3.1
+    optionalDependencies:
+      '@emotion/react': 11.14.0(@types/react@18.3.18)(react@18.3.1)
+      '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1)
+
+  '@mui/system@6.4.3(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1)':
+    dependencies:
+      '@babel/runtime': 7.26.9
+      '@mui/private-theming': 6.4.3(@types/react@18.3.18)(react@18.3.1)
+      '@mui/styled-engine': 6.4.3(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1))(react@18.3.1)
+      '@mui/types': 7.2.21(@types/react@18.3.18)
+      '@mui/utils': 6.4.3(@types/react@18.3.18)(react@18.3.1)
+      clsx: 2.1.1
+      csstype: 3.1.3
+      prop-types: 15.8.1
+      react: 18.3.1
+    optionalDependencies:
+      '@emotion/react': 11.14.0(@types/react@18.3.18)(react@18.3.1)
+      '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@18.3.18)(react@18.3.1))(@types/react@18.3.18)(react@18.3.1)
+      '@types/react': 18.3.18
+
+  '@mui/types@7.2.21(@types/react@18.3.18)':
+    optionalDependencies:
+      '@types/react': 18.3.18
+
+  '@mui/utils@6.4.3(@types/react@18.3.18)(react@18.3.1)':
+    dependencies:
+      '@babel/runtime': 7.26.9
+      '@mui/types': 7.2.21(@types/react@18.3.18)
+      '@types/prop-types': 15.7.14
+      clsx: 2.1.1
+      prop-types: 15.8.1
+      react: 18.3.1
+      react-is: 19.0.0
+    optionalDependencies:
+      '@types/react': 18.3.18
+
   '@nodelib/fs.scandir@2.1.5':
     dependencies:
       '@nodelib/fs.stat': 2.0.5
@@ -6263,6 +6473,8 @@ snapshots:
       '@pnpm/network.ca-file': 1.0.2
       config-chain: 1.1.13
 
+  '@popperjs/core@2.11.8': {}
+
   '@protobufjs/aspromise@1.1.2': {}
 
   '@protobufjs/base64@1.1.2': {}
@@ -6598,6 +6810,10 @@ snapshots:
     dependencies:
       '@types/react': 18.3.18
 
+  '@types/react-transition-group@4.4.12(@types/react@18.3.18)':
+    dependencies:
+      '@types/react': 18.3.18
+
   '@types/react@18.3.18':
     dependencies:
       '@types/prop-types': 15.7.14
@@ -7401,6 +7617,11 @@ snapshots:
     dependencies:
       esutils: 2.0.3
 
+  dom-helpers@5.2.1:
+    dependencies:
+      '@babel/runtime': 7.26.9
+      csstype: 3.1.3
+
   dom-serializer@2.0.0:
     dependencies:
       domelementtype: 2.3.0
@@ -9417,6 +9638,8 @@ snapshots:
 
   react-is@16.13.1: {}
 
+  react-is@19.0.0: {}
+
   react-screen-wake-lock@3.0.2(react@18.3.1):
     dependencies:
       react: 18.3.1
@@ -9425,6 +9648,19 @@ snapshots:
     dependencies:
       react: 18.3.1
 
+  react-timer-hook@3.0.8(react@18.3.1):
+    dependencies:
+      react: 18.3.1
+
+  react-transition-group@4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
+    dependencies:
+      '@babel/runtime': 7.26.9
+      dom-helpers: 5.2.1
+      loose-envify: 1.4.0
+      prop-types: 15.8.1
+      react: 18.3.1
+      react-dom: 18.3.1(react@18.3.1)
+
   react-twc@1.4.2(@types/react@18.3.18)(react@18.3.1):
     dependencies:
       '@radix-ui/react-slot': 1.1.2(@types/react@18.3.18)(react@18.3.1)

scripts/README.md

@@ -1,74 +0,0 @@
-# Release Scripts
-
-## create-release.sh
-
-This script automates the process of creating a new release for LifeTrinket.
-
-### Usage
-
-```bash
-npm run release
-# or
-pnpm release
-# or
-bash scripts/create-release.sh
-```
-
-### What it does
-
-1. **Reads the current version** from `package.json`
-2. **Checks for existing tags** - If a tag with the current version already exists, it will prompt you to update the version in `package.json` first
-3. **Warns about uncommitted changes** - Prompts for confirmation if you have uncommitted changes
-4. **Prompts for release description** - You can enter a multi-line description for the release
-5. **Creates an annotated git tag** with the version and description
-6. **Pushes the tag to remote** - This triggers the GitHub Actions workflow that builds and deploys the app
-
-### Workflow
-
-When you push a tag, the following happens:
-
-1. The `firebase-release.yml` workflow is triggered
-2. The app is built and deployed to Firebase Hosting
-3. A GitHub release is created with the version number
-
-### Before running
-
-Make sure to:
-
-1. **Update the version** in `package.json` if needed
-2. **Commit all changes** you want to include in the release
-3. **Test the build** with `npm run build` to ensure everything works
-
-### Example
-
-```bash
-# 1. Update version in package.json to 1.0.3
-# 2. Commit your changes
-git add .
-git commit -m "feat: add new features for v1.0.3"
-
-# 3. Run the release script
-npm run release
-
-# The script will:
-# - Show current version: 1.0.3
-# - Prompt for confirmation
-# - Ask for release description
-# - Create and push the tag
-# - Trigger the deployment workflow
-```
-
-### Troubleshooting
-
-**"Tag already exists" error:**
-
-- Update the version in `package.json` before creating a new release
-
-**"Failed to push tag" error:**
-
-- Check your git remote permissions
-- Try pushing manually: `git push origin <version>`
-
-**Script won't run:**
-
-- Make sure the script is executable: `chmod +x scripts/create-release.sh`

scripts/create-release.sh

@@ -1,87 +0,0 @@
-#!/bin/bash
-
-# Color codes for output
-RED='\033[0;31m'
-GREEN='\033[0;32m'
-YELLOW='\033[1;33m'
-BLUE='\033[0;34m'
-NC='\033[0m' # No Color
-
-echo -e "${BLUE}=== LifeTrinket Release Script ===${NC}\n"
-
-# Get current version from package.json
-CURRENT_VERSION=$(node -p "require('./package.json').version")
-
-if [ -z "$CURRENT_VERSION" ]; then
-  echo -e "${RED}Error: Could not read version from package.json${NC}"
-  exit 1
-fi
-
-echo -e "${BLUE}Current version in package.json:${NC} ${GREEN}$CURRENT_VERSION${NC}"
-
-# Check if we're on a clean working tree
-if [[ -n $(git status -s) ]]; then
-  echo -e "${YELLOW}Warning: You have uncommitted changes.${NC}"
-fi
-
-# Fetch latest tags from remote
-echo -e "\n${BLUE}Fetching latest tags from remote...${NC}"
-git fetch --tags
-
-# Check if tag already exists locally or remotely
-if git rev-parse "$CURRENT_VERSION" >/dev/null 2>&1; then
-  echo -e "${RED}Error: Tag '$CURRENT_VERSION' already exists!${NC}"
-  echo -e "${YELLOW}Please update the version in package.json before creating a new release.${NC}"
-  echo -e "${YELLOW}Current version: $CURRENT_VERSION${NC}"
-  exit 1
-fi
-
-# Get the latest tag (if any)
-LATEST_TAG=$(git describe --tags --abbrev=0 2>/dev/null)
-
-if [ -n "$LATEST_TAG" ]; then
-  echo -e "${BLUE}Latest existing tag:${NC} ${YELLOW}$LATEST_TAG${NC}"
-
-  # Compare versions
-  if [ "$LATEST_TAG" = "$CURRENT_VERSION" ]; then
-    echo -e "${RED}Error: Latest tag matches current version ($CURRENT_VERSION)${NC}"
-    echo -e "${YELLOW}Please update the version in package.json before creating a new release.${NC}"
-    exit 1
-  fi
-else
-  echo -e "${YELLOW}No existing tags found. This will be the first release.${NC}"
-fi
-
-# Get release description from user
-echo -e "\n${BLUE}Enter release description (optional, press Enter to skip):${NC}"
-read -r RELEASE_DESCRIPTION
-
-if [ -z "$RELEASE_DESCRIPTION" ]; then
-  RELEASE_DESCRIPTION="Release $CURRENT_VERSION"
-fi
-
-# Create annotated tag with description
-echo -e "\n${BLUE}Creating tag '$CURRENT_VERSION'...${NC}"
-git tag -a "$CURRENT_VERSION" -m "$RELEASE_DESCRIPTION"
-
-if [ $? -ne 0 ]; then
-  echo -e "${RED}Error: Failed to create tag${NC}"
-  exit 1
-fi
-
-echo -e "${GREEN}✓ Tag created successfully${NC}"
-
-# Push tag to remote
-echo -e "\n${BLUE}Pushing tag to remote...${NC}"
-git push origin "$CURRENT_VERSION"
-
-if [ $? -ne 0 ]; then
-  echo -e "${RED}Error: Failed to push tag${NC}"
-  echo -e "${YELLOW}Tag was created locally. You can try pushing manually:${NC}"
-  echo -e "  git push origin $CURRENT_VERSION"
-  exit 1
-fi
-
-echo -e "\n${GREEN}✓ Tag pushed successfully!${NC}"
-echo -e "${BLUE}GitHub Actions will now build and deploy version $CURRENT_VERSION${NC}"
-echo -e "${BLUE}Check the progress at:${NC} https://github.com/Vikeo/LifeTrinket/actions"

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

src/Components/GameOver/GameOver.tsx

@@ -1,85 +0,0 @@
-import { twc } from 'react-twc';
-import { Player } from '../../Types/Player';
-
-const Overlay = twc.div`
-  fixed top-0 left-0 w-[100dvmax] h-[100dvmin]
-  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>
-  );
-};

src/Components/LifeCounter/LifeCounter.tsx

@@ -24,27 +24,6 @@ const SettingsButtonTwc = twc.button<RotationButtonProps>((props) => [
     : 'top-1/4 right-[1vmax]',
 ]);
 
-type MatchScoreBadgeProps = RotationDivProps & {
-  $useCommanderDamage: boolean;
-};
-
-const MatchScoreBadge = twc.div<MatchScoreBadgeProps>((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]`
-    : props.$useCommanderDamage
-    ? 'left-[0.5vmax] top-[11.5vmin]'
-    : 'left-[0.5vmax] top-[1vmax]',
-]);
-
 type SettingsButtonProps = {
   onClick: () => void;
   rotation: Rotation;
@@ -119,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>(
@@ -237,21 +215,6 @@ const LifeCounter = ({ player, opponents, matchScore }: LifeCounterProps) => {
           key={player.index}
           handleLifeChange={handleLifeChange}
         />
-        {matchScore !== undefined && matchScore > 0 && (
-          <MatchScoreBadge
-            $rotation={player.settings.rotation}
-            $useCommanderDamage={player.settings.useCommanderDamage}
-            style={{
-              rotate:
-                player.settings.rotation === Rotation.Side ||
-                player.settings.rotation === Rotation.SideFlipped
-                  ? `-90deg`
-                  : '0deg',
-            }}
-          >
-            {matchScore}
-          </MatchScoreBadge>
-        )}
         {settings.showPlayerMenuCog && (
           <SettingsButton
             onClick={() => {
@@ -281,8 +244,6 @@ const LifeCounter = ({ player, opponents, matchScore }: LifeCounterProps) => {
           isShown={showPlayerMenu}
           player={player}
           setShowPlayerMenu={setShowPlayerMenu}
-          onForfeit={toggleGameLost}
-          totalPlayers={opponents.length + 1}
         />
       </LifeCounterWrapper>
     </LifeCounterContentWrapper>

src/Components/Misc/Timer/NegativeStopWatch.tsx

@@ -0,0 +1,37 @@
+import { useStopwatch } from 'react-timer-hook';
+import { TimerStyle, TimerWrapper } from './Timer';
+import { Time } from './Time';
+import PlayArrowIcon from '@mui/icons-material/PlayArrow';
+import PauseIcon from '@mui/icons-material/Pause';
+
+export const NegativeStopWatch = ({
+  autoStart = false,
+}: {
+  autoStart?: boolean;
+}) => {
+  // Initialize the timer using the useTimer hook.
+  const { seconds, minutes, hours, isRunning, start, pause } = useStopwatch({
+    autoStart,
+  });
+
+  return (
+    <TimerWrapper>
+      <TimerStyle>
+        {'-'}
+        <Time time={{ hours, minutes, seconds }} />
+        <div>
+          {!isRunning && (
+            <button onClick={start}>
+              <PlayArrowIcon />
+            </button>
+          )}
+          {isRunning && (
+            <button onClick={pause}>
+              <PauseIcon />
+            </button>
+          )}
+        </div>
+      </TimerStyle>
+    </TimerWrapper>
+  );
+};

src/Components/Misc/Timer/Time.tsx

@@ -0,0 +1,9 @@
+import { formatTime } from '../../../Utils/formatTime';
+
+export const Time = ({
+  time,
+}: {
+  time: { hours: number; minutes: number; seconds: number };
+}) => {
+  return <div className="tabular-nums">{formatTime({ time })}</div>;
+};

src/Components/Misc/Timer/Timer.tsx

@@ -0,0 +1,84 @@
+import { useState } from 'react';
+import { useTimer } from 'react-timer-hook';
+import { NegativeStopWatch } from './NegativeStopWatch';
+import { twc } from 'react-twc';
+import PauseIcon from '@mui/icons-material/Pause';
+import RestartAltIcon from '@mui/icons-material/RestartAlt';
+import PlayArrowIcon from '@mui/icons-material/PlayArrow';
+import { Time } from './Time';
+
+export const TimerWrapper = twc.div`
+absolute z-50 top-0 w-screen flex items-center flex-col 
+`;
+
+export const TimerStyle = twc.div`
+flex gap-2 bg-interface-recentDifference-background py-1 px-4 rounded-full
+`;
+
+const TIMER_MINUTES = 50;
+
+export const Timer = () => {
+  // Set the default expiry time to 50 minutes from now.
+  const defaultExpiry = new Date();
+  defaultExpiry.setMinutes(defaultExpiry.getMinutes() + TIMER_MINUTES);
+
+  const [hasStarted, setHasStarted] = useState(false);
+
+  // Initialize the timer using the useTimer hook.
+  const { seconds, minutes, hours, isRunning, start, pause, restart } =
+    useTimer({
+      expiryTimestamp: defaultExpiry,
+      onExpire: () => console.warn('Timer expired'),
+      autoStart: false,
+    });
+
+  // Function to restart the timer for 50 minutes.
+  const handleRestart = () => {
+    const time = new Date();
+    time.setMinutes(time.getMinutes() + TIMER_MINUTES);
+    restart(time);
+  };
+
+  const handleStart = () => {
+    setHasStarted(true);
+    start();
+  };
+
+  const handlePause = () => {
+    setHasStarted(false);
+    pause();
+  };
+
+  if (hasStarted && !isRunning) {
+    return <NegativeStopWatch autoStart />;
+  }
+
+  return (
+    <TimerWrapper>
+      <TimerStyle>
+        <Time
+          time={{
+            hours,
+            minutes,
+            seconds,
+          }}
+        />
+        <div>
+          {!isRunning && (
+            <button onClick={handleStart}>
+              <PlayArrowIcon />
+            </button>
+          )}
+          {isRunning && (
+            <button onClick={handlePause}>
+              <PauseIcon />
+            </button>
+          )}
+          <button onClick={handleRestart}>
+            <RestartAltIcon />
+          </button>
+        </div>
+      </TimerStyle>
+    </TimerWrapper>
+  );
+};

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>
   );

src/Components/Players/Players.tsx

@@ -6,6 +6,7 @@ import { PreStartMode } from '../../Types/Settings';
 import LifeCounter from '../LifeCounter/LifeCounter';
 import { RoulettePlayerCard } from '../PreStartGame/Games/RandomKing/RoulettePlayerCard';
 import { GridLayout } from '../Views/Play';
+import { Timer } from '../Misc/Timer/Timer';
 
 const getGridArea = (player: PlayerType) => {
   switch (player.index) {
@@ -31,11 +32,12 @@ 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>
       <div className={`grid w-full h-full gap-1 box-border ${gridLayout} `}>
+        <Timer />
         {players.map((player) => {
           const gridArea = getGridArea(player);
           return (
@@ -48,11 +50,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 &&

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>
-  );
-};

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,12 +14,12 @@ type GridTemplateAreasKeys = keyof typeof twGridTemplateAreas;
 export type GridLayout = `grid-areas-${GridTemplateAreasKeys}`;
 
 export const Play = () => {
-  const { players, setPlayers, resetCurrentGame, setStartingPlayerIndex } = usePlayers();
+  const { players, setPlayers } = usePlayers();
-  const { initialGameSettings, playing, settings, preStartCompleted, gameScore, setGameScore } =
+  const { initialGameSettings, playing, settings, preStartCompleted } =
     useGlobalSettings();
-  const [winner, setWinner] = useState<number | null>(null);
 
   let gridLayout: GridLayout;
+
   switch (players.length) {
     case 1:
       if (initialGameSettings?.orientation === Orientation.Portrait) {
@@ -96,57 +95,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 &&
@@ -154,16 +102,7 @@ export const Play = () => {
         settings.preStartMode !== PreStartMode.None &&
         !playing &&
         settings.showStartingPlayer && <PreStart />}
-
       <Players gridLayout={gridLayout} />
-
-      {winner !== null && (
-        <GameOver
-          winner={players[winner]}
-          onStartNextGame={handleStartNextGame}
-          onStay={handleStay}
-        />
-      )}
     </MainWrapper>
   );
 };

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);
@@ -415,27 +411,11 @@ const Start = () => {
               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>
               </button>
             )}
           </StartButtonFooter>

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 =

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 (

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 = Math.floor(Math.random() * players.length);
-      const newStartingPlayerIndex =
-        startingPlayerIndex >= 0
-          ? startingPlayerIndex
-          : Math.floor(Math.random() * players.length);
 
       players.forEach((player: Player) => {
         player.commanderDamage.map((damage) => {

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,
 };

src/Utils/formatTime.ts

@@ -0,0 +1,17 @@
+export const formatTime = ({
+  time,
+}: {
+  time: { hours: number; minutes: number; seconds: number };
+}) => {
+  const h = time.hours.toString().padStart(2, '0');
+  const m = time.minutes.toString().padStart(2, '0');
+  const s = time.seconds.toString().padStart(2, '0');
+
+  if (time.hours > 0) {
+    return `${h}:${m}:${s}`;
+  } else if (time.minutes > 0) {
+    return `${m}:${s}`;
+  } else {
+    return s;
+  }
+};