using webworker on web app for wallet opening

ng-app/src/lib/Login.svelte

@@ -118,6 +118,7 @@
 
     // open the wallet
     try {
+      if (tauri_platform) {
         let secret_wallet = await ng.wallet_open_wallet_with_pazzle(
           wallet,
           pazzle,
@@ -128,6 +129,27 @@
           wallet: secret_wallet,
           id: secret_wallet.V0.wallet_id,
         });
+      } else {
+        let worker_file = await import("../worker.js?worker");
+        const myWorker = new worker_file.default();
+        myWorker.postMessage({ wallet, pazzle, pin_code });
+
+        myWorker.onmessage = (msg) => {
+          //console.log("Message received from worker", msg.data);
+          if (msg.data.success) {
+            step = "end";
+            dispatch("opened", {
+              wallet: msg.data.success,
+              id: msg.data.success.V0.wallet_id,
+            });
+          } else {
+            console.error(msg.data.error);
+            error = msg.data.error;
+            step = "end";
+            dispatch("error", { error: msg.data.error });
+          }
+        };
+      }
     } catch (e) {
       console.error(e);
       error = e;

ng-app/src/worker.js

@@ -0,0 +1,21 @@
+import {
+    default as ng,
+  } from "./api";
+
+  onmessage = (e) => {
+    //console.log("Message received by worker", e.data);
+    (async function() {
+      try {
+        let secret_wallet = await ng.wallet_open_wallet_with_pazzle(
+            e.data.wallet,
+            e.data.pazzle,
+            e.data.pin_code
+        );
+        postMessage({success:secret_wallet});
+      } catch (e) {
+        postMessage({error:e});
+      }
+    })();
+  };
+
+  

ng-app/vite.config.ts

@@ -11,6 +11,13 @@ import topLevelAwait from "vite-plugin-top-level-await";
 export default defineConfig(async () => {
   const host = await internalIpV4()
   const config = {
+  worker: {
+    format: 'es',
+    plugins : [
+      wasm(),
+      topLevelAwait(),
+    ]
+  },
   plugins: [
     wasm(),
     topLevelAwait(),
@@ -71,6 +78,9 @@ export default defineConfig(async () => {
     sourcemap: !!process.env.TAURI_DEBUG,
   }
 }
-if (process.env.NG_APP_FILE) config.plugins.push(viteSingleFile());
+if (process.env.NG_APP_FILE) {
+  config.plugins.push(viteSingleFile());
+  config.worker.plugins.push(viteSingleFile());
+}
 return config
 })

ngaccount/web/src/routes/Create.svelte

@@ -180,8 +180,8 @@
         <div class=" max-w-6xl lg:px-8 mx-auto px-4">
           <p class="max-w-xl md:mx-auto lg:max-w-2xl">
             You would like to choose <b>{domain}</b> as your Broker Service
-            Provider.<br />Please read carefully the Terms of Service here
-            below, before accepting them.
+            Provider.<br />Please read carefully the Terms of Service below,
+            before accepting them.
           </p>
         </div>
       {/if}