fix: deep clone to refresh sologame state

things went haywire without a hard refresh because events, treatment params, etc. remained the same object reference
virtualcommons · Oct 18, 2024 · 2d7709f · 2d7709f
1 parent 2d46537
commit 2d7709f
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/client/src/views/ProlificStudy.vue b/client/src/views/ProlificStudy.vue
@@ -39,6 +39,7 @@
 <script lang="ts">
 import { Vue, Watch, Component, Inject, Provide } from "vue-property-decorator";
 import { Client } from "colyseus.js";
+import { cloneDeep } from "lodash";
 import { SoloGameRequestAPI } from "@port-of-mars/client/api/sologame/request";
 import { StudyAPI } from "@port-of-mars/client/api/study/request";
 import {
@@ -77,7 +78,7 @@ export default class ProlificStudy extends Vue {
   };
   statusLoading = true;
 
-  state: SoloGameClientState = { ...DEFAULT_STATE };
+  state: SoloGameClientState = cloneDeep(DEFAULT_STATE);
 
   get isGameOver() {
     return ["victory", "defeat"].includes(this.state.status);
@@ -102,7 +103,7 @@ export default class ProlificStudy extends Vue {
     await this.fetchProlificParticipantStatus();
     if (this.participantStatus.nextGameType) {
       this.started = false;
-      this.state = { ...DEFAULT_STATE };
+      Object.assign(this.state, cloneDeep(DEFAULT_STATE));
       this.api.reset();
     } else {
       const completionUrl = await this.studyApi.completeProlificStudy();

diff --git a/client/src/views/SoloGame.vue b/client/src/views/SoloGame.vue
@@ -17,6 +17,7 @@
 <script lang="ts">
 import { Vue, Component, Inject, Provide } from "vue-property-decorator";
 import { Client } from "colyseus.js";
+import { cloneDeep } from "lodash";
 import { SoloGameRequestAPI } from "@port-of-mars/client/api/sologame/request";
 import {
   DEFAULT_STATE,
@@ -41,15 +42,15 @@ export default class SoloGame extends Vue {
   hasApi = false;
   started = false;
 
-  state: SoloGameClientState = { ...DEFAULT_STATE };
+  state: SoloGameClientState = cloneDeep(DEFAULT_STATE);
 
   get isGameOver() {
     return ["victory", "defeat"].includes(this.state.status);
   }
 
   handleContinue() {
     this.started = false;
-    this.state = { ...DEFAULT_STATE };
+    Object.assign(this.state, cloneDeep(DEFAULT_STATE));
   }
 
   async begin() {