feat: make hints a group in one stage

app/src/components/HintPart.vue

@@ -60,9 +60,15 @@ const right = () => {
     </div>
   </div>
   <div id="hint" class="bg-bg flex flex-wrap p-8">
-    <p class="text-text font-xl whitespace-pre-wrap">
-      {{ sessionStore.session.hints[current] }}
-    </p>
+    <ul>
+      <li
+        v-for="hint in sessionStore.session.hints[current]"
+        :key="hint"
+        class="text-text font-xl whitespace-pre-wrap"
+      >
+        ➤ {{ hint }}
+      </li>
+    </ul>
     <br />
   </div>
 </template>

app/src/store/session.js

@@ -86,7 +86,7 @@ function updateGraph(event) {
 }
 
 function updateHints(hints) {
-  store.session.hints.push(...hints)
+  store.session.hints.push(hints)
 }
 
 function updateStatus(status) {

packages/models/session.js

@@ -54,7 +54,7 @@ const Session = model(
         required: true,
       },
       tasks: [taskSchema],
-      hints: [String],
+      hints: [[String]],
       graph: {
         type: nodeSchema,
         default: {

server/src/game/sessionHandler.js

@@ -47,7 +47,7 @@ export default class SessionHandler {
         t.completed = true
       })
 
-    this.session.hints.push(...stage.hints)
+    this.session.hints.push(stage.hints)
 
     this.addNewTasks()