feat: store uploading status for each picture

betagouv · Oct 9, 2024 · ed3b66a · ed3b66a
1 parent c4ae88d
commit ed3b66a
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 23 deletions.
diff --git a/packages/frontend/src/envVars.ts b/packages/frontend/src/envVars.ts
@@ -11,12 +11,12 @@ const isSW = typeof window === "undefined";
 console.log("isSW", isSW);
 console.log("isDev", isDev);
 
-const safeParseEnv = (env: Record<string, string>) => {
+const safeParseEnv = (env: Record<string, string>): z.infer<typeof envSchema> => {
   try {
     return envSchema.parse(env);
   } catch (e) {
-    console.error("Error parsing env", e);
-    return {};
+    console.error("Error parsing env vars");
+    return {} as any;
   }
 };
 

diff --git a/packages/frontend/src/features/idb.ts b/packages/frontend/src/features/idb.ts
@@ -2,6 +2,7 @@ import { createStore } from "idb-keyval";
 
 export const getPicturesStore = () => createStore("toSync", "images");
 export const getToUploadStore = () => createStore("toUpload", "images");
+export const getUploadStatusStore = () => createStore("uploadStatus", "images");
 
 export const syncImages = async () => {
   console.log("sync");

diff --git a/packages/frontend/src/service-worker/sw.ts b/packages/frontend/src/service-worker/sw.ts
@@ -1,7 +1,7 @@
 import { precacheAndRoute } from "workbox-precaching";
 import { apiStore, createApiClientWithUrl, getTokenFromIdb } from "../api";
-import { getPicturesStore, getToUploadStore } from "../features/idb";
-import { get, keys, del } from "idb-keyval";
+import { getPicturesStore, getToUploadStore, getUploadStatusStore } from "../features/idb";
+import { get, keys, del, set } from "idb-keyval";
 
 declare let self: ServiceWorkerGlobalScope;
 
@@ -48,29 +48,38 @@ const syncPicturesById = async (ids: string[], token: string) => {
   const api = createApiClientWithUrl(url);
 
   for (const picId of missingIds) {
-    const reportId = await get(picId, toUploadStore);
+    try {
+      await set(picId, "uploading", getUploadStatusStore());
 
-    console.log("syncing picture", picId);
-    const buffer = await get(picId, store);
-    if (!buffer) {
-      console.log("missing buffer for id", picId);
-      continue;
-    }
+      const reportId = await get(picId, toUploadStore);
+
+      console.log("syncing picture", picId);
+      const buffer = await get(picId, store);
+      if (!buffer) {
+        console.log("missing buffer for id", picId);
+        continue;
+      }
 
-    const formData = new FormData();
-    formData.append("file", new Blob([buffer]), "file");
-    formData.append("reportId", reportId);
-    formData.append("pictureId", picId);
+      const formData = new FormData();
+      formData.append("file", new Blob([buffer]), "file");
+      formData.append("reportId", reportId);
+      formData.append("pictureId", picId);
 
-    await api.post("/api/upload/image", {
-      body: formData,
-      query: { reportId: reportId, id: picId },
-      header: { Authorization: `Bearer ${token}` },
-    } as any);
+      await api.post("/api/upload/image", {
+        body: formData,
+        query: { reportId: reportId, id: picId },
+        header: { Authorization: `Bearer ${token}` },
+      } as any);
 
-    await del(picId, toUploadStore);
+      await del(picId, toUploadStore);
 
-    console.log("done");
+      await set(picId, "success", getUploadStatusStore());
+
+      console.log("done");
+    } catch (e) {
+      await set(picId, "error", getUploadStatusStore());
+      throw e;
+    }
   }
 };