fx up amanagerdebug

beefchimi · Jan 22, 2024 · 372836e · 372836e
1 parent 4228b0d
commit 372836e
Showing 1 changed file with 20 additions and 8 deletions.
diff --git a/app/website/src/sections/ManagerDebug.vue b/app/website/src/sections/ManagerDebug.vue
@@ -2,7 +2,7 @@
 import {useDebugManager} from '@/store';
 import {StackLabel} from '@/components';
 
-const {activeStacks, stateHistory, errorHistory, unlocked, playing} =
+const {activeStacks, stateHistory, errorHistory, unlockHistory, playHistory} =
   useDebugManager();
 </script>
 
@@ -22,7 +22,11 @@ const {activeStacks, stateHistory, errorHistory, unlocked, playing} =
       <StackLabel label="State" populated />
 
       <ul class="DebugList collapsed-border-row--reverse pattern-halftone">
-        <li v-for="state in stateHistory" :key="state" class="DebugItem">
+        <li
+          v-for="(state, index) in stateHistory"
+          :key="`${state}-${index}`"
+          class="DebugItem"
+        >
           <StackLabel :label="state" />
         </li>
       </ul>
@@ -33,8 +37,8 @@ const {activeStacks, stateHistory, errorHistory, unlocked, playing} =
 
       <ul class="DebugList collapsed-border-row--reverse pattern-halftone">
         <li
-          v-for="error in errorHistory"
-          :key="error.join(' | ')"
+          v-for="(error, index) in errorHistory"
+          :key="[...error, index].join(' | ')"
           class="DebugItem"
         >
           <StackLabel :label="error.join(' | ')" />
@@ -48,8 +52,12 @@ const {activeStacks, stateHistory, errorHistory, unlocked, playing} =
       <ul
         class="DebugList collapsed-border-row--reverse pattern-halftone--reverse pattern-halftone"
       >
-        <li class="DebugItem">
-          <StackLabel :label="unlocked.toString()" />
+        <li
+          v-for="(status, index) in unlockHistory"
+          :key="`Unlocked-${status}-${index}`"
+          class="DebugItem"
+        >
+          <StackLabel :label="status.toString()" />
         </li>
       </ul>
     </div>
@@ -58,8 +66,12 @@ const {activeStacks, stateHistory, errorHistory, unlocked, playing} =
       <StackLabel label="Playing" populated />
 
       <ul class="DebugList collapsed-border-row--reverse pattern-halftone">
-        <li class="DebugItem">
-          <StackLabel :label="playing.toString()" />
+        <li
+          v-for="(status, index) in playHistory"
+          :key="`Playing-${status}-${index}`"
+          class="DebugItem"
+        >
+          <StackLabel :label="status.toString()" />
         </li>
       </ul>
     </div>