From d22091408578b275d53fd531eb300b4606e5dcad Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Dominik=20=C5=BBegle=C5=84?= Date: Mon, 26 Apr 2021 12:10:47 +0200 Subject: [PATCH] Add service worker (#1073) * Add service worker * Update messages * Update changelog * Remove debug code * Refactor code and add interval config * Clear interval * Reload all pages simultaneously * Update copy --- CHANGELOG.md | 7 +- locale/defaultMessages.json | 12 + package-lock.json | 599 +++++++++++++++++- package.json | 10 +- src/config.ts | 1 + .../ServiceWorker/ServiceWorker.tsx | 32 + src/containers/ServiceWorker/index.ts | 2 + src/containers/ServiceWorker/messages.ts | 19 + src/hooks/useServiceWorker.ts | 37 ++ src/index.tsx | 2 + src/sw.js | 76 +++ webpack.config.js | 17 +- 12 files changed, 791 insertions(+), 23 deletions(-) create mode 100644 src/containers/ServiceWorker/ServiceWorker.tsx create mode 100644 src/containers/ServiceWorker/index.ts create mode 100644 src/containers/ServiceWorker/messages.ts create mode 100644 src/hooks/useServiceWorker.ts create mode 100644 src/sw.js diff --git a/CHANGELOG.md b/CHANGELOG.md index d0ac6a992..022fd9728 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -37,10 +37,11 @@ All notable, unreleased changes to this project will be documented in this file. - Fix voucher and sales sorting errors - #1063 by @orzechdev - Fix custom currency formatting - #1067 by @orzechdev - Fixes - #1077 by @piotrgrundas: - - rich text field updates, - - multiselect empty chip upon creation of a product/variant, - - useFormset.setItemValue wrong updates, + - rich text field updates, + - multiselect empty chip upon creation of a product/variant, + - useFormset.setItemValue wrong updates, - Drop deprecated fields - #1071 by @jwm0 +- Add service worker - #1073 by @dominik-zeglen # 2.11.1 diff --git a/locale/defaultMessages.json b/locale/defaultMessages.json index 0ac48699c..37820f7d9 100644 --- a/locale/defaultMessages.json +++ b/locale/defaultMessages.json @@ -2392,6 +2392,18 @@ "context": "dialog header, title", "string": "Invoice Generation" }, + "src_dot_containers_dot_ServiceWorker_dot_newVersionContent": { + "context": "new version notification content", + "string": "You need to update Saleor to the newest version. Before doing so - save all changes to prevent loss of data. To update use the button below." + }, + "src_dot_containers_dot_ServiceWorker_dot_newVersionTitle": { + "context": "notification title", + "string": "System update required" + }, + "src_dot_containers_dot_ServiceWorker_dot_refresh": { + "context": "button", + "string": "Refresh" + }, "src_dot_create": { "context": "button", "string": "Create" diff --git a/package-lock.json b/package-lock.json index 497a52716..edec382ff 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2114,12 +2114,60 @@ "integrity": "sha512-KWk80UPIzPmUg+P0rKh6TqspRw0G6eux1PuJr+zz47ftMaZ9QDwbGzHZbtzWkl5hgayM/qrKRutllRC7D/vVXQ==", "dev": true }, + "@hapi/address": { + "version": "2.1.4", + "resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz", + "integrity": "sha512-QD1PhQk+s31P1ixsX0H0Suoupp3VMXzIVMSwobR3F3MSUO2YCV0B7xqLcUw/Bh8yuvd3LhpyqLQWTNcRmp6IdQ==", + "dev": true + }, + "@hapi/formula": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@hapi/formula/-/formula-1.2.0.tgz", + "integrity": "sha512-UFbtbGPjstz0eWHb+ga/GM3Z9EzqKXFWIbSOFURU0A/Gku0Bky4bCk9/h//K2Xr3IrCfjFNhMm4jyZ5dbCewGA==", + "dev": true + }, "@hapi/hoek": { "version": "9.1.1", "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.1.1.tgz", "integrity": "sha512-CAEbWH7OIur6jEOzaai83jq3FmKmv4PmX1JYfs9IrYcGEVI/lyL1EXJGCj7eFVJ0bg5QR8LMxBlEtA+xKiLpFw==", "dev": true }, + "@hapi/joi": { + "version": "16.1.8", + "resolved": "https://registry.npmjs.org/@hapi/joi/-/joi-16.1.8.tgz", + "integrity": "sha512-wAsVvTPe+FwSrsAurNt5vkg3zo+TblvC5Bb1zMVK6SJzZqw9UrJnexxR+76cpePmtUZKHAPxcQ2Bf7oVHyahhg==", + "dev": true, + "requires": { + "@hapi/address": "^2.1.2", + "@hapi/formula": "^1.2.0", + "@hapi/hoek": "^8.2.4", + "@hapi/pinpoint": "^1.0.2", + "@hapi/topo": "^3.1.3" + }, + "dependencies": { + "@hapi/hoek": { + "version": "8.5.1", + "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-8.5.1.tgz", + "integrity": "sha512-yN7kbciD87WzLGc5539Tn0sApjyiGHAJgKvG9W8C7O+6c7qmoQMfVs0W4bX17eqz6C78QJqqFrtgdK5EWf6Qow==", + "dev": true + }, + "@hapi/topo": { + "version": "3.1.6", + "resolved": "https://registry.npmjs.org/@hapi/topo/-/topo-3.1.6.tgz", + "integrity": "sha512-tAag0jEcjwH+P2quUfipd7liWCNX2F8NvYjQp2wtInsZxnMlypdw0FtAOLxtvvkO+GSRRbmNi8m/5y42PQJYCQ==", + "dev": true, + "requires": { + "@hapi/hoek": "^8.3.0" + } + } + } + }, + "@hapi/pinpoint": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@hapi/pinpoint/-/pinpoint-1.0.2.tgz", + "integrity": "sha512-dtXC/WkZBfC5vxscazuiJ6iq4j9oNx1SHknmIr8hofarpKUZKmlUVYVIhNVzIEgK5Wrc4GMHL5lZtt1uS2flmQ==", + "dev": true + }, "@hapi/topo": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/@hapi/topo/-/topo-5.0.0.tgz", @@ -4076,6 +4124,51 @@ "mock-fs": "^4.13.0" } }, + "@rollup/plugin-babel": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.0.tgz", + "integrity": "sha512-9uIC8HZOnVLrLHxayq/PTzw+uS25E14KPUBh5ktF+18Mjo5yK0ToMMx6epY0uEgkjwJw0aBW4x2horYXh8juWw==", + "dev": true, + "requires": { + "@babel/helper-module-imports": "^7.10.4", + "@rollup/pluginutils": "^3.1.0" + } + }, + "@rollup/plugin-node-resolve": { + "version": "11.2.1", + "resolved": "https://registry.npmjs.org/@rollup/plugin-node-resolve/-/plugin-node-resolve-11.2.1.tgz", + "integrity": "sha512-yc2n43jcqVyGE2sqV5/YCmocy9ArjVAP/BeXyTtADTBBX6V0e5UMqwO8CdQ0kzjb6zu5P1qMzsScCMRvE9OlVg==", + "dev": true, + "requires": { + "@rollup/pluginutils": "^3.1.0", + "@types/resolve": "1.17.1", + "builtin-modules": "^3.1.0", + "deepmerge": "^4.2.2", + "is-module": "^1.0.0", + "resolve": "^1.19.0" + } + }, + "@rollup/plugin-replace": { + "version": "2.4.2", + "resolved": "https://registry.npmjs.org/@rollup/plugin-replace/-/plugin-replace-2.4.2.tgz", + "integrity": "sha512-IGcu+cydlUMZ5En85jxHH4qj2hta/11BHq95iHEyb2sbgiN0eCdzvUcHw5gt9pBL5lTi4JDYJ1acCoMGpTvEZg==", + "dev": true, + "requires": { + "@rollup/pluginutils": "^3.1.0", + "magic-string": "^0.25.7" + } + }, + "@rollup/pluginutils": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-3.1.0.tgz", + "integrity": "sha512-GksZ6pr6TpIjHm8h9lSQ8pi8BE9VeubNT0OMJ3B5uZJ8pz73NPiqOtCog/x2/QzM1ENChPKxMDhiQuRHsqc+lg==", + "dev": true, + "requires": { + "@types/estree": "0.0.39", + "estree-walker": "^1.0.1", + "picomatch": "^2.2.2" + } + }, "@saleor/macaw-ui": { "version": "0.1.1-9", "resolved": "https://registry.npmjs.org/@saleor/macaw-ui/-/macaw-ui-0.1.1-9.tgz", @@ -4881,6 +4974,16 @@ } } }, + "@surma/rollup-plugin-off-main-thread": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/@surma/rollup-plugin-off-main-thread/-/rollup-plugin-off-main-thread-1.4.2.tgz", + "integrity": "sha512-yBMPqmd1yEJo/280PAMkychuaALyQ9Lkb5q1ck3mjJrFuEobIfhnQ4J3mbvBoISmR3SWMWV+cGB/I0lCQee79A==", + "dev": true, + "requires": { + "ejs": "^2.6.1", + "magic-string": "^0.25.0" + } + }, "@svgr/babel-plugin-add-jsx-attribute": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-4.2.0.tgz", @@ -5120,6 +5223,12 @@ "@types/react": "*" } }, + "@types/estree": { + "version": "0.0.39", + "resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz", + "integrity": "sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==", + "dev": true + }, "@types/faker": { "version": "5.5.1", "resolved": "https://registry.npmjs.org/@types/faker/-/faker-5.5.1.tgz", @@ -5609,6 +5718,15 @@ "@types/react": "*" } }, + "@types/resolve": { + "version": "1.17.1", + "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz", + "integrity": "sha512-yy7HuzQhj0dhGpD8RLXSZWEkLsV9ibvxvi6EiJ3bkqLAO1RGo0WbkWQiwpRlSFymTJRz0d3k5LM3kkx8ArDbLw==", + "dev": true, + "requires": { + "@types/node": "*" + } + }, "@types/responselike": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/@types/responselike/-/responselike-1.0.0.tgz", @@ -8855,6 +8973,12 @@ "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk=", "dev": true }, + "builtin-modules": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-3.2.0.tgz", + "integrity": "sha512-lGzLKcioL90C7wMczpkY0n/oART3MbBa8R9OFGE1rJxoVI86u4WAGfEk8Wjv10eKSyTHVGkSo3bvBylCEtk7LA==", + "dev": true + }, "builtin-status-codes": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz", @@ -11175,6 +11299,12 @@ "integrity": "sha512-b+QLs5vHgS+IoSNcUE4n9HP2NwcHj7aqnJWsjPtuG75Rh5TOaGt0OjAYInh77d5T16V5cRDC+Pw/6ZZZiETBGw==", "dev": true }, + "deepmerge": { + "version": "4.2.2", + "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz", + "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==", + "dev": true + }, "default-gateway": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-4.2.0.tgz", @@ -12847,6 +12977,12 @@ "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==", "dev": true }, + "estree-walker": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-1.0.1.tgz", + "integrity": "sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg==", + "dev": true + }, "esutils": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz", @@ -16271,6 +16407,12 @@ "integrity": "sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==", "dev": true }, + "is-module": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/is-module/-/is-module-1.0.0.tgz", + "integrity": "sha1-Mlj7afeMFNW4FdZkM2tM/7ZEFZE=", + "dev": true + }, "is-negative-zero": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.1.tgz", @@ -19091,6 +19233,15 @@ "integrity": "sha512-H/QHeBIN1fIGJX517pvK8IEK53yQOW7YcEI55oYtgjDdoCQQz7eJS94qt5kNrscReEyuD/JcdFCm2XBEcGOITg==", "dev": true }, + "magic-string": { + "version": "0.25.7", + "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz", + "integrity": "sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA==", + "dev": true, + "requires": { + "sourcemap-codec": "^1.4.4" + } + }, "make-dir": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz", @@ -23257,6 +23408,12 @@ "unicode-match-property-value-ecmascript": "^1.2.0" } }, + "register-service-worker": { + "version": "1.7.2", + "resolved": "https://registry.npmjs.org/register-service-worker/-/register-service-worker-1.7.2.tgz", + "integrity": "sha512-CiD3ZSanZqcMPRhtfct5K9f7i3OLCcBBWsJjLh1gW9RO/nS94sVzY59iS+fgYBOBqaBpf4EzfqUF3j9IG+xo8A==", + "dev": true + }, "registry-auth-token": { "version": "4.2.1", "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-4.2.1.tgz", @@ -24118,6 +24275,105 @@ } } }, + "rollup": { + "version": "2.45.2", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.45.2.tgz", + "integrity": "sha512-kRRU7wXzFHUzBIv0GfoFFIN3m9oteY4uAsKllIpQDId5cfnkWF2J130l+27dzDju0E6MScKiV0ZM5Bw8m4blYQ==", + "dev": true, + "requires": { + "fsevents": "~2.3.1" + }, + "dependencies": { + "fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "optional": true + } + } + }, + "rollup-plugin-terser": { + "version": "7.0.2", + "resolved": "https://registry.npmjs.org/rollup-plugin-terser/-/rollup-plugin-terser-7.0.2.tgz", + "integrity": "sha512-w3iIaU4OxcF52UUXiZNsNeuXIMDvFrr+ZXK6bFZ0Q60qyVfq4uLptoS4bbq3paG3x216eQllFZX7zt6TIImguQ==", + "dev": true, + "requires": { + "@babel/code-frame": "^7.10.4", + "jest-worker": "^26.2.1", + "serialize-javascript": "^4.0.0", + "terser": "^5.0.0" + }, + "dependencies": { + "commander": { + "version": "2.20.3", + "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz", + "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==", + "dev": true + }, + "has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "dev": true + }, + "jest-worker": { + "version": "26.6.2", + "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-26.6.2.tgz", + "integrity": "sha512-KWYVV1c4i+jbMpaBC+U++4Va0cp8OisU185o73T1vo99hqi7w8tSJfUXYswwqqrjzwxa6KpRK54WhPvwf5w6PQ==", + "dev": true, + "requires": { + "@types/node": "*", + "merge-stream": "^2.0.0", + "supports-color": "^7.0.0" + } + }, + "source-map": { + "version": "0.7.3", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz", + "integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==", + "dev": true + }, + "source-map-support": { + "version": "0.5.19", + "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.19.tgz", + "integrity": "sha512-Wonm7zOCIJzBGQdB+thsPar0kYuCIzYvxZwlBa87yi/Mdjv7Tip2cyVbLj5o0cFPN4EVkuTwb3GDDyUx2DGnGw==", + "dev": true, + "requires": { + "buffer-from": "^1.0.0", + "source-map": "^0.6.0" + }, + "dependencies": { + "source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "dev": true + } + } + }, + "supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, + "requires": { + "has-flag": "^4.0.0" + } + }, + "terser": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/terser/-/terser-5.6.1.tgz", + "integrity": "sha512-yv9YLFQQ+3ZqgWCUk+pvNJwgUTdlIxUk1WTN+RnaFJe2L7ipG2csPT0ra2XRm7Cs8cxN7QXmK1rFzEwYEQkzXw==", + "dev": true, + "requires": { + "commander": "^2.20.0", + "source-map": "~0.7.2", + "source-map-support": "~0.5.19" + } + } + } + }, "route-recognizer": { "version": "0.3.4", "resolved": "https://registry.npmjs.org/route-recognizer/-/route-recognizer-0.3.4.tgz", @@ -25103,6 +25359,12 @@ "integrity": "sha512-cPiFOTLUKvJFIg4SKVScy4ilPPW6rFgMgfuZJPNoDuMs3nC1HbMUycBoJw77xFIp6z1UJQJOfx6C9GMH80DiTw==", "dev": true }, + "sourcemap-codec": { + "version": "1.4.8", + "resolved": "https://registry.npmjs.org/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz", + "integrity": "sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==", + "dev": true + }, "space-separated-tokens": { "version": "1.1.5", "resolved": "https://registry.npmjs.org/space-separated-tokens/-/space-separated-tokens-1.1.5.tgz", @@ -25734,23 +25996,6 @@ } } }, - "string_decoder": { - "version": "1.1.1", - "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", - "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", - "dev": true, - "requires": { - "safe-buffer": "~5.1.0" - }, - "dependencies": { - "safe-buffer": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", - "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==", - "dev": true - } - } - }, "stringify-object": { "version": "3.3.0", "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.3.0.tgz", @@ -25782,6 +26027,12 @@ "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz", "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM=" }, + "strip-comments": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/strip-comments/-/strip-comments-2.0.1.tgz", + "integrity": "sha512-ZprKx+bBLXv067WTCALv8SSz5l2+XhpYCsVtSqlMnkAXMWDq+/ekVbl1ghqP9rUHTzv6sm/DwCOiYutU/yp1fw==", + "dev": true + }, "strip-eof": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz", @@ -26101,6 +26352,32 @@ } } }, + "temp-dir": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/temp-dir/-/temp-dir-2.0.0.tgz", + "integrity": "sha512-aoBAniQmmwtcKp/7BzsH8Cxzv8OL736p7v1ihGb5e9DJ9kTwGWHrQrVB5+lfVDzfGrdRzXch+ig7LHaY1JTOrg==", + "dev": true + }, + "tempy": { + "version": "0.6.0", + "resolved": "https://registry.npmjs.org/tempy/-/tempy-0.6.0.tgz", + "integrity": "sha512-G13vtMYPT/J8A4X2SjdtBTphZlrp1gKv6hZiOjw14RCWg6GbHuQBGtjlx75xLbYV/wEc0D7G5K4rxKP/cXk8Bw==", + "dev": true, + "requires": { + "is-stream": "^2.0.0", + "temp-dir": "^2.0.0", + "type-fest": "^0.16.0", + "unique-string": "^2.0.0" + }, + "dependencies": { + "type-fest": { + "version": "0.16.0", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.16.0.tgz", + "integrity": "sha512-eaBzG6MxNzEn9kiwvtre90cXaNLkmadMWa1zQMs3XORCXNbsH/OewwbxC5ia9dCxIxnTAsSxXJaa/p5y8DlvJg==", + "dev": true + } + } + }, "term-size": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/term-size/-/term-size-2.2.1.tgz", @@ -28159,6 +28436,31 @@ "uuid": "^3.3.2" } }, + "webpack-manifest-plugin": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/webpack-manifest-plugin/-/webpack-manifest-plugin-2.2.0.tgz", + "integrity": "sha512-9S6YyKKKh/Oz/eryM1RyLVDVmy3NSPV0JXMRhZ18fJsq+AwGxUY34X54VNwkzYcEmEkDwNxuEOboCZEebJXBAQ==", + "dev": true, + "requires": { + "fs-extra": "^7.0.0", + "lodash": ">=3.5 <5", + "object.entries": "^1.1.0", + "tapable": "^1.0.0" + }, + "dependencies": { + "fs-extra": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-7.0.1.tgz", + "integrity": "sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==", + "dev": true, + "requires": { + "graceful-fs": "^4.1.2", + "jsonfile": "^4.0.0", + "universalify": "^0.1.0" + } + } + } + }, "webpack-sources": { "version": "1.4.3", "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.4.3.tgz", @@ -28430,6 +28732,269 @@ "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==", "dev": true }, + "workbox-background-sync": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-background-sync/-/workbox-background-sync-6.1.5.tgz", + "integrity": "sha512-VbUmPLsdz+sLzuNxHvMylzyRTiM4q+q7rwLBk3p2mtRL5NZozI8j/KgoGbno96vs84jx4b9zCZMEOIKEUTPf6w==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5" + } + }, + "workbox-broadcast-update": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-broadcast-update/-/workbox-broadcast-update-6.1.5.tgz", + "integrity": "sha512-zGrTTs+n4wHpYtqYMqBg6kl/x5j1UrczGCQnODSHTxIDV8GXLb/GtA1BCZdysNxpMmdVSeLmTcgIYAAqWFamrA==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5" + } + }, + "workbox-build": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-build/-/workbox-build-6.1.5.tgz", + "integrity": "sha512-P+fakR5QFVqJN9l9xHVXtmafga72gh9I+jM3A9HiB/6UNRmOAejXnDgD+RMegOHgQHPwnB44TalMToFaXKWIyA==", + "dev": true, + "requires": { + "@babel/core": "^7.11.1", + "@babel/preset-env": "^7.11.0", + "@babel/runtime": "^7.11.2", + "@hapi/joi": "^16.1.8", + "@rollup/plugin-babel": "^5.2.0", + "@rollup/plugin-node-resolve": "^11.2.1", + "@rollup/plugin-replace": "^2.4.1", + "@surma/rollup-plugin-off-main-thread": "^1.4.1", + "common-tags": "^1.8.0", + "fast-json-stable-stringify": "^2.1.0", + "fs-extra": "^9.0.1", + "glob": "^7.1.6", + "lodash": "^4.17.20", + "pretty-bytes": "^5.3.0", + "rollup": "^2.43.1", + "rollup-plugin-terser": "^7.0.0", + "source-map": "^0.8.0-beta.0", + "source-map-url": "^0.4.0", + "stringify-object": "^3.3.0", + "strip-comments": "^2.0.1", + "tempy": "^0.6.0", + "upath": "^1.2.0", + "workbox-background-sync": "^6.1.5", + "workbox-broadcast-update": "^6.1.5", + "workbox-cacheable-response": "^6.1.5", + "workbox-core": "^6.1.5", + "workbox-expiration": "^6.1.5", + "workbox-google-analytics": "^6.1.5", + "workbox-navigation-preload": "^6.1.5", + "workbox-precaching": "^6.1.5", + "workbox-range-requests": "^6.1.5", + "workbox-recipes": "^6.1.5", + "workbox-routing": "^6.1.5", + "workbox-strategies": "^6.1.5", + "workbox-streams": "^6.1.5", + "workbox-sw": "^6.1.5", + "workbox-window": "^6.1.5" + }, + "dependencies": { + "fs-extra": { + "version": "9.1.0", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz", + "integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==", + "dev": true, + "requires": { + "at-least-node": "^1.0.0", + "graceful-fs": "^4.2.0", + "jsonfile": "^6.0.1", + "universalify": "^2.0.0" + } + }, + "glob": { + "version": "7.1.6", + "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz", + "integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==", + "dev": true, + "requires": { + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^3.0.4", + "once": "^1.3.0", + "path-is-absolute": "^1.0.0" + } + }, + "jsonfile": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz", + "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==", + "dev": true, + "requires": { + "graceful-fs": "^4.1.6", + "universalify": "^2.0.0" + } + }, + "source-map": { + "version": "0.8.0-beta.0", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.8.0-beta.0.tgz", + "integrity": "sha512-2ymg6oRBpebeZi9UUNsgQ89bhx01TcTkmNTGnNO88imTmbSgy4nfujrgVEFKWpMTEGA11EDkTt7mqObTPdigIA==", + "dev": true, + "requires": { + "whatwg-url": "^7.0.0" + } + }, + "universalify": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz", + "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==", + "dev": true + }, + "whatwg-url": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.1.0.tgz", + "integrity": "sha512-WUu7Rg1DroM7oQvGWfOiAK21n74Gg+T4elXEQYkOhtyLeWiJFoOGLXPKI/9gzIie9CtwVLm8wtw6YJdKyxSjeg==", + "dev": true, + "requires": { + "lodash.sortby": "^4.7.0", + "tr46": "^1.0.1", + "webidl-conversions": "^4.0.2" + } + } + } + }, + "workbox-cacheable-response": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-cacheable-response/-/workbox-cacheable-response-6.1.5.tgz", + "integrity": "sha512-x8DC71lO/JCgiaJ194l9le8wc8lFPLgUpDkLhp2si7mXV6S/wZO+8Osvw1LLgYa8YYTWGbhbFhFTXIkEMknIIA==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5" + } + }, + "workbox-core": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-core/-/workbox-core-6.1.5.tgz", + "integrity": "sha512-9SOEle7YcJzg3njC0xMSmrPIiFjfsFm9WjwGd5enXmI8Lwk8wLdy63B0nzu5LXoibEmS9k+aWF8EzaKtOWjNSA==", + "dev": true + }, + "workbox-expiration": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-expiration/-/workbox-expiration-6.1.5.tgz", + "integrity": "sha512-6cN+FVbh8fNq56LFKPMchGNKCJeyboHsDuGBqmhDUPvD4uDjsegQpDQzn52VaE0cpywbSIsDF/BSq9E9Yjh5oQ==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5" + } + }, + "workbox-google-analytics": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-google-analytics/-/workbox-google-analytics-6.1.5.tgz", + "integrity": "sha512-LYsJ/VxTkYVLxM1uJKXZLz4cJdemidY7kPyAYtKVZ6EiDG89noASqis75/5lhqM1m3HwQfp2DtoPrelKSpSDBA==", + "dev": true, + "requires": { + "workbox-background-sync": "^6.1.5", + "workbox-core": "^6.1.5", + "workbox-routing": "^6.1.5", + "workbox-strategies": "^6.1.5" + } + }, + "workbox-navigation-preload": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-navigation-preload/-/workbox-navigation-preload-6.1.5.tgz", + "integrity": "sha512-hDbNcWlffv0uvS21jCAC/mYk7NzaGRSWOQXv1p7bj2aONAX5l699D2ZK4D27G8TO0BaLHUmW/1A5CZcsvweQdg==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5" + } + }, + "workbox-precaching": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-precaching/-/workbox-precaching-6.1.5.tgz", + "integrity": "sha512-yhm1kb6wgi141JeM5X7z42XJxCry53tbMLB3NgrxktrZbwbrJF8JILzYy+RFKC9tHC6u2bPmL789GPLT2NCDzw==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5", + "workbox-routing": "^6.1.5", + "workbox-strategies": "^6.1.5" + } + }, + "workbox-range-requests": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-range-requests/-/workbox-range-requests-6.1.5.tgz", + "integrity": "sha512-iACChSapzB0yuIum3ascP/+cfBNuZi5DRrE+u4u5mCHigPlwfSWtlaY+y8p+a8EwcDTVTZVtnrGrRnF31SiLqQ==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5" + } + }, + "workbox-recipes": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-recipes/-/workbox-recipes-6.1.5.tgz", + "integrity": "sha512-MD1yabHca6O/oj1hrRdfj9cRwhKA5zqIE53rWOAg/dKMMzWQsf9nyRbXRgzK3a13iQvYKuQzURU4Cx58tdnR+Q==", + "dev": true, + "requires": { + "workbox-cacheable-response": "^6.1.5", + "workbox-core": "^6.1.5", + "workbox-expiration": "^6.1.5", + "workbox-precaching": "^6.1.5", + "workbox-routing": "^6.1.5", + "workbox-strategies": "^6.1.5" + } + }, + "workbox-routing": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-routing/-/workbox-routing-6.1.5.tgz", + "integrity": "sha512-uC/Ctz+4GXGL42h1WxUNKxqKRik/38uS0NZ6VY/EHqL2F1ObLFqMHUZ4ZYvyQsKdyI82cxusvhJZHOrY0a2fIQ==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5" + } + }, + "workbox-strategies": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-strategies/-/workbox-strategies-6.1.5.tgz", + "integrity": "sha512-QhiOn9KT9YGBdbfWOmJT6pXZOIAxaVrs6J6AMYzRpkUegBTEcv36+ZhE/cfHoT0u2fxVtthHnskOQ/snEzaXQw==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5" + } + }, + "workbox-streams": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-streams/-/workbox-streams-6.1.5.tgz", + "integrity": "sha512-OI1kLvRHGFXV+soDvs6aEwfBwdAkvPB0mRryqdh3/K17qUj/1gRXc8QtpgU+83xqx/I/ar2bTCIj0KPzI/ChCQ==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5", + "workbox-routing": "^6.1.5" + } + }, + "workbox-sw": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-sw/-/workbox-sw-6.1.5.tgz", + "integrity": "sha512-IMDiqxYbKzPorZLGMUMacLB6r76iVQbdTzYthIZoPfy+uFURJFUtqiWQJKg1L+RMyuYXwKXTahCIGkgFs4jBeg==", + "dev": true + }, + "workbox-webpack-plugin": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-webpack-plugin/-/workbox-webpack-plugin-6.1.5.tgz", + "integrity": "sha512-tsgeNAYiFP4STNPDxBVT58eiU8nGUmcv7Lq9FFJkQf5MMu6tPw1OLp+KpszhbCWP+R/nEdu85Gjexs6fY647Kg==", + "dev": true, + "requires": { + "fast-json-stable-stringify": "^2.1.0", + "pretty-bytes": "^5.4.1", + "source-map-url": "^0.4.0", + "upath": "^1.2.0", + "webpack-sources": "^1.4.3", + "workbox-build": "^6.1.5" + } + }, + "workbox-window": { + "version": "6.1.5", + "resolved": "https://registry.npmjs.org/workbox-window/-/workbox-window-6.1.5.tgz", + "integrity": "sha512-akL0X6mAegai2yypnq78RgfazeqvKbsllRtEI4dnbhPcRINEY1NmecFmsQk8SD+zWLK1gw5OdwAOX+zHSRVmeA==", + "dev": true, + "requires": { + "workbox-core": "^6.1.5" + } + }, "worker-farm": { "version": "1.7.0", "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.7.0.tgz", diff --git a/package.json b/package.json index 7bb605e9f..2a95cf266 100644 --- a/package.json +++ b/package.json @@ -169,7 +169,15 @@ "tsconfig-paths-webpack-plugin": "^3.2.0", "webpack": "^4.35.3", "webpack-cli": "^3.3.6", - "webpack-dev-server": "^3.11.0" + "webpack-dev-server": "^3.11.0", + "webpack-manifest-plugin": "2.2.0", + "workbox-cacheable-response": "^6.1.2", + "workbox-expiration": "^6.1.2", + "workbox-precaching": "^6.1.2", + "workbox-routing": "^6.1.2", + "workbox-strategies": "^6.1.2", + "workbox-webpack-plugin": "^6.1.2", + "register-service-worker": "^1.7.2" }, "optionalDependencies": { "fsevents": "^1.2.9" diff --git a/src/config.ts b/src/config.ts index d28d7d027..10b376f9b 100644 --- a/src/config.ts +++ b/src/config.ts @@ -5,6 +5,7 @@ import { ListSettings, ListViews, Pagination } from "./types"; export const APP_MOUNT_URI = process.env.APP_MOUNT_URI; export const APP_DEFAULT_URI = "/"; export const API_URI = process.env.API_URI; +export const SW_INTERVAL = parseInt(process.env.SW_INTERVAL, 0); export const DEFAULT_INITIAL_SEARCH_DATA: SearchVariables = { after: null, diff --git a/src/containers/ServiceWorker/ServiceWorker.tsx b/src/containers/ServiceWorker/ServiceWorker.tsx new file mode 100644 index 000000000..76438367c --- /dev/null +++ b/src/containers/ServiceWorker/ServiceWorker.tsx @@ -0,0 +1,32 @@ +import { SW_INTERVAL } from "@saleor/config"; +import useNotifier from "@saleor/hooks/useNotifier"; +import React from "react"; +import { useIntl } from "react-intl"; +import { useServiceWorker } from "src/hooks/useServiceWorker"; + +import messages from "./messages"; + +const ServiceWorker: React.FC = () => { + const { update, updateAvailable } = useServiceWorker(SW_INTERVAL * 1000); + const notify = useNotifier(); + const { formatMessage } = useIntl(); + + React.useEffect(() => { + if (updateAvailable) { + notify({ + title: formatMessage(messages.newVersionTitle), + text: formatMessage(messages.newVersionContent), + actionBtn: { + label: formatMessage(messages.refresh), + action: update + }, + autohide: null, + status: "warning" + }); + } + }, [updateAvailable]); + + return null; +}; + +export default ServiceWorker; diff --git a/src/containers/ServiceWorker/index.ts b/src/containers/ServiceWorker/index.ts new file mode 100644 index 000000000..334660e68 --- /dev/null +++ b/src/containers/ServiceWorker/index.ts @@ -0,0 +1,2 @@ +export * from "./ServiceWorker"; +export { default } from "./ServiceWorker"; diff --git a/src/containers/ServiceWorker/messages.ts b/src/containers/ServiceWorker/messages.ts new file mode 100644 index 000000000..e8fce975f --- /dev/null +++ b/src/containers/ServiceWorker/messages.ts @@ -0,0 +1,19 @@ +import { defineMessages } from "react-intl"; + +const messages = defineMessages({ + newVersionTitle: { + defaultMessage: "System update required", + description: "notification title" + }, + newVersionContent: { + defaultMessage: + "You need to update Saleor to the newest version. Before doing so - save all changes to prevent loss of data. To update use the button below.", + description: "new version notification content" + }, + refresh: { + defaultMessage: "Refresh", + description: "button" + } +}); + +export default messages; diff --git a/src/hooks/useServiceWorker.ts b/src/hooks/useServiceWorker.ts new file mode 100644 index 000000000..414e896f8 --- /dev/null +++ b/src/hooks/useServiceWorker.ts @@ -0,0 +1,37 @@ +import { useCallback, useEffect, useRef, useState } from "react"; +import { register } from "register-service-worker"; + +export const useServiceWorker = (timeout: number) => { + const [updateAvailable, setUpdateAvailable] = useState(false); + const registrationRef = useRef(); + + useEffect(() => { + const interval = (setInterval(() => { + if (registrationRef.current) { + registrationRef.current.update(); + } + }, timeout) as unknown) as number; + return () => clearInterval(interval); + }, [timeout]); + + const onRegistered = (registration: ServiceWorkerRegistration) => { + registrationRef.current = registration; + }; + + const onUpdateFound = () => setUpdateAvailable(true); + + const update = useCallback(() => { + if (updateAvailable) { + registrationRef.current.waiting.postMessage("update"); + } + }, [updateAvailable]); + + useEffect(() => { + register("/sw.js", { + registered: onRegistered, + updatefound: onUpdateFound + }); + }, []); + + return { update, updateAvailable }; +}; diff --git a/src/index.tsx b/src/index.tsx index 13edb0f0a..ca36d9d1a 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -40,6 +40,7 @@ import { API_URI, APP_MOUNT_URI, GTM_ID } from "./config"; import ConfigurationSection, { createConfigurationMenu } from "./configuration"; import AppStateProvider from "./containers/AppState"; import BackgroundTasksProvider from "./containers/BackgroundTasks"; +import ServiceWorker from "./containers/ServiceWorker/ServiceWorker"; import { CustomerSection } from "./customers"; import DiscountSection from "./discounts"; import HomePage from "./home"; @@ -113,6 +114,7 @@ const App: React.FC = () => { + diff --git a/src/sw.js b/src/sw.js new file mode 100644 index 000000000..1f2f835e1 --- /dev/null +++ b/src/sw.js @@ -0,0 +1,76 @@ +/* eslint-disable @typescript-eslint/no-var-requires */ +/* eslint-disable no-restricted-globals */ +const { + CacheableResponsePlugin +} = require("workbox-cacheable-response/CacheableResponsePlugin"); +const { ExpirationPlugin } = require("workbox-expiration/ExpirationPlugin"); +const { precacheAndRoute } = require("workbox-precaching/precacheAndRoute"); +const { registerRoute } = require("workbox-routing/registerRoute"); +const { CacheFirst } = require("workbox-strategies/CacheFirst"); +const { + StaleWhileRevalidate +} = require("workbox-strategies/StaleWhileRevalidate"); + +precacheAndRoute(self.__WB_MANIFEST); + +registerRoute( + /\.(?:png|gif|jpg|jpeg|webp|svg)$/, + new CacheFirst({ + cacheName: "images", + plugins: [ + new ExpirationPlugin({ + maxEntries: 60, + maxAgeSeconds: 30 * 24 * 60 * 60 // 30 Days + }) + ] + }) +); + +const registerFontStyles = (match, name) => { + registerRoute( + match, + new StaleWhileRevalidate({ + cacheName: name + }) + ); +}; + +const registerFont = (match, name) => { + registerRoute( + match, + new CacheFirst({ + cacheName: name, + plugins: [ + new CacheableResponsePlugin({ + statuses: [0, 200] + }), + new ExpirationPlugin({ + maxAgeSeconds: 60 * 60 * 24 * 365, + maxEntries: 30 + }) + ] + }) + ); +}; + +registerFontStyles( + /^https:\/\/fonts\.googleapis\.com/, + "google-fonts-stylesheets" +); +registerFontStyles(/^https:\/\/rsms\.me\/.+\/.+\.css/, "rsms-stylesheet"); + +registerFont(/^https:\/\/fonts\.gstatic\.com/, "google-fonts-webfonts"); +registerFont(/^https:\/\/rsms\.me\/.+\/font-files.+/, "rsms-webfonts"); + +self.addEventListener("message", event => { + if (event.data === "update") { + self.skipWaiting(); + } +}); + +self.addEventListener("activate", async () => { + const tabs = await self.clients.matchAll({ type: "window" }); + tabs.forEach(tab => { + tab.navigate(tab.url); + }); +}); diff --git a/webpack.config.js b/webpack.config.js index 76d82a804..04b6db9f9 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -4,6 +4,7 @@ const CheckerPlugin = require("fork-ts-checker-webpack-plugin"); const webpack = require("webpack"); const TsconfigPathsPlugin = require("tsconfig-paths-webpack-plugin"); const HtmlWebpackPlugin = require("html-webpack-plugin"); +const { InjectManifest } = require("workbox-webpack-plugin"); const SentryWebpackPlugin = require("@sentry/webpack-plugin"); require("dotenv").config(); @@ -29,7 +30,8 @@ const environmentPlugin = new webpack.EnvironmentPlugin({ DEMO_MODE: false, ENVIRONMENT: "", GTM_ID: "", - SENTRY_DSN: "" + SENTRY_DSN: "", + SW_INTERVAL: "300" // Fetch SW every 300 seconds }); const dashboardBuildPath = "build/dashboard/"; @@ -78,6 +80,16 @@ module.exports = (env, argv) => { }); } + let manifestPlugin; + if (!devMode) { + manifestPlugin = new InjectManifest({ + swSrc: "./src/sw.js", + swDest: "sw.js", + maximumFileSizeToCacheInBytes: 5000000, + webpackCompilationPlugins: [checkerPlugin] + }); + } + return { devServer: { compress: true, @@ -122,7 +134,8 @@ module.exports = (env, argv) => { checkerPlugin, environmentPlugin, htmlWebpackPlugin, - sentryPlugin + sentryPlugin, + manifestPlugin ].filter(Boolean), resolve: { extensions: [".js", ".jsx", ".ts", ".tsx"],