From b1e90c74f7f9ccdbae7a49f2fa866eaf97f9cb75 Mon Sep 17 00:00:00 2001
From: Mitchell McCaffrey <mitchemmc@gmail.com>
Date: Tue, 16 Mar 2021 17:49:50 +1100
Subject: [PATCH] Added worker implementation of database put

---
 src/contexts/MapDataContext.js | 13 +++++++++++--
 src/workers/DatabaseWorker.js  | 23 ++++++++++++++++++++++-
 2 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/src/contexts/MapDataContext.js b/src/contexts/MapDataContext.js
index a714be3..b00cf6c 100644
--- a/src/contexts/MapDataContext.js
+++ b/src/contexts/MapDataContext.js
@@ -6,7 +6,7 @@ import React, {
   useRef,
 } from "react";
 import * as Comlink from "comlink";
-import { decode } from "@msgpack/msgpack";
+import { decode, encode } from "@msgpack/msgpack";
 
 import { useAuth } from "./AuthContext";
 import { useDatabase } from "./DatabaseContext";
@@ -218,7 +218,16 @@ export function MapDataProvider({ children }) {
    */
   const putMap = useCallback(
     async (map) => {
-      await database.table("maps").put(map);
+      // Attempt to use worker to put map to avoid UI lockup
+      const packedMap = encode(map);
+      const success = await worker.putData(
+        Comlink.transfer(packedMap, [packedMap.buffer]),
+        "maps",
+        false
+      );
+      if (!success) {
+        await database.table("maps").put(map);
+      }
       if (map.owner !== userId) {
         await updateCache();
       }
diff --git a/src/workers/DatabaseWorker.js b/src/workers/DatabaseWorker.js
index dba2aca..044329d 100644
--- a/src/workers/DatabaseWorker.js
+++ b/src/workers/DatabaseWorker.js
@@ -4,7 +4,7 @@ import {
   exportDB,
   peakImportFile,
 } from "@mitchemmc/dexie-export-import";
-import { encode } from "@msgpack/msgpack";
+import { encode, decode } from "@msgpack/msgpack";
 
 import { getDatabase } from "../database";
 
@@ -46,6 +46,27 @@ let service = {
     } catch {}
   },
 
+  /**
+   * Put data into table encoded by msgpack
+   * @param {Uint8Array} data
+   * @param {string} table
+   * @param {boolean} wait Whether to wait for the put to finish
+   */
+  async putData(data, table, wait = true) {
+    try {
+      let db = getDatabase({});
+      const decoded = decode(data);
+      if (wait) {
+        await db.table(table).put(decoded);
+      } else {
+        db.table(table).put(decoded);
+      }
+      return true;
+    } catch {
+      return false;
+    }
+  },
+
   /**
    * Export current database
    * @param {function} progressCallback