fix: merge variables on subsequent calls

FrigadeHQ · Oct 9, 2024 · 51b6444 · 51b6444
1 parent 3022788
commit 51b6444
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 14 deletions.
diff --git a/.changeset/ninety-rivers-dress.md b/.changeset/ninety-rivers-dress.md
@@ -0,0 +1,6 @@
+---
+"@frigade/js": patch
+"@frigade/react": patch
+---
+
+Fixes an issue where variables are sometimes not applied when using useFlow() with the same Flow ID in a component
diff --git a/packages/js-api/src/core/flow.ts b/packages/js-api/src/core/flow.ts
@@ -144,6 +144,8 @@ export class Flow extends Fetchable {
 
     if (this.getGlobalState().variables[this.id]) {
       this.applyVariablesInternal(this.getGlobalState().variables[this.id] ?? {})
+    } else {
+      this.applyVariablesInternal({})
     }
   }
 
@@ -167,9 +169,6 @@ export class Flow extends Fetchable {
    */
   private init() {
     const statefulFlow = this.getStatefulFlow()
-
-    this.resyncState()
-
     const newSteps = new Map<string, FlowStep>()
 
     statefulFlow.data.steps.forEach((step, index) => {
@@ -339,16 +338,8 @@ export class Flow extends Fetchable {
       newSteps.set(step.id, stepObj as FlowStep)
     })
     this.steps = newSteps
-    // Check if empty object
-    if (
-      this.getGlobalState().variables &&
-      this.getGlobalState().variables[this.id] &&
-      Object.keys(this.getGlobalState().variables[this.id]).length > 0
-    ) {
-      this.applyVariablesInternal(this.getGlobalState().variables[this.id])
-    } else {
-      this.applyVariablesInternal({})
-    }
+
+    this.resyncState()
   }
 
   /**
@@ -595,7 +586,10 @@ export class Flow extends Fetchable {
       })
     }
 
-    this.getGlobalState().variables[this.id] = variables
+    this.getGlobalState().variables[this.id] = {
+      ...this.getGlobalState().variables[this.id],
+      ...variables,
+    }
 
     if (resyncState) {
       this.resyncState()

diff --git a/packages/react/src/hooks/useFlow.ts b/packages/react/src/hooks/useFlow.ts
@@ -61,6 +61,7 @@ export function useFlow(
       ...config?.variables,
     })
   }, [config?.variables, flowId, variables])
+
   return {
     flow,
     isLoading: frigade?.hasFailedToLoad() ? false : !flow,