Merge branch 'sw-network-first' into 'develop'

ServiceWorker: use network-first strategy

See merge request soapbox-pub/soapbox!2159

CHANGELOG.md

@@ -40,6 +40,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Posts: remove file icon from empty link previews.
 - Settings: moved "Import data" under settings.
 - Composer: add more descriptive discard confirmation message.
+- ServiceWorker: switch to a network-first strategy. The "An update is available!" prompt goes away.
 
 ### Fixed
 - Layout: use accent color for "floating action button" (mobile compose button).

app/soapbox/locales/en.json

@@ -1284,8 +1284,6 @@
   "sw.state.unknown": "Unknown",
   "sw.state.waiting": "Waiting",
   "sw.status": "Status",
-  "sw.update": "Update",
-  "sw.update_text": "An update is available.",
   "sw.url": "Script URL",
   "tabs_bar.all": "All",
   "tabs_bar.dashboard": "Dashboard",

app/soapbox/main.tsx

@@ -1,11 +1,8 @@
 import * as OfflinePluginRuntime from '@lcdp/offline-plugin/runtime';
 import React from 'react';
 import { createRoot } from 'react-dom/client';
-import { defineMessages } from 'react-intl';
 
-import { setSwUpdating } from 'soapbox/actions/sw';
 import * as BuildConfig from 'soapbox/build-config';
-import { store } from 'soapbox/store';
 import { printConsoleWarning } from 'soapbox/utils/console';
 
 import '@fontsource/inter/200.css';
@@ -27,12 +24,6 @@ import './precheck';
 import { default as Soapbox } from './containers/soapbox';
 import * as monitoring from './monitoring';
 import ready from './ready';
-import toast from './toast';
-
-const messages = defineMessages({
-  update: { id: 'sw.update', defaultMessage: 'Update' },
-  updateText: { id: 'sw.update_text', defaultMessage: 'An update is available.' },
-});
 
 // Sentry
 monitoring.start();
@@ -51,20 +42,6 @@ ready(() => {
   if (BuildConfig.NODE_ENV === 'production') {
     // avoid offline in dev mode because it's harder to debug
     // https://github.com/NekR/offline-plugin/pull/201#issuecomment-285133572
-    OfflinePluginRuntime.install({
-      onUpdateReady: function() {
-        toast.info(messages.updateText, {
-          actionLabel: messages.update,
-          action: () => {
-            store.dispatch(setSwUpdating(true));
-            OfflinePluginRuntime.applyUpdate();
-          },
-          duration: Infinity,
-        });
-      },
-      onUpdated: function() {
-        window.location.reload();
-      },
-    });
+    OfflinePluginRuntime.install();
   }
 });

webpack/production.ts

@@ -40,6 +40,7 @@ const configuration: Configuration = {
     }),
     new OfflinePlugin({
       autoUpdate: true,
+      responseStrategy: 'network-first',
       caches: {
         main: [':rest:'],
         additional: [
@@ -146,7 +147,6 @@ const configuration: Configuration = {
         requestTypes: ['navigate'],
       }],
       safeToUseOptionalCaches: true,
-      appShell: join(FE_SUBDIRECTORY, '/'),
     }),
   ],
 };