From 028d63992c897b38a16d8a47de9b0ac154b82f8a Mon Sep 17 00:00:00 2001 From: Benji Grant Date: Fri, 9 Jun 2023 03:29:42 +1000 Subject: [PATCH] Remove PWA functionality --- frontend/public/sw.js | 82 ++++--------------- .../AvailabilityEditor/AvailabilityEditor.tsx | 2 +- .../AvailabilityViewer/AvailabilityViewer.tsx | 2 +- frontend/src/components/Settings/Settings.tsx | 10 +++ frontend/{ => src}/hooks/usePalette.ts | 0 5 files changed, 29 insertions(+), 67 deletions(-) rename frontend/{ => src}/hooks/usePalette.ts (100%) diff --git a/frontend/public/sw.js b/frontend/public/sw.js index 6d547b2..a1de5a7 100644 --- a/frontend/public/sw.js +++ b/frontend/public/sw.js @@ -1,67 +1,19 @@ -/* eslint-disable no-restricted-globals */ +// TODO: This is temporary, as I've made the decision to move away +// from a PWA, so must remove all existing service workers -import { clientsClaim, skipWaiting } from 'workbox-core' -import { ExpirationPlugin } from 'workbox-expiration' -import { precacheAndRoute, createHandlerBoundToURL, cleanupOutdatedCaches } from 'workbox-precaching' -import { registerRoute } from 'workbox-routing' -import { StaleWhileRevalidate, NetworkFirst } from 'workbox-strategies' +self.addEventListener("install", () => { + self.skipWaiting() +}) -skipWaiting() -clientsClaim() - -// Injection point -precacheAndRoute(self.__WB_MANIFEST) - -cleanupOutdatedCaches() - -const fileExtensionRegexp = new RegExp('/[^/?]+\\.[^/]+$') -registerRoute( - // Return false to exempt requests from being fulfilled by index.html. - ({ request, url }) => { - // If this isn't a navigation, skip. - if (request.mode !== 'navigate') { - return false - } // If this is a URL that starts with /_, skip. - - if (url.pathname.startsWith('/_')) { - return false - } // If this looks like a URL for a resource, because it contains // a file extension, skip. - - if (url.pathname.match(fileExtensionRegexp)) { - return false - } // Return true to signal that we want to use the handler. - - return true - }, - createHandlerBoundToURL('index.html') -) - -registerRoute( - // Add in any other file extensions or routing criteria as needed. - ({ url }) => url.origin === self.location.origin && ( - url.pathname.endsWith('.png') - || url.pathname.endsWith('.svg') - || url.pathname.endsWith('.jpg') - || url.pathname.endsWith('.jpeg') - || url.pathname.endsWith('.ico') - || url.pathname.endsWith('.ttf') - || url.pathname.endsWith('.woff') - || url.pathname.endsWith('.woff2') - ), // Customize this strategy as needed, e.g., by changing to CacheFirst. - new StaleWhileRevalidate({ - cacheName: 'res', - plugins: [ - // Ensure that once this runtime cache reaches a maximum size the - // least-recently used images are removed. - new ExpirationPlugin({ maxEntries: 50 }), - ], - }) -) - -registerRoute( - // Add in any other file extensions or routing criteria as needed. - ({ url }) => url.origin === self.location.origin && url.pathname.includes('i18n'), - new NetworkFirst({ - cacheName: 'i18n', - }) -) +self.addEventListener("activate", () => { + self.registration + .unregister() + .then(() => self.clients.matchAll()) + .then((clients) => { + clients.forEach((client) => { + if (client.url && "navigate" in client) { + client.navigate(client.url) + } + }) + }) +}) diff --git a/frontend/src/components/AvailabilityEditor/AvailabilityEditor.tsx b/frontend/src/components/AvailabilityEditor/AvailabilityEditor.tsx index d649779..1e7e8fe 100644 --- a/frontend/src/components/AvailabilityEditor/AvailabilityEditor.tsx +++ b/frontend/src/components/AvailabilityEditor/AvailabilityEditor.tsx @@ -1,12 +1,12 @@ import { Fragment, useCallback, useMemo, useRef, useState } from 'react' import Content from '/src/components/Content/Content' +import { usePalette } from '/src/hooks/usePalette' import { useTranslation } from '/src/i18n/client' import { useStore } from '/src/stores' import useSettingsStore from '/src/stores/settingsStore' import { calculateTable, makeClass } from '/src/utils' -import { usePalette } from '/hooks/usePalette' import styles from '../AvailabilityViewer/AvailabilityViewer.module.scss' interface AvailabilityEditorProps { diff --git a/frontend/src/components/AvailabilityViewer/AvailabilityViewer.tsx b/frontend/src/components/AvailabilityViewer/AvailabilityViewer.tsx index 94702e2..009d20a 100644 --- a/frontend/src/components/AvailabilityViewer/AvailabilityViewer.tsx +++ b/frontend/src/components/AvailabilityViewer/AvailabilityViewer.tsx @@ -6,13 +6,13 @@ import { Temporal } from '@js-temporal/polyfill' import Content from '/src/components/Content/Content' import Legend from '/src/components/Legend/Legend' import { PersonResponse } from '/src/config/api' +import { usePalette } from '/src/hooks/usePalette' import { useTranslation } from '/src/i18n/client' import { useStore } from '/src/stores' import useSettingsStore from '/src/stores/settingsStore' import { calculateAvailability, calculateTable, makeClass, relativeTimeFormat } from '/src/utils' import styles from './AvailabilityViewer.module.scss' -import { usePalette } from '/hooks/usePalette' interface AvailabilityViewerProps { times: string[] diff --git a/frontend/src/components/Settings/Settings.tsx b/frontend/src/components/Settings/Settings.tsx index b76b2f4..884e5c5 100644 --- a/frontend/src/components/Settings/Settings.tsx +++ b/frontend/src/components/Settings/Settings.tsx @@ -41,6 +41,16 @@ const Settings = () => { document.body.classList.toggle('dark', store?.theme === 'Dark') }, [store?.theme]) + // TODO: This is temporary, as I've made the decision to move away + // from a PWA, so must remove all existing service workers + if (process.env.NODE_ENV !== 'development') { + useEffect(() => { + if ('serviceWorker' in navigator) { + navigator.serviceWorker.register('/sw.js') + } + }, []) + } + return <>