feat : guess word

components/conceptHeader.vue

@@ -7,8 +7,12 @@ const userStore = useUserStore();
 const lobbyStore = useLobbyStore();
 
 const currentGames = computed(() => {
+  const self = userStore.self;
+  if (!self) {
+    return [];
+  }
   const games = Object.values(lobbyStore.games).filter((g) =>
-    g.players.some((p) => p.user.id == userStore.self?.id)
+    g.players.some((p) => p.userId == self.id)
   );
   return games;
 });

components/lobby/game.vue

@@ -17,7 +17,12 @@ const game = lobbyStore.games[props.id];
 
 <template>
   {{ game.id }}
-  {{ game.players.map((p) => p.user.username) }}
+  <User
+    v-for="player in game.players"
+    :key="player.id"
+    :id="player.userId"
+  ></User>
+  {{ game.started }}
   {{ game }}
 
   <NuxtLink :to="'/game/' + id"

components/word.vue

@@ -14,6 +14,8 @@ const userStore = useUserStore();
 
 const word = wordStore.words[props.id];
 
+const disabled = computed(() => word.loading || !userStore.self);
+
 async function changeWordState() {
   if (word.loading) {
     return;
@@ -38,6 +40,11 @@ async function deleteWord() {
     word.loading = false;
   }
 }
+onMounted(() => {
+  setInterval(() => {
+    console.log(disabled.value);
+  }, 1000);
+});
 </script>
 
 <template>
@@ -46,11 +53,11 @@ async function deleteWord() {
     <input
       type="checkbox"
       :checked="word.enabled"
-      :disabled="word.loading || !userStore.self"
+      :disabled="disabled"
       @click.prevent="changeWordState"
     />
     <input
-      :disabled="word.loading || !userStore.self"
+      :disabled="disabled"
       type="button"
       @click="deleteWord"
       value="Delete"