fix: reset seenFlows after reset endpoint is called

workspaces/e2e/tests/cloud/cloud.html

@@ -13,7 +13,7 @@
     ></div>
 
     <button class="reset-all">Reset all</button>
-    <button class="reset-my-flow">Reset my-flow</button>
+    <button class="reset-valid-flow">Reset valid-flow</button>
 
     <script type="module" src="./cloud.ts"></script>
   </body>

workspaces/e2e/tests/cloud/cloud.spec.ts

@@ -46,6 +46,18 @@ test("Should call reset all flows endpoint", async ({ page }) => {
   await page.click(".reset-all");
   await reqPromise;
 });
+test("Should show flow again after reset all", async ({ page }) => {
+  await page.route("**/sdk/flows?projectId=my-proj**", (route) =>
+    route.fulfill({ json: { results: [validFlow] } }),
+  );
+  await page.goto("/cloud/cloud.html");
+  await expect(page.locator(".flows-tooltip")).toBeVisible();
+  await page.click(".flows-cancel");
+  await expect(page.locator(".flows-tooltip")).toBeHidden();
+  await page.route("**/sdk/user/**", (route) => route.fulfill());
+  await page.click(".reset-all");
+  await expect(page.locator(".flows-tooltip")).toBeVisible();
+});
 
 test("Should call reset flow endpoint", async ({ page }) => {
   await page.route("**/sdk/flows?projectId=my-proj**", (route) =>
@@ -57,10 +69,22 @@ test("Should call reset flow endpoint", async ({ page }) => {
     console.log(url);
     return (
       url.includes(`/sdk/user/${hashedUserId}/progress`) &&
-      url.includes("flowId=my-flow") &&
+      url.includes("flowId=valid-flow") &&
       url.includes("projectId=my-proj")
     );
   });
-  await page.click(".reset-my-flow");
+  await page.click(".reset-valid-flow");
   await reqPromise;
 });
+test("Should show flow again after reset", async ({ page }) => {
+  await page.route("**/sdk/flows?projectId=my-proj**", (route) =>
+    route.fulfill({ json: { results: [validFlow] } }),
+  );
+  await page.goto("/cloud/cloud.html");
+  await expect(page.locator(".flows-tooltip")).toBeVisible();
+  await page.click(".flows-cancel");
+  await expect(page.locator(".flows-tooltip")).toBeHidden();
+  await page.route("**/sdk/user/**", (route) => route.fulfill());
+  await page.click(".reset-valid-flow");
+  await expect(page.locator(".flows-tooltip")).toBeVisible();
+});

workspaces/e2e/tests/cloud/cloud.ts

@@ -19,6 +19,6 @@ document.querySelector(".reset-all")?.addEventListener("click", () => {
   resetAllFlows();
 });
 
-document.querySelector(".reset-my-flow")?.addEventListener("click", () => {
-  resetFlow("my-flow");
+document.querySelector(".reset-valid-flow")?.addEventListener("click", () => {
+  resetFlow("valid-flow");
 });

workspaces/e2e/tests/cloud/flow-mocks.ts

@@ -1,7 +1,7 @@
 import { Flow } from "@flows/js";
 
 export const validFlow: Flow = {
-  id: "valid-local-flow",
+  id: "valid-flow",
   start: { location: "/" },
   steps: [
     {
@@ -12,7 +12,7 @@ export const validFlow: Flow = {
 };
 
 export const invalidFlow: Flow = {
-  id: "invalid-local-flow",
+  id: "invalid-flow",
   start: { location: "/" },
   steps: [
     {

workspaces/js/src/cloud/public-methods.ts

@@ -40,6 +40,7 @@ export async function resetAllFlows(): Promise<void> {
     projectId,
     userHash,
   });
+  FlowsContext.getInstance().resetAllFlowsSeen();
   // Reinitialize Flows to load flows that have been reset
   const options = FlowsCloudContext.getInstance().options;
   if (!options) return;
@@ -68,6 +69,7 @@ export async function resetFlow(flowId: string): Promise<void> {
     userHash,
     flowId,
   });
+  FlowsContext.getInstance().resetFlowSeen(flowId);
   // Reinitialize Flows to load flows that have been reset
   const options = FlowsCloudContext.getInstance().options;
   if (!options) return;

workspaces/js/src/core/flows-context.ts

@@ -174,4 +174,16 @@ export class FlowsContext {
     this.onSeenFlowsChange?.([...this.seenFlows]);
     return this;
   }
+  resetFlowSeen(flowId: string): this {
+    this.seenFlows = this.seenFlows.filter((seenFlow) => seenFlow.flowId !== flowId);
+    this.savePersistentState();
+    this.onSeenFlowsChange?.([...this.seenFlows]);
+    return this;
+  }
+  resetAllFlowsSeen(): this {
+    this.seenFlows = [];
+    this.savePersistentState();
+    this.onSeenFlowsChange?.([...this.seenFlows]);
+    return this;
+  }
 }