From 666f367c6a716c30407fafbd7dac1feb5c3381d7 Mon Sep 17 00:00:00 2001
From: maldestor95 <maldestor95@gmail.com>
Date: Sun, 19 May 2024 08:30:50 +0200
Subject: [PATCH] track user by id instead of tracking by name

---
 package-lock.json            | 63 +++++++++++++++++++++++++++---------
 package.json                 |  2 ++
 src/pages/wizard/players.vue |  6 ++--
 src/pages/wizard/score.vue   |  6 ++--
 src/pages/wizard/store.ts    | 20 +++++++++---
 5 files changed, 70 insertions(+), 27 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 14f0203..167cc31 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,12 +13,14 @@
         "chartjs-plugin-zoom": "^2.0.1",
         "markdown-it": "^13.0.1",
         "pinia": "^2.1.7",
+        "uuid": "^9.0.1",
         "vue": "^3.4.5",
         "vue-chartjs": "^5.3.0",
         "yaml": "^2.3.1"
       },
       "devDependencies": {
         "@types/markdown-it": "^12.2.3",
+        "@types/uuid": "^9.0.8",
         "@vitejs/plugin-vue": "^4.2.3",
         "autoprefixer": "^10.4.14",
         "postcss": "^8.4.27",
@@ -518,6 +520,12 @@
       "integrity": "sha512-eC4U9MlIcu2q0KQmXszyn5Akca/0jrQmwDRgpAMJai7qBWq4amIQhZyNau4VYGtCeALvW1/NtjzJJ567aZxfKA==",
       "dev": true
     },
+    "node_modules/@types/uuid": {
+      "version": "9.0.8",
+      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-9.0.8.tgz",
+      "integrity": "sha512-jg+97EGIcY9AGHJJRaaPVgetKDsrTgbRjQ5Msgjh/DQKEFl0DtyRr/VCOyD1T2R1MNeWPK/u7JoGhlDZnKBAfA==",
+      "dev": true
+    },
     "node_modules/@vitejs/plugin-vue": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.2.3.tgz",
@@ -1774,9 +1782,9 @@
       }
     },
     "node_modules/rollup": {
-      "version": "3.26.3",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.26.3.tgz",
-      "integrity": "sha512-7Tin0C8l86TkpcMtXvQu6saWH93nhG3dGQ1/+l5V2TDMceTxO7kDiK6GzbfLWNNxqJXm591PcEZUozZm51ogwQ==",
+      "version": "3.29.4",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.29.4.tgz",
+      "integrity": "sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==",
       "dev": true,
       "bin": {
         "rollup": "dist/bin/rollup"
@@ -1999,15 +2007,27 @@
       "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
       "dev": true
     },
+    "node_modules/uuid": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz",
+      "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/vite": {
-      "version": "4.4.7",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-4.4.7.tgz",
-      "integrity": "sha512-6pYf9QJ1mHylfVh39HpuSfMPojPSKVxZvnclX1K1FyZ1PXDOcLBibdq5t1qxJSnL63ca8Wf4zts6mD8u8oc9Fw==",
+      "version": "4.5.3",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.3.tgz",
+      "integrity": "sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==",
       "dev": true,
       "dependencies": {
         "esbuild": "^0.18.10",
-        "postcss": "^8.4.26",
-        "rollup": "^3.25.2"
+        "postcss": "^8.4.27",
+        "rollup": "^3.27.1"
       },
       "bin": {
         "vite": "bin/vite.js"
@@ -2396,6 +2416,12 @@
       "integrity": "sha512-eC4U9MlIcu2q0KQmXszyn5Akca/0jrQmwDRgpAMJai7qBWq4amIQhZyNau4VYGtCeALvW1/NtjzJJ567aZxfKA==",
       "dev": true
     },
+    "@types/uuid": {
+      "version": "9.0.8",
+      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-9.0.8.tgz",
+      "integrity": "sha512-jg+97EGIcY9AGHJJRaaPVgetKDsrTgbRjQ5Msgjh/DQKEFl0DtyRr/VCOyD1T2R1MNeWPK/u7JoGhlDZnKBAfA==",
+      "dev": true
+    },
     "@vitejs/plugin-vue": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.2.3.tgz",
@@ -3277,9 +3303,9 @@
       "dev": true
     },
     "rollup": {
-      "version": "3.26.3",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.26.3.tgz",
-      "integrity": "sha512-7Tin0C8l86TkpcMtXvQu6saWH93nhG3dGQ1/+l5V2TDMceTxO7kDiK6GzbfLWNNxqJXm591PcEZUozZm51ogwQ==",
+      "version": "3.29.4",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.29.4.tgz",
+      "integrity": "sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==",
       "dev": true,
       "requires": {
         "fsevents": "~2.3.2"
@@ -3419,16 +3445,21 @@
       "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
       "dev": true
     },
+    "uuid": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz",
+      "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA=="
+    },
     "vite": {
-      "version": "4.4.7",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-4.4.7.tgz",
-      "integrity": "sha512-6pYf9QJ1mHylfVh39HpuSfMPojPSKVxZvnclX1K1FyZ1PXDOcLBibdq5t1qxJSnL63ca8Wf4zts6mD8u8oc9Fw==",
+      "version": "4.5.3",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.3.tgz",
+      "integrity": "sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==",
       "dev": true,
       "requires": {
         "esbuild": "^0.18.10",
         "fsevents": "~2.3.2",
-        "postcss": "^8.4.26",
-        "rollup": "^3.25.2"
+        "postcss": "^8.4.27",
+        "rollup": "^3.27.1"
       }
     },
     "vue": {
diff --git a/package.json b/package.json
index 529c499..972abb5 100644
--- a/package.json
+++ b/package.json
@@ -16,12 +16,14 @@
     "chartjs-plugin-zoom": "^2.0.1",
     "markdown-it": "^13.0.1",
     "pinia": "^2.1.7",
+    "uuid": "^9.0.1",
     "vue": "^3.4.5",
     "vue-chartjs": "^5.3.0",
     "yaml": "^2.3.1"
   },
   "devDependencies": {
     "@types/markdown-it": "^12.2.3",
+    "@types/uuid": "^9.0.8",
     "@vitejs/plugin-vue": "^4.2.3",
     "autoprefixer": "^10.4.14",
     "postcss": "^8.4.27",
diff --git a/src/pages/wizard/players.vue b/src/pages/wizard/players.vue
index 578f39a..d2fbadf 100644
--- a/src/pages/wizard/players.vue
+++ b/src/pages/wizard/players.vue
@@ -86,16 +86,14 @@
 </template>
 
 <script setup lang="ts">
-import { computed, ref } from "vue";
+import { ref } from "vue";
 import { useScoreStore } from "./store.ts";
 import toggleSwitch from "../../components/toggleswitch.vue";
 import container from "../../components/container.vue";
 import defineSteps from "./definesteps.vue";
 
 const store = useScoreStore();
-const isGameStarted = computed(() => {
-  return store.isGameStarted;
-});
+
 const showStepsSetup = ref(false);
 
 const deleteU = (userId: number) => {
diff --git a/src/pages/wizard/score.vue b/src/pages/wizard/score.vue
index 23c393a..abfd973 100644
--- a/src/pages/wizard/score.vue
+++ b/src/pages/wizard/score.vue
@@ -31,18 +31,18 @@
     <div
       v-for="(user, userId) in scoreStore.getUsers"
       :key="userId"
-      @click="activeUser = user.name"
+      @click="activeUser = user.userId"
     >
       <editscore
         :lastScore="scoreStore.getScore(userId)"
         :roundScore="scoreStore.userList[userId].currentRound"
         :betScore="scoreStore.userList[userId].currentBet"
         :steps="betOrRoundPhase ? scoreStore.betSteps : scoreStore.scoreSteps"
-        :editable="activeUser == user.name"
+        :editable="activeUser == user.userId"
         :phase="betOrRoundPhase ? 'bet' : 'round'"
         @changeScore="(event) => scoreStore.editCurrentRound(userId, event)"
         @changeBet="(event) => scoreStore.editCurrentBet(userId, event)"
-        :activePlayer="activeUser == user.name"
+        :activePlayer="activeUser == user.userId"
       >
         {{ user.name }}
       </editscore>
diff --git a/src/pages/wizard/store.ts b/src/pages/wizard/store.ts
index 1417e96..6c93ea4 100644
--- a/src/pages/wizard/store.ts
+++ b/src/pages/wizard/store.ts
@@ -1,4 +1,6 @@
 import { defineStore } from 'pinia'
+import { v4 as uuidv4 } from "uuid"
+
 const SETTINGS_LOCAL_STORAGE_KEY = 'score'
 interface State {
     userList: UserInfo[]
@@ -8,7 +10,7 @@ interface State {
 }
 
 export type UserInfo = {
-    userId: number
+    userId: string
     name: string
     scorePerRound: number[]
     betPerRound: number[]
@@ -16,8 +18,12 @@ export type UserInfo = {
     currentBet: number
 }
 const DefaultSettings = () => {
+    const newUUID = uuidv4()
     return {
-        userList: [{ userId: 0, name: 'player1', scorePerRound: [], betPerRound: [], currentRound: 0, currentBet: 0 }],
+        userList: [{
+            userId: newUUID
+            , name: createPlayerName(newUUID), scorePerRound: [], betPerRound: [], currentRound: 0, currentBet: 0
+        }],
         trackBets: false,
         scoreSteps: [1, 5, 10],
         betSteps: [1, 2, 5, 10],
@@ -31,6 +37,11 @@ const getSettings = () => {
 
     return settings ? JSON.parse(settings) : DefaultSettings()
 }
+
+const createPlayerName = (uuidString: string): string => {
+    return `player-${uuidString.split('-')[0]}`
+
+}
 export const useScoreStore = defineStore('scores', {
     state: (): State => { return getSettings() }
     ,
@@ -68,8 +79,9 @@ export const useScoreStore = defineStore('scores', {
     actions: {
 
         addUser() {
-            const username = `player${this.userList.length + 1}`
-            this.userList.push({ userId: this.userList.length + 1, name: username, betPerRound: [], scorePerRound: [], currentBet: 0, currentRound: 0 })
+            const newUUID = uuidv4()
+            const username = createPlayerName(newUUID)
+            this.userList.push({ userId: newUUID, name: username, betPerRound: [], scorePerRound: [], currentBet: 0, currentRound: 0 })
         },
         deleteUser(userId: number) {
             console.log(userId + 'delete')