aboutsummaryrefslogtreecommitdiff
path: root/Timeline/ClientApp/src/app/service-worker.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'Timeline/ClientApp/src/app/service-worker.tsx')
-rw-r--r--Timeline/ClientApp/src/app/service-worker.tsx74
1 files changed, 74 insertions, 0 deletions
diff --git a/Timeline/ClientApp/src/app/service-worker.tsx b/Timeline/ClientApp/src/app/service-worker.tsx
new file mode 100644
index 00000000..ca59445e
--- /dev/null
+++ b/Timeline/ClientApp/src/app/service-worker.tsx
@@ -0,0 +1,74 @@
+import React from 'react';
+import { WorkboxLifecycleEvent } from 'workbox-window/utils/WorkboxEvent';
+import { Button } from 'reactstrap';
+import { useTranslation } from 'react-i18next';
+
+import { pushAlert } from './common/alert-service';
+
+if ('serviceWorker' in navigator) {
+ void import('workbox-window').then(({ Workbox, messageSW }) => {
+ const wb = new Workbox('/sw.js');
+ let registration: ServiceWorkerRegistration | undefined;
+
+ const showFirstPrompt = (event: WorkboxLifecycleEvent): void => {
+ if (!event.isUpdate) {
+ pushAlert({
+ message: {
+ type: 'i18n',
+ key: 'serviceWorker.availableOffline',
+ },
+ type: 'success',
+ });
+ }
+ };
+
+ wb.addEventListener('activated', showFirstPrompt);
+ wb.addEventListener('externalactivated', showFirstPrompt);
+
+ const showSkipWaitingPrompt = (): void => {
+ const upgrade = (): void => {
+ // Assuming the user accepted the update, set up a listener
+ // that will reload the page as soon as the previously waiting
+ // service worker has taken control.
+ wb.addEventListener('controlling', () => {
+ window.location.reload();
+ });
+
+ if (registration && registration.waiting) {
+ // Send a message to the waiting service worker,
+ // instructing it to activate.
+ // Note: for this to work, you have to add a message
+ // listener in your service worker. See below.
+ void messageSW(registration.waiting, { type: 'SKIP_WAITING' });
+ }
+ };
+
+ const UpgradeMessage: React.FC = () => {
+ const { t } = useTranslation();
+ return (
+ <>
+ {t('serviceWorker.upgradeTitle')}
+ <Button color="success" size="sm" onClick={upgrade} outline>
+ {t('serviceWorker.upgradeNow')}
+ </Button>
+ </>
+ );
+ };
+
+ pushAlert({
+ message: UpgradeMessage,
+ dismissTime: 'never',
+ type: 'success',
+ });
+ };
+
+ // Add an event listener to detect when the registered
+ // service worker has installed but is waiting to activate.
+ wb.addEventListener('waiting', showSkipWaitingPrompt);
+ wb.addEventListener('externalwaiting', showSkipWaitingPrompt);
+
+ void wb.register().then((reg) => {
+ registration = reg;
+ });
+ });
+}