From b6ede385caa7cde70267e416ba278f4d5e7be173 Mon Sep 17 00:00:00 2001
From: dm1sh <me@dmitriy.icu>
Date: Sun, 1 Aug 2021 13:47:52 +0300
Subject: [PATCH] Started react app integration with service worker. Uploading
 book to server now also saves result to indexedDB

---
 src/constants.ts                   |  8 ++++----
 src/registerServiceWorker.ts       |  2 +-
 src/serviceWorker/fetchHandlers.ts |  2 +-
 src/serviceWorker/index.ts         | 28 +++++++++++++++++-----------
 4 files changed, 23 insertions(+), 17 deletions(-)

diff --git a/src/constants.ts b/src/constants.ts
index d4cd177..d48c442 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -1,5 +1,5 @@
-export const API_URL = process.env.PUBLIC_API_URL;
-// export const BASE_URL = process.env.PUBLIC_BASE_URL;
-export const CACHE = "v1";
+export const API_URL = process.env.PUBLIC_API_URL || "";
+export const BASE_URL = process.env.PUBLIC_BASE_URL || "";
+export const CACHE = "v1.0.1";
 export const DB_NAME = "publite";
-export const DB_VERSION = 1;
+export const DB_VERSION = 101;
diff --git a/src/registerServiceWorker.ts b/src/registerServiceWorker.ts
index e6b6aef..05ff16e 100644
--- a/src/registerServiceWorker.ts
+++ b/src/registerServiceWorker.ts
@@ -2,7 +2,7 @@ export const register = () => {
   if ("serviceWorker" in navigator) {
     window.addEventListener("load", () =>
       navigator.serviceWorker
-        .register("/sw.js")
+        .register("/sw.js", { scope: "" })
         .then((registration) => {
           if (process.env.NODE_ENV === "development")
             console.log(
diff --git a/src/serviceWorker/fetchHandlers.ts b/src/serviceWorker/fetchHandlers.ts
index 4f41785..4e6c316 100644
--- a/src/serviceWorker/fetchHandlers.ts
+++ b/src/serviceWorker/fetchHandlers.ts
@@ -28,7 +28,7 @@ export const handleBookUpload = async (request: Request) => {
     if (res.ok) {
       const book = await res.json();
       await saveBook(book);
-      return new Response(book);
+      return new Response(JSON.stringify(book));
     } else throw new Error(res.status.toString() + res.statusText);
   } catch (err) {
     return new Response(JSON.stringify(err));
diff --git a/src/serviceWorker/index.ts b/src/serviceWorker/index.ts
index e48cfd2..1707290 100644
--- a/src/serviceWorker/index.ts
+++ b/src/serviceWorker/index.ts
@@ -1,3 +1,4 @@
+import { API_URL } from "~/constants";
 import { fromCache, precache } from "./cache";
 import { openDB as createDB } from "./db";
 import {
@@ -11,23 +12,28 @@ import { getHash } from "./utils";
 
 declare const self: ServiceWorkerGlobalScope;
 
-self.addEventListener("install", (event) => {
-  self.skipWaiting();
-  event.waitUntil(precache());
-});
+self.addEventListener("install", (event) => event.waitUntil(precache()));
 
-self.addEventListener("activate", (event) => event.waitUntil(createDB()));
+self.addEventListener("activate", (event) => {
+  self.clients.claim();
+  event.waitUntil(createDB());
+});
 
 self.addEventListener("fetch", (event) => {
   const { request } = event;
   const path = new URL(request.url).pathname;
 
-  const handlers: PathHandler[] = [
-    { path: "/list", getResponse: () => handleBooks() },
-    { path: "/book/", getResponse: () => handleBook(request, getHash(path)) },
-    { path: "/upload", getResponse: () => handleBookUpload(request) },
-    { path: "", getResponse: () => fromCache(request) },
-  ];
+  let handlers: PathHandler[];
+
+  if (request.url.startsWith(API_URL)) {
+    handlers = [
+      { path: "/list", getResponse: () => handleBooks() },
+      { path: "/book/", getResponse: () => handleBook(request, getHash(path)) },
+      { path: "/uploadfile", getResponse: () => handleBookUpload(request) },
+    ];
+  } else {
+    handlers = [{ path: "", getResponse: () => fromCache(request) }];
+  }
 
   event.respondWith(handle(path, handlers));
 });