@buoy-gg/events 2.1.1

package/src/utils/badgeSelectionStorage.ts

@@ -0,0 +1,51 @@
+/**
+ * Badge Selection Storage
+ *
+ * Utilities for persisting and restoring the enabled event source badges.
+ * Uses the same storage patterns as other packages (React Query, Network, etc.)
+ */
+
+import { persistentStorage, devToolsStorageKeys } from "@buoy-gg/shared-ui";
+import type { EventSource } from "../types";
+
+/**
+ * Save the enabled sources to persistent storage
+ */
+export async function saveEnabledSources(sources: EventSource[]): Promise<void> {
+  try {
+    const key = devToolsStorageKeys.events.enabledSources();
+    await persistentStorage.setItem(key, JSON.stringify(sources));
+  } catch {
+    // Silently fail - persistence is optional
+  }
+}
+
+/**
+ * Load the enabled sources from persistent storage
+ * Returns null if no saved state exists
+ */
+export async function loadEnabledSources(): Promise<EventSource[] | null> {
+  try {
+    const key = devToolsStorageKeys.events.enabledSources();
+    const value = await persistentStorage.getItem(key);
+    if (value && value !== "") {
+      return JSON.parse(value) as EventSource[];
+    }
+    return null;
+  } catch {
+    // Silently fail - return null to use defaults
+    return null;
+  }
+}
+
+/**
+ * Clear the saved enabled sources
+ */
+export async function clearEnabledSources(): Promise<void> {
+  try {
+    const key = devToolsStorageKeys.events.enabledSources();
+    await persistentStorage.removeItem(key);
+  } catch {
+    // Silently fail
+  }
+}

package/src/utils/copySettingsStorage.ts

@@ -0,0 +1,61 @@
+/**
+ * Copy Settings Storage
+ *
+ * Utilities for persisting and restoring the events copy/export settings.
+ * Uses the same storage patterns as other packages (React Query, Network, etc.)
+ */
+
+import { persistentStorage, devToolsStorageKeys } from "@buoy-gg/shared-ui";
+import type { EventsCopySettings } from "../types/copySettings";
+import { DEFAULT_COPY_SETTINGS } from "../types/copySettings";
+
+/**
+ * Save the copy settings to persistent storage
+ */
+export async function saveCopySettings(
+  settings: EventsCopySettings
+): Promise<void> {
+  try {
+    const key = devToolsStorageKeys.events.copySettings();
+    await persistentStorage.setItem(key, JSON.stringify(settings));
+  } catch {
+    // Silently fail - persistence is optional
+  }
+}
+
+/**
+ * Load the copy settings from persistent storage
+ * Returns null if no saved state exists
+ */
+export async function loadCopySettings(): Promise<EventsCopySettings | null> {
+  try {
+    const key = devToolsStorageKeys.events.copySettings();
+    const value = await persistentStorage.getItem(key);
+    if (value && value !== "") {
+      const parsed = JSON.parse(value) as Partial<EventsCopySettings>;
+      // Merge with defaults to handle new fields added in updates
+      return {
+        ...DEFAULT_COPY_SETTINGS,
+        ...parsed,
+        // Ensure filterSources is always an array
+        filterSources: parsed.filterSources ?? DEFAULT_COPY_SETTINGS.filterSources,
+      };
+    }
+    return null;
+  } catch {
+    // Silently fail - return null to use defaults
+    return null;
+  }
+}
+
+/**
+ * Clear the saved copy settings
+ */
+export async function clearCopySettings(): Promise<void> {
+  try {
+    const key = devToolsStorageKeys.events.copySettings();
+    await persistentStorage.removeItem(key);
+  } catch {
+    // Silently fail
+  }
+}

package/src/utils/correlationUtils.ts

@@ -0,0 +1,146 @@
+/**
+ * Correlation Utilities
+ *
+ * Functions for finding and grouping related events based on correlation IDs.
+ * Similar to Redux DevTools' async thunk linking feature.
+ */
+
+import type { UnifiedEvent } from "../types";
+
+/**
+ * Find all events related to the given event by correlation ID
+ */
+export function findRelatedEvents(
+  event: UnifiedEvent,
+  allEvents: UnifiedEvent[]
+): UnifiedEvent[] {
+  if (!event.correlationId) {
+    return [];
+  }
+
+  return allEvents
+    .filter(
+      (e) => e.correlationId === event.correlationId && e.id !== event.id
+    )
+    .sort((a, b) => a.timestamp - b.timestamp);
+}
+
+/**
+ * Check if an event has related events
+ */
+export function hasRelatedEvents(
+  event: UnifiedEvent,
+  allEvents: UnifiedEvent[]
+): boolean {
+  if (!event.correlationId) {
+    return false;
+  }
+
+  return allEvents.some(
+    (e) => e.correlationId === event.correlationId && e.id !== event.id
+  );
+}
+
+/**
+ * Get count of related events (including the current one)
+ */
+export function getRelatedEventsCount(
+  event: UnifiedEvent,
+  allEvents: UnifiedEvent[]
+): number {
+  if (!event.correlationId) {
+    return 1;
+  }
+
+  return allEvents.filter((e) => e.correlationId === event.correlationId).length;
+}
+
+/**
+ * Build a map of correlation ID -> count for efficient lookup
+ */
+export function buildCorrelationCountMap(
+  events: UnifiedEvent[]
+): Map<string, number> {
+  const countMap = new Map<string, number>();
+
+  for (const event of events) {
+    if (event.correlationId) {
+      const current = countMap.get(event.correlationId) || 0;
+      countMap.set(event.correlationId, current + 1);
+    }
+  }
+
+  return countMap;
+}
+
+/**
+ * Get all events in a correlation group, sorted by sequence
+ */
+export function getCorrelationGroup(
+  correlationId: string,
+  allEvents: UnifiedEvent[]
+): UnifiedEvent[] {
+  return allEvents
+    .filter((e) => e.correlationId === correlationId)
+    .sort((a, b) => {
+      // Sort by sequence first, then by timestamp
+      const seqA = a.sequenceInGroup ?? 0;
+      const seqB = b.sequenceInGroup ?? 0;
+      if (seqA !== seqB) {
+        return seqA - seqB;
+      }
+      return a.timestamp - b.timestamp;
+    });
+}
+
+/**
+ * Generate a display label for correlated events (e.g., "1/2" for first of two)
+ */
+export function getCorrelationLabel(
+  event: UnifiedEvent,
+  allEvents: UnifiedEvent[]
+): string | null {
+  if (!event.correlationId) {
+    return null;
+  }
+
+  const group = getCorrelationGroup(event.correlationId, allEvents);
+  if (group.length <= 1) {
+    return null;
+  }
+
+  const index = group.findIndex((e) => e.id === event.id);
+  if (index === -1) {
+    return null;
+  }
+
+  return `${index + 1}/${group.length}`;
+}
+
+/**
+ * Color palette for correlation groups (cycles through for different groups)
+ */
+const CORRELATION_COLORS = [
+  "#EC4899", // Pink (React Query default)
+  "#8B5CF6", // Purple
+  "#3B82F6", // Blue
+  "#10B981", // Green
+  "#F59E0B", // Orange
+  "#EF4444", // Red
+  "#06B6D4", // Cyan
+  "#84CC16", // Lime
+];
+
+/**
+ * Get a consistent color for a correlation group
+ */
+export function getCorrelationColor(correlationId: string): string {
+  // Use a simple hash to get a consistent color for each correlation ID
+  let hash = 0;
+  for (let i = 0; i < correlationId.length; i++) {
+    hash = (hash << 5) - hash + correlationId.charCodeAt(i);
+    hash |= 0; // Convert to 32bit integer
+  }
+  const index = Math.abs(hash) % CORRELATION_COLORS.length;
+  return CORRELATION_COLORS[index];
+}