@buoy-gg/events 2.1.9 → 2.1.12

package/src/utils/autoDiscoverEventSources.ts

@@ -596,6 +596,167 @@ function transformRouteEvent(event: unknown): UnifiedEvent {
   };
 }
 
+// ============================================================================
+// Zustand Event Source Discovery
+// ============================================================================
+
+function tryLoadZustandSource(): DiscoveredEventSource | null {
+  try {
+    // @ts-ignore - Dynamic import that may not exist
+    const { zustandStateStore } = require("@buoy-gg/zustand");
+
+    let lastChangeId: string | null = null;
+
+    return {
+      id: "zustand",
+      name: "Zustand",
+      eventSources: ["zustand"],
+      available: true,
+      subscribe: (onEvent) => {
+        return zustandStateStore.subscribe((changes: unknown[]) => {
+          if (changes.length > 0) {
+            const latestChange = changes[0] as { id: string };
+            if (latestChange.id !== lastChangeId) {
+              lastChangeId = latestChange.id;
+              const unifiedEvent = transformZustandChange(latestChange);
+              onEvent(unifiedEvent);
+            }
+          }
+        });
+      },
+    };
+  } catch {
+    return null;
+  }
+}
+
+function transformZustandChange(change: unknown): UnifiedEvent {
+  const c = change as {
+    id: string;
+    storeName: string;
+    timestamp: number;
+    hasStateChange?: boolean;
+    category?: "setState" | "replace";
+    changedKeys?: string[];
+    changedKeysCount?: number;
+    diffSummary?: string;
+    partialPreview?: string;
+    duration?: number;
+    isSlowUpdate?: boolean;
+  };
+
+  // Get status
+  let status: "success" | "error" | "pending" | "neutral" = "neutral";
+  if (c.isSlowUpdate) {
+    status = "pending"; // Yellow for slow updates
+  } else if (c.hasStateChange) {
+    status = "success";
+  }
+
+  // Get subtitle
+  const parts: string[] = [];
+  if (c.changedKeys && c.changedKeys.length > 0) {
+    const keys = c.changedKeys.slice(0, 3).join(", ");
+    const more = c.changedKeys.length > 3 ? ` +${c.changedKeys.length - 3}` : "";
+    parts.push(`${keys}${more}`);
+  } else if (c.diffSummary) {
+    parts.push(c.diffSummary);
+  }
+  if (c.duration !== undefined) {
+    parts.push(`${c.duration.toFixed(1)}ms`);
+  }
+  if (c.category === "replace") {
+    parts.push("replace");
+  }
+
+  return {
+    id: generateEventId("zustand"),
+    source: "zustand",
+    timestamp: c.timestamp,
+    title: c.storeName,
+    subtitle: parts.join(" · ") || (c.hasStateChange ? "state changed" : "no change"),
+    status,
+    originalEvent: change,
+  };
+}
+
+// ============================================================================
+// Jotai Event Source Discovery
+// ============================================================================
+
+function tryLoadJotaiSource(): DiscoveredEventSource | null {
+  try {
+    // @ts-ignore - Dynamic import that may not exist
+    const { jotaiStateStore } = require("@buoy-gg/jotai");
+
+    let lastChangeId: string | null = null;
+
+    return {
+      id: "jotai",
+      name: "Jotai",
+      eventSources: ["jotai"],
+      available: true,
+      subscribe: (onEvent) => {
+        return jotaiStateStore.subscribe((changes: unknown[]) => {
+          if (changes.length > 0) {
+            const latestChange = changes[0] as { id: string };
+            if (latestChange.id !== lastChangeId) {
+              lastChangeId = latestChange.id;
+              const unifiedEvent = transformJotaiChange(latestChange);
+              onEvent(unifiedEvent);
+            }
+          }
+        });
+      },
+    };
+  } catch {
+    return null;
+  }
+}
+
+function transformJotaiChange(change: unknown): UnifiedEvent {
+  const c = change as {
+    id: string;
+    atomLabel: string;
+    timestamp: number;
+    hasValueChange?: boolean;
+    category?: "write" | "read";
+    changedKeys?: string[];
+    changedKeysCount?: number;
+    diffSummary?: string;
+    valuePreview?: string;
+  };
+
+  // Get status
+  let status: "success" | "error" | "pending" | "neutral" = "neutral";
+  if (c.category === "write" && c.hasValueChange) {
+    status = "success";
+  } else if (c.category === "read") {
+    status = "neutral";
+  }
+
+  // Get subtitle
+  const parts: string[] = [];
+  if (c.valuePreview) {
+    parts.push(c.valuePreview);
+  } else if (c.diffSummary) {
+    parts.push(c.diffSummary);
+  }
+  if (c.category) {
+    parts.push(c.category);
+  }
+
+  return {
+    id: generateEventId("jotai"),
+    source: "jotai",
+    timestamp: c.timestamp,
+    title: c.atomLabel,
+    subtitle: parts.join(" · ") || (c.hasValueChange ? "value changed" : "no change"),
+    status,
+    originalEvent: change,
+  };
+}
+
 // ============================================================================
 // Render Events Source Discovery (Highlight Updates)
 // ============================================================================
@@ -776,6 +937,8 @@ export function autoDiscoverEventSources(): DiscoveryResult {
     tryLoadNetworkSource,
     tryLoadReactQuerySource,
     tryLoadRouteEventsSource,
+    tryLoadZustandSource,
+    tryLoadJotaiSource,
     tryLoadHighlightUpdatesSource,
   ];
 
@@ -808,6 +971,8 @@ export function getSourceDisplayConfig(source: EventSource): {
     "react-query-query": { label: "Query", color: "#EC4899", icon: "sync-outline" },
     "react-query-mutation": { label: "Mutation", color: "#F97316", icon: "flash-outline" },
     route: { label: "Route", color: "#06B6D4", icon: "navigate-outline" },
+    zustand: { label: "Zustand", color: "#764ABC", icon: "cube-outline" },
+    jotai: { label: "Jotai", color: "#14B8A6", icon: "ellipse-outline" },
     render: { label: "Render", color: "#F472B6", icon: "layers-outline" },
   };
 

package/src/utils/eventExportFormatter.ts

@@ -53,6 +53,8 @@ const SOURCE_LABELS: Record<EventSource, string> = {
   "react-query-query": "Query",
   "react-query-mutation": "Mutation",
   route: "Route",
+  zustand: "Zustand",
+  jotai: "Jotai",
   render: "Render",
 };