Reload page on click on ResultDialog

components/ResultDialog.vue

@@ -1,20 +1,22 @@
 <script setup lang="ts">
+import type { Player } from '~/netcode/Player';
+
 
 export interface Props {
-    isVisible: Boolean;
-    won: Boolean;
-    players: Array<Player>;
+  isVisible: Boolean;
+  won: Boolean;
+  players: Array<Player>;
 }
 
 const props = withDefaults(defineProps<Props>(), {
-    won: false,
-    players: []
+  won: () => false,
+  players: () => []
 })
 
 const emit = defineEmits(['close'])
 
 const close = () => {
-    emit('close')
+  reloadNuxtApp()
 }
 
 </script>
@@ -23,22 +25,27 @@ const close = () => {
   <div v-if="isVisible" class="dialog-overlay" @click="close">
     <div class="dialog-box">
       <div class="dialog-header">
-          <h3 v-if="won">Victoire!</h3>
-          <h3 v-else>Défaite!</h3>
+        <h3 v-if="won">Victoire!</h3>
+        <h3 v-else>Défaite!</h3>
       </div>
       <div class="dialog-body">
-            <PlayerIcon :player="players[0]"></PlayerIcon>
-            <p v-if="won">
-                Vous avez gagné!
-            </p>
-            <p v-else>
-                Vous avez perdu face à ce magnifique individu qui a très clairement beaucoup plus de bitches que vous! Cela dit, je pense qu'il n'y a pas de bonnes
-                ou de mauvaises situations, juste des situations différentes. Vous avez perdu, mais vous avez gagné en expérience! C'est ça le plus important
-                dans la vie, n'est-ce pas? Apprendre de ses erreurs et devenir meilleur! Alors, ne soyez pas triste, soyez heureux d'avoir eu l'opportunité
-                d'apprendre quelque chose aujourd'hui! Et puis, vous savez ce qu'on dit, "ce qui ne nous tue pas nous rend plus fort"! Alors, allez-y, soyez fort!
-                Et n'oubliez pas, la prochaine fois, vous gagnerez! Vous verrez! Vous êtes un gagnant, vous êtes un champion! Vous êtes le meilleur! Vous êtes
-                le roi du monde!
-            </p>
+        <PlayerIcon :player="players[0]"></PlayerIcon>
+        <p v-if="won">
+          Vous avez gagné!
+        </p>
+        <p v-else>
+          Vous avez perdu face à ce magnifique individu qui a très clairement beaucoup plus de bitches que vous! Cela
+          dit, je pense qu'il n'y a pas de bonnes
+          ou de mauvaises situations, juste des situations différentes. Vous avez perdu, mais vous avez gagné en
+          expérience! C'est ça le plus important
+          dans la vie, n'est-ce pas? Apprendre de ses erreurs et devenir meilleur! Alors, ne soyez pas triste, soyez
+          heureux d'avoir eu l'opportunité
+          d'apprendre quelque chose aujourd'hui! Et puis, vous savez ce qu'on dit, "ce qui ne nous tue pas nous rend
+          plus fort"! Alors, allez-y, soyez fort!
+          Et n'oubliez pas, la prochaine fois, vous gagnerez! Vous verrez! Vous êtes un gagnant, vous êtes un champion!
+          Vous êtes le meilleur! Vous êtes
+          le roi du monde!
+        </p>
       </div>
     </div>
   </div>
@@ -59,31 +66,32 @@ const close = () => {
 }
 
 .dialog-box {
-    background-image: url('../images/bg-grass.png');
-    padding: 0 20px;
-    border-radius: 5px;
-    width: 800px;
-    border-radius: 30px;
-    max-width: 100%;
-    color: white;
-    text-align: center;
-    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
-    display: flex;
-    justify-content: center;
-    flex-direction: column;
+  background-image: url('../images/bg-grass.png');
+  padding: 0 20px;
+  border-radius: 5px;
+  width: 800px;
+  border-radius: 30px;
+  max-width: 100%;
+  color: white;
+  text-align: center;
+  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
 }
 
 .dialog-box h3 {
-    font-size: 30px;
-    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-    margin: 0;
-    width: 100%;
-    padding: 10px 0;
-    color: white;
-    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
+  font-size: 30px;
+  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+  margin: 0;
+  width: 100%;
+  padding: 10px 0;
+  color: white;
+  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
 }
 
-.dialog-header, .dialog-footer {
+.dialog-header,
+.dialog-footer {
   display: flex;
   justify-content: space-between;
   align-items: center;