From 84b3dcc4bfa6ec4e9a4a26ec5a38bb8b35a97fa9 Mon Sep 17 00:00:00 2001
From: ymekuria <ymekuria@gmail.com>
Date: Thu, 19 Sep 2024 12:46:22 -0700
Subject: [PATCH] feat(zkappWorkerClient.ts): initialize worker client and wrap
 with comlink in constructor

---
 .../ui/src/pages/zkappWorkerClient.ts           | 17 +++++++----------
 1 file changed, 7 insertions(+), 10 deletions(-)

diff --git a/examples/zkapps/04-zkapp-browser-ui/ui/src/pages/zkappWorkerClient.ts b/examples/zkapps/04-zkapp-browser-ui/ui/src/pages/zkappWorkerClient.ts
index 6f3c9fc45..adff33488 100644
--- a/examples/zkapps/04-zkapp-browser-ui/ui/src/pages/zkappWorkerClient.ts
+++ b/examples/zkapps/04-zkapp-browser-ui/ui/src/pages/zkappWorkerClient.ts
@@ -13,6 +13,13 @@ export default class ZkappWorkerClient {
   // Proxy to interact with the worker's methods as if they were local
   remoteApi: Comlink.Remote<typeof import('./zkappWorker').api>;
 
+  constructor() {
+    // Initialize the worker from the zkappWorker module
+    const worker = new Worker(new URL('./zkappWorker.ts', import.meta.url), { type: 'module' });
+    // Wrap the worker with Comlink to enable direct method invocation
+    this.remoteApi = Comlink.wrap(worker);
+  }
+
   setActiveInstanceToDevnet() {
     return this._call('setActiveInstanceToDevnet', {});
   }
@@ -70,16 +77,6 @@ export default class ZkappWorkerClient {
 
   nextId: number;
 
-  constructor() {
-    this.worker = new Worker(new URL('./zkappWorker.ts', import.meta.url));
-    this.promises = {};
-    this.nextId = 0;
-
-    this.worker.onmessage = (event: MessageEvent<ZkappWorkerReponse>) => {
-      this.promises[event.data.id].resolve(event.data.data);
-      delete this.promises[event.data.id];
-    };
-  }
 
   _call(fn: WorkerFunctions, args: any) {
     return new Promise((resolve, reject) => {