From d288f6d6a398ba2036b129a2c0cdeac778ed2411 Mon Sep 17 00:00:00 2001
From: Karina Kwiatek <kjk@kjk.dog>
Date: Thu, 5 Jan 2023 11:08:13 +0100
Subject: [PATCH] Move subscription check logic into separate initializer

---
 app/javascript/packs/application.ts           |  4 +-
 .../retrospring/features/webpush/index.ts     | 58 ++++---------------
 .../features/webpush/subscriptionCheck.ts     | 33 +++++++++++
 3 files changed, 48 insertions(+), 47 deletions(-)
 create mode 100644 app/javascript/retrospring/features/webpush/subscriptionCheck.ts

diff --git a/app/javascript/packs/application.ts b/app/javascript/packs/application.ts
index d0389539..0f4bf121 100644
--- a/app/javascript/packs/application.ts
+++ b/app/javascript/packs/application.ts
@@ -14,6 +14,7 @@ import initModeration from 'retrospring/features/moderation';
 import initMemes from 'retrospring/features/memes';
 import initFront from 'retrospring/features/front';
 import initWebpush from 'retrospring/features/webpush';
+import initWebpushSubscriptionCheck from 'retrospring/features/webpush/subscriptionCheck';
 
 start();
 document.addEventListener('turbo:load', initCapabilities);
@@ -27,7 +28,8 @@ document.addEventListener('DOMContentLoaded', initQuestion);
 document.addEventListener('DOMContentLoaded', initModeration);
 document.addEventListener('DOMContentLoaded', initMemes);
 document.addEventListener('turbo:load', initFront);
-document.addEventListener('turbo:load', initWebpush);
+document.addEventListener('DOMContentLoaded', initWebpush);
+document.addEventListener('turbo:load', initWebpushSubscriptionCheck);
 
 window['Stimulus'] = Application.start();
 const context = require.context('../retrospring/controllers', true, /\.ts$/);
diff --git a/app/javascript/retrospring/features/webpush/index.ts b/app/javascript/retrospring/features/webpush/index.ts
index 566cf95d..6821c98e 100644
--- a/app/javascript/retrospring/features/webpush/index.ts
+++ b/app/javascript/retrospring/features/webpush/index.ts
@@ -1,52 +1,18 @@
 import registerEvents from 'retrospring/utilities/registerEvents';
 import { enableHandler } from './enable';
 import { dismissHandler } from "./dismiss";
-import { unsubscribeHandler, checkSubscription } from "retrospring/features/webpush/unsubscribe";
-
-let initialized = false;
+import { unsubscribeHandler } from "retrospring/features/webpush/unsubscribe";
 
 export default (): void => {
-  const swCapable = 'serviceWorker' in navigator;
-  const notificationCapable = 'Notification' in window;
-
-  // We want to adjust enable/disable buttons on every page load
-  // because the enable button appears on both the settings and inbox pages.
-  if (swCapable && notificationCapable) {
-    const enableBtn = document.querySelector('button[data-action="push-enable"]');
-
-    navigator.serviceWorker.getRegistration().then(async registration => {
-      const subscription = await registration?.pushManager.getSubscription();
-      if (subscription) {
-        document.querySelector('button[data-action="push-enable"]')?.classList.add('d-none');
-        document.querySelector('[data-action="push-disable"]')?.classList.remove('d-none');
-
-        if (!initialized) {
-          checkSubscription(subscription);
-        }
-        return;
-      }
-
-      enableBtn?.classList.remove('d-none');
-
-      if (localStorage.getItem('dismiss-push-settings-prompt') == null) {
-        document.querySelector('.push-settings')?.classList.remove('d-none');
-      }
-    });
-  }
-
-  if (!initialized) {
-    registerEvents([
-      {type: 'click', target: '[data-action="push-enable"]', handler: enableHandler, global: true},
-      {type: 'click', target: '[data-action="push-dismiss"]', handler: dismissHandler, global: true},
-      {type: 'click', target: '[data-action="push-disable"]', handler: unsubscribeHandler, global: true},
-      {
-        type: 'click',
-        target: '[data-action="push-remove-all"]',
-        handler: unsubscribeHandler,
-        global: true
-      },
-    ]);
-
-    initialized = true;
-  }
+  registerEvents([
+    {type: 'click', target: '[data-action="push-enable"]', handler: enableHandler, global: true},
+    {type: 'click', target: '[data-action="push-dismiss"]', handler: dismissHandler, global: true},
+    {type: 'click', target: '[data-action="push-disable"]', handler: unsubscribeHandler, global: true},
+    {
+      type: 'click',
+      target: '[data-action="push-remove-all"]',
+      handler: unsubscribeHandler,
+      global: true
+    },
+  ]);
 }
diff --git a/app/javascript/retrospring/features/webpush/subscriptionCheck.ts b/app/javascript/retrospring/features/webpush/subscriptionCheck.ts
new file mode 100644
index 00000000..0755b614
--- /dev/null
+++ b/app/javascript/retrospring/features/webpush/subscriptionCheck.ts
@@ -0,0 +1,33 @@
+import { checkSubscription } from "retrospring/features/webpush/unsubscribe";
+
+let subscriptionChecked = false;
+
+export default (): void => {
+  const swCapable = 'serviceWorker' in navigator;
+  const notificationCapable = 'Notification' in window;
+
+  // We want to adjust enable/disable buttons on every page load
+  // because the enable button appears on both the settings and inbox pages.
+  if (swCapable && notificationCapable) {
+    const enableBtn = document.querySelector('button[data-action="push-enable"]');
+
+    navigator.serviceWorker.getRegistration().then(async registration => {
+      const subscription = await registration?.pushManager.getSubscription();
+      if (subscription) {
+        document.querySelector('button[data-action="push-enable"]')?.classList.add('d-none');
+        document.querySelector('[data-action="push-disable"]')?.classList.remove('d-none');
+
+        if (!subscriptionChecked) {
+          checkSubscription(subscription);
+          subscriptionChecked = true;
+        }
+      }
+
+      enableBtn?.classList.remove('d-none');
+
+      if (localStorage.getItem('dismiss-push-settings-prompt') == null) {
+        document.querySelector('.push-settings')?.classList.remove('d-none');
+      }
+    });
+  }
+}