@servicetitan/log-service 27.1.0 → 27.2.0

package/dist/log-sender.d.ts

@@ -1,26 +1,25 @@
+import { Store } from '@servicetitan/react-ioc';
 import { ConnectionService } from './connection-service';
 import { LogConfig, Log } from './log';
 import { LogStorage } from './log-storage';
-export declare class LogSender {
+export declare class LogSender extends Store {
     readonly connectionService: ConnectionService;
     readonly logStorage: LogStorage;
     private readonly logConfig;
     readonly log: Log;
+    private inSendFailedScenario;
     private isSending;
-    private batchSize;
-    private initialDuration;
-    private initialFailDuration;
-    private failIntervalDuration;
-    private maxIntervalDuration;
-    private failSendScenarioEnabled;
-    private sendInterval?;
     private onItemsChangedDisposer?;
+    private sendInterval;
+    private intervalId?;
     constructor(connectionService: ConnectionService, logStorage: LogStorage, logConfig: LogConfig, log: Log);
+    dispose(): void;
     private onItemsChanged;
     private setSendInterval;
     private send;
+    private sendEvents;
     private setRegularSendScenario;
-    private setFailSendScenario;
+    private setFailedSendScenario;
     private increaseSendInterval;
 }
 //# sourceMappingURL=log-sender.d.ts.map

package/dist/log-sender.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"log-sender.d.ts","sourceRoot":"","sources":["../src/log-sender.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAoB,GAAG,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,UAAU,EAAuB,MAAM,eAAe,CAAC;AAEhE,qBACa,SAAS;IAgBa,QAAQ,CAAC,iBAAiB,EAAE,iBAAiB;IACpD,QAAQ,CAAC,UAAU,EAAE,UAAU;IACzB,OAAO,CAAC,QAAQ,CAAC,SAAS;IACvC,QAAQ,CAAC,GAAG,EAAE,GAAG;IAlBlC,OAAO,CAAC,SAAS,CAAS;IAE1B,OAAO,CAAC,SAAS,CAAO;IAExB,OAAO,CAAC,eAAe,CAAa;IACpC,OAAO,CAAC,mBAAmB,CAAQ;IACnC,OAAO,CAAC,oBAAoB,CAA4B;IACxD,OAAO,CAAC,mBAAmB,CAAkC;IAE7D,OAAO,CAAC,uBAAuB,CAAS;IAExC,OAAO,CAAC,YAAY,CAAC,CAAS;IAC9B,OAAO,CAAC,sBAAsB,CAAC,CAAoB;gBAGX,iBAAiB,EAAE,iBAAiB,EAC3C,UAAU,EAAE,UAAU,EACR,SAAS,EAAE,SAAS,EACzC,GAAG,EAAE,GAAG;IAMlC,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,eAAe;YAST,IAAI;IAgDlB,OAAO,CAAC,sBAAsB;IAW9B,OAAO,CAAC,mBAAmB;IAO3B,OAAO,CAAC,oBAAoB;CAQ/B"}
+{"version":3,"file":"log-sender.d.ts","sourceRoot":"","sources":["../src/log-sender.ts"],"names":[],"mappings":"AAEA,OAAO,EAAsB,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAGpE,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAoB,GAAG,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,UAAU,EAAuB,MAAM,eAAe,CAAC;AAQhE,qBACa,SAAU,SAAQ,KAAK;IAQD,QAAQ,CAAC,iBAAiB,EAAE,iBAAiB;IACpD,QAAQ,CAAC,UAAU,EAAE,UAAU;IACzB,OAAO,CAAC,QAAQ,CAAC,SAAS;IACvC,QAAQ,CAAC,GAAG,EAAE,GAAG;IAVlC,OAAO,CAAC,oBAAoB,CAAS;IACrC,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,sBAAsB,CAAC,CAAoB;IACnD,OAAO,CAAC,YAAY,CAAyB;IAC7C,OAAO,CAAC,UAAU,CAAC,CAAS;gBAGY,iBAAiB,EAAE,iBAAiB,EAC3C,UAAU,EAAE,UAAU,EACR,SAAS,EAAE,SAAS,EACzC,GAAG,EAAE,GAAG;IAMlC,OAAO;IAIP,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,eAAe;IAUvB,OAAO,CAAC,IAAI;YAuBE,UAAU;IA2BxB,OAAO,CAAC,sBAAsB;IAS9B,OAAO,CAAC,qBAAqB;IAW7B,OAAO,CAAC,oBAAoB;CAK/B"}

package/dist/log-sender.js

@@ -11,13 +11,19 @@ var __param = (this && this.__param) || function (paramIndex, decorator) {
     return function (target, key) { decorator(target, key, paramIndex); }
 };
 import axios from 'axios';
-import { injectable, inject } from '@servicetitan/react-ioc';
+import { injectable, inject, Store } from '@servicetitan/react-ioc';
 import { reaction } from 'mobx';
 import { ConnectionService } from './connection-service';
 import { LOG_CONFIG_TOKEN, Log } from './log';
 import { LogStorage, lastId } from './log-storage';
-let LogSender = class LogSender {
+const SECOND = 1000;
+const DEFAULT_SEND_INTERVAL = 60 * SECOND;
+const INITIAL_RETRY_INTERVAL = SECOND;
+const MAX_RETRY_INTERVAL = INITIAL_RETRY_INTERVAL * 512;
+const BATCH_SIZE = 128;
+let LogSender = class LogSender extends Store {
     constructor(connectionService, logStorage, logConfig, log) {
+        super();
         Object.defineProperty(this, "connectionService", {
             enumerable: true,
             configurable: true,
@@ -42,55 +48,31 @@ let LogSender = class LogSender {
             writable: true,
             value: log
         });
-        Object.defineProperty(this, "isSending", {
+        Object.defineProperty(this, "inSendFailedScenario", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: false
         });
-        Object.defineProperty(this, "batchSize", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 128
-        });
-        Object.defineProperty(this, "initialDuration", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 60 * 1000
-        });
-        Object.defineProperty(this, "initialFailDuration", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 1000
-        });
-        Object.defineProperty(this, "failIntervalDuration", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: this.initialFailDuration
-        });
-        Object.defineProperty(this, "maxIntervalDuration", {
+        Object.defineProperty(this, "isSending", {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: this.initialFailDuration * 512
+            value: false
         });
-        Object.defineProperty(this, "failSendScenarioEnabled", {
+        Object.defineProperty(this, "onItemsChangedDisposer", {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: false
+            value: void 0
         });
         Object.defineProperty(this, "sendInterval", {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: void 0
+            value: DEFAULT_SEND_INTERVAL
         });
-        Object.defineProperty(this, "onItemsChangedDisposer", {
+        Object.defineProperty(this, "intervalId", {
             enumerable: true,
             configurable: true,
             writable: true,
@@ -98,59 +80,63 @@ let LogSender = class LogSender {
         });
         this.setRegularSendScenario();
     }
-    /* send on items change */
+    dispose() {
+        window.clearInterval(this.intervalId);
+    }
     onItemsChanged(items) {
-        if (items.length >= this.batchSize) {
+        if (items.length >= BATCH_SIZE) {
             this.send();
         }
     }
-    /* send periodically */
     setSendInterval(interval) {
-        window.clearInterval(this.sendInterval);
-        this.sendInterval = window.setInterval(() => {
+        this.sendInterval = interval;
+        window.clearInterval(this.intervalId);
+        this.intervalId = window.setInterval(() => {
             if (this.logStorage.items.length > 0) {
                 this.send();
             }
         }, interval);
     }
-    async send() {
-        if (this.isSending) {
-            this.log.warning({
-                category: 'Log Service',
-                code: 'LogSenderAlreadySending',
-                message: 'send_already_in_progress',
-            });
+    send() {
+        // If offline, punt
+        if (!this.connectionService.online) {
             return;
         }
-        /* istanbul ignore next */
-        if (!this.connectionService.online) {
-            throw new Error('cannot_send_while_offline');
+        /*
+         * Using Web Locks API to prevent multiple tabs from simultaneously
+         * sending previously saved items. If the API isn't available, ¯\_(ツ)_/¯
+         */
+        if (!('locks' in globalThis.navigator)) {
+            this.sendEvents();
+            return;
+        }
+        // eslint-disable-next-line no-restricted-globals
+        navigator.locks.request(this.logConfig.storageKey, { ifAvailable: true }, async (lock) => {
+            if (lock) {
+                await this.sendEvents();
+            }
+        });
+    }
+    async sendEvents() {
+        if (this.isSending) {
+            return;
         }
         this.isSending = true;
         try {
-            const logEvents = this.logStorage.loadBatch(this.batchSize);
-            /* istanbul ignore next */
-            if (!logEvents.length) {
-                throw new Error('zero_log_events');
-            }
-            try {
+            const logEvents = this.logStorage.loadBatch(BATCH_SIZE);
+            if (logEvents.length) {
                 await axios.post(this.logConfig.endpoint, logEvents);
                 this.logStorage.deleteToId(lastId(logEvents));
-                if (this.failSendScenarioEnabled) {
+                if (this.inSendFailedScenario) {
                     this.setRegularSendScenario();
                 }
             }
-            catch (e) {
-                if (!this.failSendScenarioEnabled) {
-                    this.setFailSendScenario();
-                }
-                else {
-                    this.increaseSendInterval();
-                }
-                /* istanbul ignore next */
-                if (process.env.NODE_ENV !== 'test') {
-                    throw e;
-                }
+        }
+        catch (e) {
+            this.setFailedSendScenario();
+            /* istanbul ignore next */
+            if (process.env.NODE_ENV !== 'test') {
+                throw e;
             }
         }
         finally {
@@ -158,23 +144,24 @@ let LogSender = class LogSender {
         }
     }
     setRegularSendScenario() {
-        this.failSendScenarioEnabled = false;
-        this.failIntervalDuration = this.initialFailDuration;
+        this.inSendFailedScenario = false;
+        this.setSendInterval(DEFAULT_SEND_INTERVAL);
         this.onItemsChangedDisposer = reaction(() => this.logStorage.items, items => this.onItemsChanged(items));
-        this.setSendInterval(this.initialDuration);
     }
-    setFailSendScenario() {
+    setFailedSendScenario() {
         var _a;
-        this.failSendScenarioEnabled = true;
+        if (this.inSendFailedScenario) {
+            this.increaseSendInterval();
+            return;
+        }
+        this.inSendFailedScenario = true;
+        this.setSendInterval(INITIAL_RETRY_INTERVAL);
         (_a = this.onItemsChangedDisposer) === null || _a === void 0 ? void 0 : _a.call(this);
-        this.setSendInterval(this.initialFailDuration);
     }
     increaseSendInterval() {
-        if (this.failIntervalDuration >= this.maxIntervalDuration) {
-            return;
+        if (this.sendInterval < MAX_RETRY_INTERVAL) {
+            this.setSendInterval(this.sendInterval * 2);
         }
-        this.failIntervalDuration *= 2;
-        this.setSendInterval(this.failIntervalDuration);
     }
 };
 LogSender = __decorate([

package/dist/log-sender.js.map

@@ -1 +1 @@
-{"version":3,"file":"log-sender.js","sourceRoot":"","sources":["../src/log-sender.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"log-sender.js","sourceRoot":"","sources":["../src/log-sender.ts"],"names":[],"mappings":"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"}

package/dist/log-storage.d.ts

@@ -1,3 +1,4 @@
+import { Store } from '@servicetitan/react-ioc';
 import { EntryComplete, Nullable } from './log';
 import { LogConfig } from './log-config';
 export interface StorageItem {
@@ -9,17 +10,22 @@ export interface StorageItem {
     data: string;
     exception: string;
 }
-export declare class LogStorage {
+export declare class LogStorage extends Store {
     private readonly logConfig;
     items: StorageItem[];
     private readonly maxLogSize;
     private readonly version;
     private nextItemId;
+    private channel?;
     constructor(logConfig: LogConfig);
+    dispose(): void;
     get config(): LogConfig;
     store(entry: EntryComplete): void;
     deleteToId(id: number): void;
     loadBatch(batchSize: number): StorageItem[];
+    private loadSavedItems;
+    private postDeleteEvent;
+    private handleDeleteEvent;
     private setItems;
     private get storageKey();
     private get storageVersionKey();

package/dist/log-storage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"log-storage.d.ts","sourceRoot":"","sources":["../src/log-storage.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAC;AAE3D,MAAM,WAAW,WAAW;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC3B,IAAI,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACvB,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;CACrB;AAED,qBACa,UAAU;IASmB,OAAO,CAAC,QAAQ,CAAC,SAAS;IAPhE,KAAK,EAAE,WAAW,EAAE,CAAM;IAE1B,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAQ;IACnC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAK;IAE7B,OAAO,CAAC,UAAU,CAAS;gBAE4B,SAAS,EAAE,SAAS;IA2B3E,IAAI,MAAM,IAAI,SAAS,CAEtB;IAED,KAAK,CAAC,KAAK,EAAE,aAAa;IAgB1B,UAAU,CAAC,EAAE,EAAE,MAAM;IAKrB,SAAS,CAAC,SAAS,EAAE,MAAM;IAK3B,OAAO,CAAC,QAAQ;IAKhB,OAAO,KAAK,UAAU,GAErB;IAED,OAAO,KAAK,iBAAiB,GAE5B;IAED,OAAO,CAAC,cAAc;CAIzB;AAED,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,EAAE,GAAG,MAAM,CAMnD"}
+{"version":3,"file":"log-storage.d.ts","sourceRoot":"","sources":["../src/log-storage.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAGpE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAC;AAE3D,MAAM,WAAW,WAAW;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC3B,IAAI,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACvB,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;CACrB;AAWD,qBACa,UAAW,SAAQ,KAAK;IAUK,OAAO,CAAC,QAAQ,CAAC,SAAS;IARhE,KAAK,EAAE,WAAW,EAAE,CAAM;IAE1B,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAQ;IACnC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAK;IAE7B,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,OAAO,CAAC,CAAmB;gBAEoB,SAAS,EAAE,SAAS;IA0B3E,OAAO;IAIP,IAAI,MAAM,IAAI,SAAS,CAEtB;IAED,KAAK,CAAC,KAAK,EAAE,aAAa;IAgB1B,UAAU,CAAC,EAAE,EAAE,MAAM;IAcrB,SAAS,CAAC,SAAS,EAAE,MAAM;IAI3B,OAAO,CAAC,cAAc;IAiBtB,OAAO,CAAC,eAAe;IAUvB,OAAO,CAAC,iBAAiB;IAqBzB,OAAO,CAAC,QAAQ;IAKhB,OAAO,KAAK,UAAU,GAErB;IAED,OAAO,KAAK,iBAAiB,GAE5B;IAED,OAAO,CAAC,cAAc;CAIzB;AAMD,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,EAAE,GAAG,MAAM,CAMnD"}

package/dist/log-storage.js

@@ -10,12 +10,16 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 var __param = (this && this.__param) || function (paramIndex, decorator) {
     return function (target, key) { decorator(target, key, paramIndex); }
 };
-import { inject, injectable } from '@servicetitan/react-ioc';
-import { observable, action, makeObservable } from 'mobx';
+import { inject, injectable, Store } from '@servicetitan/react-ioc';
+import { observable, action, makeObservable, toJS } from 'mobx';
 import { LOG_CONFIG_TOKEN } from './log-config';
-let LogStorage = class LogStorage {
+var EventType;
+(function (EventType) {
+    EventType["Delete"] = "delete";
+})(EventType || (EventType = {}));
+let LogStorage = class LogStorage extends Store {
     constructor(logConfig) {
-        var _a;
+        super();
         Object.defineProperty(this, "logConfig", {
             enumerable: true,
             configurable: true,
@@ -46,27 +50,33 @@ let LogStorage = class LogStorage {
             writable: true,
             value: void 0
         });
+        Object.defineProperty(this, "channel", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
         makeObservable(this);
         const version = window.parseInt(localStorage.getItem(this.storageVersionKey));
         if (version !== this.version) {
             localStorage.removeItem(this.storageKey);
             localStorage.setItem(this.storageVersionKey, String(this.version));
         }
-        try {
-            const items = (_a = JSON.parse(localStorage.getItem(this.storageKey))) !== null && _a !== void 0 ? _a : [];
-            /* migrate error -> exception */
-            items.forEach((item) => {
-                if (typeof item.error === 'string') {
-                    item.exception = item.error;
-                    delete item.error;
-                }
-            });
-            this.setItems(items);
+        this.loadSavedItems();
+        this.nextItemId = lastId(this.items) + 1;
+        /*
+         * Use the BroadcastChannel API to prevent different tabs from processing
+         * the saved items. The first one to process the items sends a "delete" event
+         * that causes all other instances to discard them from memory.
+         */
+        if ('BroadcastChannel' in globalThis) {
+            this.channel = new BroadcastChannel(logConfig.storageKey);
+            this.channel.addEventListener('message', ({ data }) => this.handleDeleteEvent(data));
         }
-        catch (e) {
-            this.setItems([]);
-        }
-        this.nextItemId = lastId(this.items);
+    }
+    dispose() {
+        var _a;
+        (_a = this.channel) === null || _a === void 0 ? void 0 : _a.close();
     }
     get config() {
         return this.logConfig;
@@ -86,12 +96,62 @@ let LogStorage = class LogStorage {
         this.setItems(items);
     }
     deleteToId(id) {
-        const items = this.items.filter(item => item.id > id);
+        const deletedItems = [];
+        const items = this.items.filter(item => {
+            if (item.id > id) {
+                return true;
+            }
+            deletedItems.push(item);
+            return false;
+        });
         this.setItems(items);
+        this.postDeleteEvent(deletedItems);
     }
     loadBatch(batchSize) {
         return this.items.slice(0, batchSize);
     }
+    loadSavedItems() {
+        var _a;
+        try {
+            const items = (_a = JSON.parse(localStorage.getItem(this.storageKey))) !== null && _a !== void 0 ? _a : [];
+            /* migrate error -> exception */
+            items.forEach((item) => {
+                if (typeof item.error === 'string') {
+                    item.exception = item.error;
+                    delete item.error;
+                }
+            });
+            this.setItems(items);
+        }
+        catch (e) {
+            this.setItems([]);
+        }
+    }
+    postDeleteEvent(items) {
+        if (this.channel) {
+            const event = {
+                type: EventType.Delete,
+                items: items.map(item => toJS(item)),
+            };
+            this.channel.postMessage(event);
+        }
+    }
+    handleDeleteEvent(event) {
+        /* istanbul ignore next: because there's only one event type */
+        if (event.type !== EventType.Delete) {
+            return;
+        }
+        // Map item id to object for fast lookup
+        const map = new Map(event.items.map(item => [item.id, item]));
+        //  Discard deleted items
+        const items = this.items.filter(item => !isEqual(item, map.get(item.id)));
+        this.setItems(items);
+        // If no more items, close channel; all saved items have been processed
+        if (items.length === 0 && this.channel) {
+            this.channel.close();
+            delete this.channel;
+        }
+    }
     setItems(items) {
         this.items = [...items];
         localStorage.setItem(this.storageKey, JSON.stringify(this.items));
@@ -123,6 +183,9 @@ LogStorage = __decorate([
     __metadata("design:paramtypes", [Object])
 ], LogStorage);
 export { LogStorage };
+function isEqual(a, b) {
+    return b && Object.keys(a).every((key) => a[key] === b[key]);
+}
 export function lastId(items) {
     if (!items.length) {
         return 0;

package/dist/log-storage.js.map

@@ -1 +1 @@
-{"version":3,"file":"log-storage.js","sourceRoot":"","sources":["../src/log-storage.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"log-storage.js","sourceRoot":"","sources":["../src/log-storage.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@servicetitan/log-service",
-    "version": "27.1.0",
+    "version": "27.2.0",
     "description": "",
     "homepage": "https://docs.st.dev/docs/frontend/log-service",
     "repository": {
@@ -16,18 +16,18 @@
         "src"
     ],
     "devDependencies": {
-        "@servicetitan/react-ioc": "27.1.0",
+        "@servicetitan/react-ioc": "27.2.0",
         "@testing-library/dom": "^10.4.0",
-        "@testing-library/react": "^16.0.0",
+        "@testing-library/react": "^16.0.1",
         "@types/lodash.throttle": "~4.1.6",
         "axios": "~0.28.1",
-        "mobx": "~6.13.1",
+        "mobx": "~6.13.2",
         "react": "~18.3.1"
     },
     "peerDependencies": {
-        "@servicetitan/react-ioc": "27.1.0",
+        "@servicetitan/react-ioc": "27.2.0",
         "axios": "~0.28.1",
-        "mobx": ">=6.13.1",
+        "mobx": ">=6.13.2",
         "react": ">=17.0.2"
     },
     "dependencies": {
@@ -39,5 +39,5 @@
     "cli": {
         "webpack": false
     },
-    "gitHead": "6eca03725ca72a85b405412c0b8cb934eb341366"
+    "gitHead": "311c957e8712703f03339865cd83b98e0140a523"
 }

package/src/__tests__/__mocks__/broadcast-channel.ts

@@ -0,0 +1,39 @@
+import { EventEmitter } from 'node:events';
+
+const channels: Map<string, EventEmitter> = new Map();
+
+export class MockBroadcastChannel implements BroadcastChannel {
+    onmessage = jest.fn();
+    onmessageerror = jest.fn();
+    removeEventListener = jest.fn();
+    dispatchEvent = jest.fn();
+
+    postMessage = jest.fn().mockImplementation(message => {
+        const event = { data: message, from: this };
+        this.emitter.emit('message', event);
+    });
+
+    addEventListener = jest.fn().mockImplementation((_: string, listener: any) => {
+        this.emitter.on('message', ({ from, ...event }) => {
+            if (from !== this) {
+                listener(event);
+            }
+        });
+    });
+
+    close = jest.fn().mockImplementation(() => {
+        this.emitter.removeAllListeners();
+        channels.delete(this.name);
+    });
+
+    private emitter: EventEmitter;
+
+    constructor(public name: string) {
+        this.emitter = channels.get(name)!;
+        if (!this.emitter) {
+            const emitter = new EventEmitter();
+            channels.set(name, emitter);
+            this.emitter = emitter;
+        }
+    }
+}

package/src/__tests__/__mocks__/index.ts

@@ -0,0 +1 @@
+export * from './broadcast-channel';

package/src/__tests__/log-sender.test.ts

@@ -1,7 +1,7 @@
 import axios from 'axios';
 import { ConnectionService } from '../connection-service';
 import { Log, LogConfig, LogEntryType, LogInfo, LogWarning } from '../log';
-import { LogStorage } from '../log-storage';
+import { lastId, LogStorage } from '../log-storage';
 
 import { LogSender } from '../log-sender';
 
@@ -35,13 +35,13 @@ describe(`[log-service] ${LogSender.name}`, () => {
     let log: Pick<Log, 'info' | 'warning'>;
 
     beforeAll(() => {
-        jest.spyOn(window, 'setInterval').mockImplementation(jest.fn());
         process.env.NODE_ENV ??= 'test'; // workaround issue with Jest not setting NODE_ENV=test
+        jest.spyOn(window, 'setInterval').mockImplementation(jest.fn());
+        jest.spyOn(axios, 'post').mockImplementation(jest.fn());
     });
 
     beforeEach(() => {
         jest.clearAllMocks();
-        jest.spyOn(axios, 'post').mockImplementation(jest.fn());
 
         logStorage = new LogStorage(logConfig);
         log = new MockLog(logStorage);
@@ -49,9 +49,11 @@ describe(`[log-service] ${LogSender.name}`, () => {
         const logSender = new LogSender(connectionService, logStorage, logConfig, log as Log);
     });
 
+    afterEach(() => logStorage.deleteToId(lastId(logStorage.items)));
+
     const subject = async () => {
         getHandler().fn();
-        await new Promise(process.nextTick); // resolve pending promises
+        await Promise.resolve(); // resolve pending promises
     };
 
     function getHandler() {
@@ -114,14 +116,21 @@ describe(`[log-service] ${LogSender.name}`, () => {
                 })
             );
 
-            test('logs warning', async () => {
-                const spy = jest.spyOn(log, 'warning');
+            test('skips redundant post', async () => {
+                await subject();
+
+                expect(axios.post).toHaveBeenCalledTimes(1);
+            });
+        });
+
+        describe('when offline', () => {
+            beforeEach(() => connectionService.setOnline(false));
+            afterEach(() => connectionService.setOnline(true));
 
+            test('does not post', async () => {
                 await subject();
 
-                expect(spy).toHaveBeenCalledWith(
-                    expect.objectContaining({ message: 'send_already_in_progress' })
-                );
+                expect(axios.post).not.toHaveBeenCalled();
             });
         });
     });

package/src/__tests__/log-storage.test.ts

@@ -1,17 +1,26 @@
 import { EntryComplete, LogEntryType } from '../log';
 import { LogConfig } from '../log-config';
-import { LogStorage } from '../log-storage';
+import { lastId, LogStorage } from '../log-storage';
+
+import { MockBroadcastChannel } from './__mocks__';
 
 describe(`${LogStorage.name}`, () => {
     const LOCAL_STORAGE_VERSION = '1';
     const logConfig: LogConfig = { endpoint: '/Log/Foo', storageKey: 'LogStorage_Foo' };
+    let logStorage: LogStorage;
+
+    beforeAll(() => {
+        jest.spyOn(globalThis, 'BroadcastChannel').mockImplementation(
+            (name: string) => new MockBroadcastChannel(name)
+        );
+    });
 
     beforeEach(() => window.localStorage.clear());
+    afterEach(() => logStorage.dispose());
 
     const subject = (entryOrEntries: EntryComplete | EntryComplete[] = []) => {
-        const entries = Array.isArray(entryOrEntries) ? entryOrEntries : [entryOrEntries];
-        const logStorage = new LogStorage(logConfig);
-        entries.forEach(entry => logStorage.store(entry));
+        logStorage = new LogStorage(logConfig);
+        [entryOrEntries].flat().forEach(entry => logStorage.store(entry));
         return logStorage;
     };
 
@@ -29,6 +38,7 @@ describe(`${LogStorage.name}`, () => {
         beforeEach(() => {
             const logStorage = new LogStorage(logConfig);
             entries.map(entry => logStorage.store(entry));
+            logStorage.dispose();
         });
 
         function itLoadsSavedItems() {
@@ -71,6 +81,39 @@ describe(`${LogStorage.name}`, () => {
 
             itLoadsSavedItems();
         });
+
+        describe('when multiple instances are running simultaneously', () => {
+            let otherLogStorage: LogStorage;
+
+            beforeEach(() => (otherLogStorage = new LogStorage(logConfig)));
+            afterEach(() => otherLogStorage.dispose());
+
+            test('deleteToId removes items from both instances', () => {
+                const logStorage = subject();
+
+                expect(logStorage.items.length).toEqual(entries.length);
+                expect(otherLogStorage.items.length).toEqual(entries.length);
+
+                logStorage.deleteToId(lastId(logStorage.items));
+
+                expect(logStorage.items).toEqual([]);
+                expect(otherLogStorage.items).toEqual([]);
+            });
+
+            test('deleteToId does not remove private items', () => {
+                const logStorage = subject();
+
+                const entry = createEntry({ message: 'foo' });
+                otherLogStorage.store(entry);
+
+                logStorage.deleteToId(lastId(logStorage.items));
+
+                expect(logStorage.items).toEqual([]);
+                expect(otherLogStorage.items).toEqual(
+                    buildItems([entry]).map(expect.objectContaining)
+                );
+            });
+        });
     });
 
     test('stores items with unique ids', () => {

package/src/log-sender.ts

@@ -1,27 +1,25 @@
 import axios from 'axios';
 
-import { injectable, inject } from '@servicetitan/react-ioc';
+import { injectable, inject, Store } from '@servicetitan/react-ioc';
 import { reaction, IReactionDisposer } from 'mobx';
 
 import { ConnectionService } from './connection-service';
 import { LogConfig, LOG_CONFIG_TOKEN, Log } from './log';
 import { LogStorage, lastId, StorageItem } from './log-storage';
 
+const SECOND = 1000;
+const DEFAULT_SEND_INTERVAL = 60 * SECOND;
+const INITIAL_RETRY_INTERVAL = SECOND;
+const MAX_RETRY_INTERVAL = INITIAL_RETRY_INTERVAL * 512;
+const BATCH_SIZE = 128;
+
 @injectable()
-export class LogSender {
+export class LogSender extends Store {
+    private inSendFailedScenario = false;
     private isSending = false;
-
-    private batchSize = 128;
-
-    private initialDuration = 60 * 1000;
-    private initialFailDuration = 1000;
-    private failIntervalDuration = this.initialFailDuration;
-    private maxIntervalDuration = this.initialFailDuration * 512;
-
-    private failSendScenarioEnabled = false;
-
-    private sendInterval?: number;
     private onItemsChangedDisposer?: IReactionDisposer;
+    private sendInterval = DEFAULT_SEND_INTERVAL;
+    private intervalId?: number;
 
     constructor(
         @inject(ConnectionService) readonly connectionService: ConnectionService,
@@ -29,68 +27,74 @@ export class LogSender {
         @inject(LOG_CONFIG_TOKEN) private readonly logConfig: LogConfig,
         @inject(Log) readonly log: Log
     ) {
+        super();
         this.setRegularSendScenario();
     }
 
-    /* send on items change */
+    dispose() {
+        window.clearInterval(this.intervalId);
+    }
+
     private onItemsChanged(items: StorageItem[]) {
-        if (items.length >= this.batchSize) {
+        if (items.length >= BATCH_SIZE) {
             this.send();
         }
     }
 
-    /* send periodically */
     private setSendInterval(interval: number) {
-        window.clearInterval(this.sendInterval);
-        this.sendInterval = window.setInterval(() => {
+        this.sendInterval = interval;
+        window.clearInterval(this.intervalId);
+        this.intervalId = window.setInterval(() => {
             if (this.logStorage.items.length > 0) {
                 this.send();
             }
         }, interval);
     }
 
-    private async send() {
-        if (this.isSending) {
-            this.log.warning({
-                category: 'Log Service',
-                code: 'LogSenderAlreadySending',
-                message: 'send_already_in_progress',
-            });
-            return;
-        }
-        /* istanbul ignore next */
+    private send() {
+        // If offline, punt
         if (!this.connectionService.online) {
-            throw new Error('cannot_send_while_offline');
+            return;
         }
 
-        this.isSending = true;
-
-        try {
-            const logEvents = this.logStorage.loadBatch(this.batchSize);
+        /*
+         * Using Web Locks API to prevent multiple tabs from simultaneously
+         * sending previously saved items. If the API isn't available, ¯\_(ツ)_/¯
+         */
+        if (!('locks' in globalThis.navigator)) {
+            this.sendEvents();
+            return;
+        }
 
-            /* istanbul ignore next */
-            if (!logEvents.length) {
-                throw new Error('zero_log_events');
+        // eslint-disable-next-line no-restricted-globals
+        navigator.locks.request(this.logConfig.storageKey, { ifAvailable: true }, async lock => {
+            if (lock) {
+                await this.sendEvents();
             }
+        });
+    }
+
+    private async sendEvents() {
+        if (this.isSending) {
+            return;
+        }
 
-            try {
+        this.isSending = true;
+        try {
+            const logEvents = this.logStorage.loadBatch(BATCH_SIZE);
+            if (logEvents.length) {
                 await axios.post(this.logConfig.endpoint, logEvents);
                 this.logStorage.deleteToId(lastId(logEvents));
 
-                if (this.failSendScenarioEnabled) {
+                if (this.inSendFailedScenario) {
                     this.setRegularSendScenario();
                 }
-            } catch (e) {
-                if (!this.failSendScenarioEnabled) {
-                    this.setFailSendScenario();
-                } else {
-                    this.increaseSendInterval();
-                }
-
-                /* istanbul ignore next */
-                if (process.env.NODE_ENV !== 'test') {
-                    throw e;
-                }
+            }
+        } catch (e) {
+            this.setFailedSendScenario();
+            /* istanbul ignore next */
+            if (process.env.NODE_ENV !== 'test') {
+                throw e;
             }
         } finally {
             this.isSending = false;
@@ -98,29 +102,28 @@ export class LogSender {
     }
 
     private setRegularSendScenario() {
-        this.failSendScenarioEnabled = false;
-        this.failIntervalDuration = this.initialFailDuration;
-
+        this.inSendFailedScenario = false;
+        this.setSendInterval(DEFAULT_SEND_INTERVAL);
         this.onItemsChangedDisposer = reaction(
             () => this.logStorage.items,
             items => this.onItemsChanged(items)
         );
-        this.setSendInterval(this.initialDuration);
     }
 
-    private setFailSendScenario() {
-        this.failSendScenarioEnabled = true;
+    private setFailedSendScenario() {
+        if (this.inSendFailedScenario) {
+            this.increaseSendInterval();
+            return;
+        }
 
+        this.inSendFailedScenario = true;
+        this.setSendInterval(INITIAL_RETRY_INTERVAL);
         this.onItemsChangedDisposer?.();
-        this.setSendInterval(this.initialFailDuration);
     }
 
     private increaseSendInterval() {
-        if (this.failIntervalDuration >= this.maxIntervalDuration) {
-            return;
+        if (this.sendInterval < MAX_RETRY_INTERVAL) {
+            this.setSendInterval(this.sendInterval * 2);
         }
-        this.failIntervalDuration *= 2;
-
-        this.setSendInterval(this.failIntervalDuration);
     }
 }

package/src/log-storage.ts

@@ -1,5 +1,5 @@
-import { inject, injectable } from '@servicetitan/react-ioc';
-import { observable, action, makeObservable } from 'mobx';
+import { inject, injectable, Store } from '@servicetitan/react-ioc';
+import { observable, action, makeObservable, toJS } from 'mobx';
 
 import { EntryComplete, Nullable } from './log';
 import { LOG_CONFIG_TOKEN, LogConfig } from './log-config';
@@ -14,8 +14,17 @@ export interface StorageItem {
     exception: string;
 }
 
+enum EventType {
+    Delete = 'delete',
+}
+
+interface DeleteEvent {
+    type: EventType;
+    items: StorageItem[];
+}
+
 @injectable()
-export class LogStorage {
+export class LogStorage extends Store {
     @observable
     items: StorageItem[] = [];
 
@@ -23,8 +32,10 @@ export class LogStorage {
     private readonly version = 1;
 
     private nextItemId: number;
+    private channel?: BroadcastChannel;
 
     constructor(@inject(LOG_CONFIG_TOKEN) private readonly logConfig: LogConfig) {
+        super();
         makeObservable(this);
 
         const version = window.parseInt(localStorage.getItem(this.storageVersionKey) as string);
@@ -33,22 +44,24 @@ export class LogStorage {
             localStorage.setItem(this.storageVersionKey, String(this.version));
         }
 
-        try {
-            const items = JSON.parse(localStorage.getItem(this.storageKey) as string) ?? [];
-
-            /* migrate error -> exception */
-            items.forEach((item: StorageItem & { error?: string }) => {
-                if (typeof item.error === 'string') {
-                    item.exception = item.error;
-                    delete item.error;
-                }
-            });
-            this.setItems(items);
-        } catch (e) {
-            this.setItems([]);
+        this.loadSavedItems();
+        this.nextItemId = lastId(this.items) + 1;
+
+        /*
+         * Use the BroadcastChannel API to prevent different tabs from processing
+         * the saved items. The first one to process the items sends a "delete" event
+         * that causes all other instances to discard them from memory.
+         */
+        if ('BroadcastChannel' in globalThis) {
+            this.channel = new BroadcastChannel(logConfig.storageKey);
+            this.channel.addEventListener('message', ({ data }: MessageEvent<DeleteEvent>) =>
+                this.handleDeleteEvent(data)
+            );
         }
+    }
 
-        this.nextItemId = lastId(this.items);
+    dispose() {
+        this.channel?.close();
     }
 
     get config(): LogConfig {
@@ -72,14 +85,70 @@ export class LogStorage {
     }
 
     deleteToId(id: number) {
-        const items = this.items.filter(item => item.id > id);
+        const deletedItems: StorageItem[] = [];
+        const items = this.items.filter(item => {
+            if (item.id > id) {
+                return true;
+            }
+            deletedItems.push(item);
+            return false;
+        });
+
         this.setItems(items);
+        this.postDeleteEvent(deletedItems);
     }
 
     loadBatch(batchSize: number) {
         return this.items.slice(0, batchSize);
     }
 
+    private loadSavedItems() {
+        try {
+            const items = JSON.parse(localStorage.getItem(this.storageKey) as string) ?? [];
+
+            /* migrate error -> exception */
+            items.forEach((item: StorageItem & { error?: string }) => {
+                if (typeof item.error === 'string') {
+                    item.exception = item.error;
+                    delete item.error;
+                }
+            });
+            this.setItems(items);
+        } catch (e) {
+            this.setItems([]);
+        }
+    }
+
+    private postDeleteEvent(items: StorageItem[]) {
+        if (this.channel) {
+            const event: DeleteEvent = {
+                type: EventType.Delete,
+                items: items.map(item => toJS(item)),
+            };
+            this.channel.postMessage(event);
+        }
+    }
+
+    private handleDeleteEvent(event: DeleteEvent) {
+        /* istanbul ignore next: because there's only one event type */
+        if (event.type !== EventType.Delete) {
+            return;
+        }
+
+        // Map item id to object for fast lookup
+        const map = new Map<number, StorageItem>(event.items.map(item => [item.id, item]));
+
+        //  Discard deleted items
+        const items = this.items.filter(item => !isEqual(item, map.get(item.id)));
+        this.setItems(items);
+
+        // If no more items, close channel; all saved items have been processed
+        if (items.length === 0 && this.channel) {
+            this.channel.close();
+            delete this.channel;
+        }
+    }
+
     @action
     private setItems(items: StorageItem[]) {
         this.items = [...items];
@@ -100,6 +169,10 @@ export class LogStorage {
     }
 }
 
+function isEqual(a: StorageItem, b?: StorageItem) {
+    return b && Object.keys(a).every((key: keyof StorageItem) => a[key] === b[key]);
+}
+
 export function lastId(items: StorageItem[]): number {
     if (!items.length) {
         return 0;