Improve service worker (#1353)

* Improve service worker

 - Add new env variable in WebPack "NODE_ENV"
 - Add new service worker for mode dev that permit to by pass response in cache storage
 - Add new WorkAdventure icon

* Remove console.log

* Add service worker file prod and dev

front/dist/service-worker-dev.js

@@ -0,0 +1,39 @@
+let CACHE_NAME = 'workavdenture-cache-v1';
+let urlsToCache = [
+    '/'
+];
+
+self.addEventListener('install', function(event) {
+    // Perform install steps
+    event.waitUntil(
+        caches.open(CACHE_NAME)
+            .then((cache) => {
+                return cache.addAll(urlsToCache);
+            })
+    );
+});
+
+self.addEventListener('fetch', (event) => {
+    event.respondWith(
+        caches.match(event.request)
+            .then((response) => {
+                return fetch(event.request).then((response) => {
+                        //Dev service worker, just return reponse
+                        return response;
+                    }
+                );
+            })
+    );
+});
+
+self.addEventListener('wait', function(event) {
+    //TODO wait
+});
+
+self.addEventListener('update', function(event) {
+    //TODO update
+});
+
+self.addEventListener('beforeinstallprompt', (e) => {
+    //TODO change prompt
+});

front/src/Enum/EnvironmentVariable.ts

@@ -17,6 +17,7 @@ const MAX_EXTRAPOLATION_TIME = 100; // Extrapolate a maximum of 250ms if no new
 export const MAX_USERNAME_LENGTH = parseInt(process.env.MAX_USERNAME_LENGTH || "") || 8;
 export const MAX_PER_GROUP = parseInt(process.env.MAX_PER_GROUP || "4");
 export const DISPLAY_TERMS_OF_USE = process.env.DISPLAY_TERMS_OF_USE == "true";
+export const NODE_ENV = process.env.NODE_ENV || "development";
 
 export const isMobile = (): boolean => window.innerWidth <= 800 || window.innerHeight <= 600;
 

front/src/Network/ServiceWorker.ts

@@ -1,3 +1,5 @@
+import { NODE_ENV } from "../Enum/EnvironmentVariable";
+
 export class _ServiceWorker {
     constructor() {
         if ("serviceWorker" in navigator) {
@@ -6,8 +8,19 @@ export class _ServiceWorker {
     }
 
     init() {
+        if (NODE_ENV === "development") {
+            navigator.serviceWorker
+                .register("/service-worker-dev.js")
+                .then((serviceWorker) => {
+                    console.info("Service Worker registered: ", serviceWorker);
+                })
+                .catch((error) => {
+                    console.error("Error registering the Service Worker: ", error);
+                });
+            return;
+        }
         navigator.serviceWorker
-            .register("/service-worker.js")
+            .register("/service-worker-prod.js")
             .then((serviceWorker) => {
                 console.info("Service Worker registered: ", serviceWorker);
             })

front/webpack.config.ts

@@ -201,6 +201,7 @@ module.exports = {
             MAX_USERNAME_LENGTH: 8,
             MAX_PER_GROUP: 4,
             DISPLAY_TERMS_OF_USE: false,
+            NODE_ENV: "development",
         }),
     ],
 } as Configuration & WebpackDevServer.Configuration;