From: Ardis Lu <ardisglu@gmail.com>
Date: Wed, 11 Jan 2023 03:19:46 +0000 (-0800)
Subject: Only show toast on the relevant page
X-Git-Url: https://git.ardis.lu/?a=commitdiff_plain;h=e2aca68cb5608e7452dd8329dabaa3df215533c6;p=ardislu.dev

Only show toast on the relevant page

Without this check, the toast is shown on all open tabs
---

diff --git a/script.js b/script.js
index 8a32f2d..1f7479a 100644
--- a/script.js
+++ b/script.js
@@ -11,8 +11,14 @@ hljs.registerLanguage('solidity', solidity);
 navigator.serviceWorker?.register('/sw.js'); // serviceWorker is disabled on Firefox Private Browsing
 const cacheChannel = new BroadcastChannel('cache');
 cacheChannel.addEventListener('message', e => {
-  // Ignore static assets like logo.svg, style.css, script.js, etc. 
-  if (new URL(e.data.resource).pathname === '/api' && e.data.isUpdated) {
+  const resourceUrl = new URL(e.data.resource);
+  const isApiRequest = resourceUrl.pathname === '/api';
+  const isCurrentPage = resourceUrl.search.split('/').pop() === metadata.get(window.location.pathname).id;
+  // Only show toast if:
+  // - Non-static asset (static assets logo.svg, style.css, script.js, etc. are not managed by service worker)
+  // - The relevant page is open (if the user has multiple tabs open, do not show the toast on unrelated pages)
+  // - Data was changed
+  if (isApiRequest && isCurrentPage && e.data.isUpdated) {
     globalThis.components.get('toast').show();
   }
 });