@learnpack/learnpack 5.0.355 → 5.0.357

package/src/creator/src/utils/useCompletionWatchdog.test.ts

@@ -0,0 +1,99 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useCompletionWatchdog } from "./useCompletionWatchdog";
+
+const TIMEOUT = 1000;
+
+describe("useCompletionWatchdog", () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it("fires once the wait exceeds the timeout", () => {
+    const onTimeout = vi.fn();
+    renderHook(() => useCompletionWatchdog("abc123", onTimeout, TIMEOUT));
+
+    expect(onTimeout).not.toHaveBeenCalled();
+    vi.advanceTimersByTime(TIMEOUT);
+    expect(onTimeout).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not fire more than once", () => {
+    const onTimeout = vi.fn();
+    renderHook(() => useCompletionWatchdog("abc123", onTimeout, TIMEOUT));
+
+    vi.advanceTimersByTime(TIMEOUT * 5);
+    expect(onTimeout).toHaveBeenCalledTimes(1);
+  });
+
+  it("stays idle while there is no notification to wait for", () => {
+    const onTimeout = vi.fn();
+    renderHook(() => useCompletionWatchdog("", onTimeout, TIMEOUT));
+
+    vi.advanceTimersByTime(TIMEOUT * 5);
+    expect(onTimeout).not.toHaveBeenCalled();
+  });
+
+  it("cancels when the notification resolves and the id is cleared", () => {
+    const onTimeout = vi.fn();
+    const { rerender } = renderHook(
+      ({ id }) => useCompletionWatchdog(id, onTimeout, TIMEOUT),
+      { initialProps: { id: "abc123" } }
+    );
+
+    vi.advanceTimersByTime(TIMEOUT / 2);
+    rerender({ id: "" });
+    vi.advanceTimersByTime(TIMEOUT * 5);
+
+    expect(onTimeout).not.toHaveBeenCalled();
+  });
+
+  it("cancels on unmount", () => {
+    const onTimeout = vi.fn();
+    const { unmount } = renderHook(() =>
+      useCompletionWatchdog("abc123", onTimeout, TIMEOUT)
+    );
+
+    unmount();
+    vi.advanceTimersByTime(TIMEOUT * 5);
+
+    expect(onTimeout).not.toHaveBeenCalled();
+  });
+
+  it("restarts the countdown for a new notification", () => {
+    const onTimeout = vi.fn();
+    const { rerender } = renderHook(
+      ({ id }) => useCompletionWatchdog(id, onTimeout, TIMEOUT),
+      { initialProps: { id: "first" } }
+    );
+
+    vi.advanceTimersByTime(TIMEOUT * 0.9);
+    rerender({ id: "second" });
+    vi.advanceTimersByTime(TIMEOUT * 0.9);
+
+    expect(onTimeout).not.toHaveBeenCalled();
+
+    vi.advanceTimersByTime(TIMEOUT * 0.2);
+    expect(onTimeout).toHaveBeenCalledTimes(1);
+  });
+
+  it("calls the latest callback, so an inline closure does not reset the timer", () => {
+    const first = vi.fn();
+    const second = vi.fn();
+    const { rerender } = renderHook(
+      ({ cb }) => useCompletionWatchdog("abc123", cb, TIMEOUT),
+      { initialProps: { cb: first } }
+    );
+
+    vi.advanceTimersByTime(TIMEOUT * 0.9);
+    rerender({ cb: second });
+    vi.advanceTimersByTime(TIMEOUT * 0.2);
+
+    expect(first).not.toHaveBeenCalled();
+    expect(second).toHaveBeenCalledTimes(1);
+  });
+});

package/src/creator/src/utils/useCompletionWatchdog.ts

@@ -0,0 +1,37 @@
+import { useEffect, useRef } from "react";
+import { COMPLETION_TIMEOUT_MS } from "./constants";
+
+/**
+ * Gives up waiting for a completion notification that never arrives.
+ *
+ * The socket is the only thing that ends the loading state, so anything that
+ * stops the notification from reaching us — a dropped connection, a webhook
+ * Rigobot never sent, a relay that gave up retrying — used to leave the UI
+ * spinning with no way out. This puts a ceiling on the wait.
+ *
+ * The callback is held in a ref so that passing an inline closure, which every
+ * caller does, does not restart the timer on each render.
+ * @param notificationId - The notification being waited on; empty means idle.
+ * @param onTimeout - Called once if the wait exceeds `timeoutMs`.
+ * @param timeoutMs - How long to wait before giving up.
+ */
+export function useCompletionWatchdog(
+  notificationId: string,
+  onTimeout: () => void,
+  timeoutMs: number = COMPLETION_TIMEOUT_MS
+) {
+  const onTimeoutRef = useRef(onTimeout);
+  onTimeoutRef.current = onTimeout;
+
+  useEffect(() => {
+    if (!notificationId) return;
+
+    const timer = setTimeout(() => {
+      onTimeoutRef.current();
+    }, timeoutMs);
+
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [notificationId, timeoutMs]);
+}

package/src/creator/vitest.config.ts

@@ -0,0 +1,16 @@
+import { defineConfig, mergeConfig } from "vitest/config";
+import viteConfig from "./vite.config";
+
+// Kept separate from vite.config.ts so the production build has no dependency on
+// vitest. Merging means the aliases and plugins the app already relies on apply
+// to tests too, with nothing restated here.
+export default mergeConfig(
+  viteConfig,
+  defineConfig({
+    test: {
+      // Needed by renderHook; the pure tests do not care either way.
+      environment: "jsdom",
+      include: ["src/**/*.test.ts", "src/**/*.test.tsx"],
+    },
+  })
+);