From 5aa0dc604f772d3b825d057b3917f498b6965405 Mon Sep 17 00:00:00 2001
From: Dawit Ameneshewa <dawitam11@gmail.com>
Date: Wed, 7 Dec 2022 14:29:53 +0300
Subject: [PATCH] Add storage event listener only when there is at least one
 `WebStorage` API subscriber

Signed-off-by: Dawit Ameneshewa <dawitam11@gmail.com>
---
 .../implementations/StorageApi/WebStorage.ts  | 24 ++++++++++++-------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/packages/core-app-api/src/apis/implementations/StorageApi/WebStorage.ts b/packages/core-app-api/src/apis/implementations/StorageApi/WebStorage.ts
index 0f56a608c1..224327298f 100644
--- a/packages/core-app-api/src/apis/implementations/StorageApi/WebStorage.ts
+++ b/packages/core-app-api/src/apis/implementations/StorageApi/WebStorage.ts
@@ -24,14 +24,6 @@ import ObservableImpl from 'zen-observable';
 
 const buckets = new Map<string, WebStorage>();
 
-window.addEventListener('storage', event => {
-  for (const [bucketPath, webStorage] of buckets.entries()) {
-    if (event.key?.startsWith(bucketPath)) {
-      webStorage.handleStorageChange(event.key);
-    }
-  }
-});
-
 /**
  * An implementation of the storage API, that uses the browser's local storage.
  *
@@ -43,6 +35,8 @@ export class WebStorage implements StorageApi {
     private readonly errorApi: ErrorApi,
   ) {}
 
+  private static hasSubscribers = false;
+
   static create(options: {
     errorApi: ErrorApi;
     namespace?: string;
@@ -50,6 +44,16 @@ export class WebStorage implements StorageApi {
     return new WebStorage(options.namespace ?? '', options.errorApi);
   }
 
+  private static addStorageEventListener() {
+    window.addEventListener('storage', event => {
+      for (const [bucketPath, webStorage] of buckets.entries()) {
+        if (event.key?.startsWith(bucketPath)) {
+          webStorage.handleStorageChange(event.key);
+        }
+      }
+    });
+  }
+
   get<T>(key: string): T | undefined {
     return this.snapshot(key).value as T | undefined;
   }
@@ -97,6 +101,10 @@ export class WebStorage implements StorageApi {
   observe$<T extends JsonValue>(
     key: string,
   ): Observable<StorageValueSnapshot<T>> {
+    if (!WebStorage.hasSubscribers) {
+      WebStorage.addStorageEventListener();
+      WebStorage.hasSubscribers = true;
+    }
     return this.observable.filter(({ key: messageKey }) => messageKey === key);
   }