@amadeus-it-group/ngrx-devtool 0.1.3 → 0.2.0

package/ngrx-devtool/fesm2022/amadeus-it-group-ngrx-devtool.mjs

@@ -6,6 +6,8 @@ import { takeUntil, tap as tap$1 } from 'rxjs/operators';
 import { isPlatformBrowser } from '@angular/common';
 import { createSelector } from '@ngrx/store';
 
+const DEFAULT_WS_URL = 'ws://localhost:4000';
+
 const REPLAY_BUFFER_SIZE$1 = 100;
 const TIMELINE_MAX_SIZE = 1000;
 const TIMELINE_TRIM_SIZE = 500;
@@ -17,7 +19,7 @@ class EffectTrackerService {
     actionTimeline = [];
     effectTimeline = [];
     effectActionPatterns = new Set();
-    pendingCorrelations = new Map();
+    pendingCorrelations = [];
     correlationCounter = 0;
     lastTriggerAction = null;
     effectEvents$ = new ReplaySubject(REPLAY_BUFFER_SIZE$1);
@@ -80,8 +82,12 @@ class EffectTrackerService {
         if (!isEffect) {
             this.lastTriggerAction = action;
         }
+        // Resolve trigger action type to match the correct correlation.
+        const triggerActionType = isEffect
+            ? this.findTriggerActionType(action.type)
+            : undefined;
         const correlationId = isEffect
-            ? this.findCorrelation()
+            ? this.consumeCorrelation(triggerActionType)
             : this.createCorrelation(action);
         const effectName = this.findEffectNameForAction(action.type);
         const tracked = {
@@ -103,22 +109,48 @@ class EffectTrackerService {
     }
     clearTimeline() {
         this.actionTimeline = [];
-        this.pendingCorrelations.clear();
+        this.clearPendingCorrelations();
     }
     createCorrelation(action) {
         const correlationId = `corr_${++this.correlationCounter}_${Date.now()}`;
-        this.pendingCorrelations.set(correlationId, {
-            action,
+        const timeoutId = setTimeout(() => {
+            this.pendingCorrelations = this.pendingCorrelations.filter(c => c.correlationId !== correlationId);
+        }, CORRELATION_TIMEOUT_MS);
+        this.pendingCorrelations.push({
+            correlationId,
+            actionType: action.type,
             timestamp: Date.now(),
+            timeoutId,
         });
-        setTimeout(() => {
-            this.pendingCorrelations.delete(correlationId);
-        }, CORRELATION_TIMEOUT_MS);
         return correlationId;
     }
-    findCorrelation() {
-        const entries = Array.from(this.pendingCorrelations.entries());
-        return entries.length > 0 ? entries[entries.length - 1][0] : undefined;
+    // Find and consume the best-matching pending correlation (by trigger type, then FIFO fallback).
+    consumeCorrelation(triggerActionType) {
+        let idx = -1;
+        // Prefer matching by trigger action type (oldest match first)
+        if (triggerActionType) {
+            idx = this.pendingCorrelations.findIndex(c => c.actionType === triggerActionType);
+        }
+        // Fallback: oldest pending correlation (FIFO)
+        if (idx === -1 && this.pendingCorrelations.length > 0) {
+            idx = 0;
+        }
+        if (idx === -1) {
+            return undefined;
+        }
+        const [entry] = this.pendingCorrelations.splice(idx, 1);
+        clearTimeout(entry.timeoutId);
+        return entry.correlationId;
+    }
+    // Resolve which user action type triggered a given effect-result action type.
+    findTriggerActionType(effectActionType) {
+        for (let i = this.effectTimeline.length - 1; i >= Math.max(0, this.effectTimeline.length - 10); i--) {
+            const effect = this.effectTimeline[i];
+            if (effect.resultAction === effectActionType && effect.triggerAction) {
+                return effect.triggerAction;
+            }
+        }
+        return undefined;
     }
     findEffectNameForAction(actionType) {
         for (let i = this.effectTimeline.length - 1; i >= Math.max(0, this.effectTimeline.length - 10); i--) {
@@ -129,10 +161,17 @@ class EffectTrackerService {
         }
         return undefined;
     }
+    clearPendingCorrelations() {
+        for (const entry of this.pendingCorrelations) {
+            clearTimeout(entry.timeoutId);
+        }
+        this.pendingCorrelations = [];
+    }
     ngOnDestroy() {
         this.destroy$.next();
         this.destroy$.complete();
         this.effectEvents$.complete();
+        this.clearPendingCorrelations();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: EffectTrackerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: EffectTrackerService, providedIn: 'root' });
@@ -142,6 +181,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
 
+const MAX_BUFFER_SIZE = 200;
 class WebSocketService {
     platformId = inject(PLATFORM_ID);
     isBrowser = isPlatformBrowser(this.platformId);
@@ -160,7 +200,7 @@ class WebSocketService {
     get messages$() {
         return this.incomingMessages$.asObservable();
     }
-    initialize(wsUrl = 'ws://localhost:4000') {
+    initialize(wsUrl = DEFAULT_WS_URL) {
         if (this.initialized) {
             // If already initialized with same URL, skip
             if (this.wsUrl === wsUrl) {
@@ -174,19 +214,16 @@ class WebSocketService {
         this.setupWebSocket(wsUrl);
     }
     send(message) {
-        const payload = JSON.stringify(message);
-        if (this.isConnected && this.socket?.readyState === WebSocket.OPEN) {
-            this.socket.send(payload);
-        }
-        else if (this.isBrowser) {
-            this.messageBuffer.push(payload);
-        }
+        this.bufferOrSend(JSON.stringify(message));
     }
     sendRaw(payload) {
+        this.bufferOrSend(payload);
+    }
+    bufferOrSend(payload) {
         if (this.isConnected && this.socket?.readyState === WebSocket.OPEN) {
             this.socket.send(payload);
         }
-        else if (this.isBrowser) {
+        else if (this.isBrowser && this.messageBuffer.length < MAX_BUFFER_SIZE) {
             this.messageBuffer.push(payload);
         }
     }
@@ -198,6 +235,7 @@ class WebSocketService {
     close() {
         this.socket?.close();
         this.socket = null;
+        this.messageBuffer = [];
         this.connectionState$.next(false);
         this.initialized = false;
         this.wsUrl = null;
@@ -228,9 +266,10 @@ class WebSocketService {
         };
     }
     flushBuffer() {
-        while (this.messageBuffer.length > 0 && this.isConnected) {
-            const message = this.messageBuffer.shift();
-            if (message && this.socket?.readyState === WebSocket.OPEN) {
+        const buffered = this.messageBuffer;
+        this.messageBuffer = [];
+        for (const message of buffered) {
+            if (this.isConnected && this.socket?.readyState === WebSocket.OPEN) {
                 this.socket.send(message);
             }
         }
@@ -249,7 +288,7 @@ class ActionsInterceptorService {
     webSocketService = inject(WebSocketService);
     destroy$ = new Subject();
     initialized = false;
-    initialize(wsUrl = 'ws://localhost:4000') {
+    initialize(wsUrl = DEFAULT_WS_URL) {
         if (this.initialized) {
             return;
         }
@@ -1269,11 +1308,11 @@ function TrackedSelector(name) {
     };
 }
 
-function createDevToolMetaReducer(wsUrlOrConfig = 'ws://localhost:4000') {
+function createDevToolMetaReducer(wsUrlOrConfig = DEFAULT_WS_URL) {
     const config = typeof wsUrlOrConfig === 'string'
         ? { wsUrl: wsUrlOrConfig }
         : wsUrlOrConfig;
-    const wsUrl = config.wsUrl ?? 'ws://localhost:4000';
+    const wsUrl = config.wsUrl ?? DEFAULT_WS_URL;
     const enablePerf = config.enablePerformanceTracking ?? true;
     return function devToolMetaReducer(reducer) {
         const performanceTracker = inject(PerformanceTrackerService);
@@ -1313,7 +1352,7 @@ function createDevToolMetaReducer(wsUrlOrConfig = 'ws://localhost:4000') {
     };
 }
 function loggerMetaReducer(reducer) {
-    return createDevToolMetaReducer('ws://localhost:4000')(reducer);
+    return createDevToolMetaReducer(DEFAULT_WS_URL)(reducer);
 }
 
 function provideNgrxDevTool(config = {}) {
@@ -1321,7 +1360,7 @@ function provideNgrxDevTool(config = {}) {
         {
             provide: APP_INITIALIZER,
             useFactory: (interceptor) => () => {
-                interceptor.initialize(config.wsUrl ?? 'ws://localhost:4000');
+                interceptor.initialize(config.wsUrl ?? DEFAULT_WS_URL);
             },
             deps: [ActionsInterceptorService],
             multi: true,
@@ -1350,5 +1389,5 @@ function provideEffectTracking() {
  * Generated bundle index. Do not edit.
  */
 
-export { ActionsInterceptorService, DevToolsEffectSources, EffectTrackerService, PerformanceAnalyzerService, PerformanceTrackerService, PerformanceWarningType, SelectorTrackerService, TrackedSelector, WebSocketService, createDevToolMetaReducer, createTrackedSelector, estimateRenderImpact, loggerMetaReducer, provideEffectTracking, provideNgrxDevTool, setSelectorTracker, trackSelector };
+export { ActionsInterceptorService, DEFAULT_WS_URL, DevToolsEffectSources, EffectTrackerService, PerformanceAnalyzerService, PerformanceTrackerService, PerformanceWarningType, SelectorTrackerService, TrackedSelector, WebSocketService, createDevToolMetaReducer, createTrackedSelector, estimateRenderImpact, loggerMetaReducer, provideEffectTracking, provideNgrxDevTool, setSelectorTracker, trackSelector };
 //# sourceMappingURL=amadeus-it-group-ngrx-devtool.mjs.map