Fix returned type of js vm

3loop · Apr 1, 2024 · 72edbd6 · 72edbd6
1 parent 21f2d85
commit 72edbd6
Show file tree

Hide file tree

Showing 4 changed files with 59 additions and 26 deletions.
diff --git a/apps/web/src/app/contract/[contract]/table.tsx b/apps/web/src/app/contract/[contract]/table.tsx
@@ -10,7 +10,11 @@ import {
 } from "@/components/ui/table";
 import React from "react";
 import { DecodedTx, Interpreter } from "@3loop/transaction-decoder";
-import { findAndRunInterpreter, defaultInterpreters } from "@/lib/interpreter";
+import {
+  findAndRunInterpreter,
+  defaultInterpreters,
+  Interpretation,
+} from "@/lib/interpreter";
 
 function getAvaliableinterpreters() {
   if (typeof window === "undefined") return undefined;
@@ -35,12 +39,7 @@ function getAvaliableinterpreters() {
 }
 
 export default function TxTable({ txs }: { txs: DecodedTx[] }) {
-  const [result, setResult] = React.useState<
-    {
-      tx: DecodedTx;
-      interpretation: any;
-    }[]
-  >([]);
+  const [result, setResult] = React.useState<Interpretation[]>([]);
   const [interpreters] = React.useState(getAvaliableinterpreters);
 
   React.useEffect(() => {
@@ -53,6 +52,8 @@ export default function TxTable({ txs }: { txs: DecodedTx[] }) {
         }),
       );
 
+      console.log(withIntepretations[0]);
+
       setResult(withIntepretations);
     }
     run();

diff --git a/apps/web/src/app/tx/[chainID]/[hash]/form.tsx b/apps/web/src/app/tx/[chainID]/[hash]/form.tsx
@@ -9,7 +9,7 @@ import { Input } from "@/components/ui/input";
 import { Button } from "@/components/ui/button";
 import { useRouter } from "next/navigation";
 import { DecodedTx, Interpreter } from "@3loop/transaction-decoder";
-import { interpretTx } from "@/lib/interpreter";
+import { Interpretation, interpretTx } from "@/lib/interpreter";
 import CodeBlock from "@/components/ui/code-block";
 import { NetworkSelect } from "@/components/ui/network-select";
 
@@ -33,10 +33,10 @@ export default function DecodingForm({
   currentHash,
   currentChainID,
 }: FormProps) {
-  const [result, setResult] = React.useState<string>();
+  const [result, setResult] = React.useState<Interpretation>();
   const [schema, setSchema] = useLocalStorage(
     defaultInterpreter?.id ?? "unknown",
-    defaultInterpreter?.schema
+    defaultInterpreter?.schema,
   );
 
   const router = useRouter();
@@ -60,6 +60,18 @@ export default function DecodingForm({
     }
   }, [schema, decoded, defaultInterpreter]);
 
+  // Run the interpreter on page load
+  React.useEffect(() => {
+    if (
+      schema &&
+      defaultInterpreter != null &&
+      decoded != null &&
+      result == null
+    ) {
+      onRun();
+    }
+  }, [schema, decoded, defaultInterpreter, result, onRun]);
+
   return (
     <div className="grid h-full items-stretch gap-6 md:grid-cols-[1fr_200px]">
       <div className="md:order-1 flex flex-col space-y-4">
@@ -109,9 +121,14 @@ export default function DecodingForm({
             <div className="flex flex-row justify-between items-center">
               <Label>Result:</Label>
             </div>
+
             <CodeBlock
               language="json"
-              value={JSON.stringify(result, null, 2)}
+              value={
+                result?.error
+                  ? result?.error
+                  : JSON.stringify(result?.interpretation, null, 2)
+              }
               readonly={true}
               lineNumbers={false}
             />

diff --git a/apps/web/src/lib/interpreter.ts b/apps/web/src/lib/interpreter.ts
@@ -5,9 +5,15 @@ import {
   DecodedTx,
 } from "@3loop/transaction-decoder";
 
+export interface Interpretation {
+  tx: DecodedTx;
+  interpretation: any;
+  error?: string;
+}
+
 export const emptyInterpreter: Interpreter = {
   id: "default",
-  code: `
+  schema: `
   function transformEvent(event){
     return event;
 };
@@ -28,6 +34,7 @@ function transformEvent(event) {
         user: event.fromAddress,
         method: methodName,
         assetsSent: event.assetsSent,
+        assetsReceived: event?.assetsReceived
     }
 
     switch (methodName) {
@@ -58,29 +65,37 @@ function transformEvent(event) {
 
 export async function interpretTx(
   decodedTx: DecodedTx,
-  interpreter: Interpreter
-) {
-  const res = await applyInterpreter({ decodedTx, interpreter });
-  return res;
+  interpreter: Interpreter,
+): Promise<Interpretation> {
+  try {
+    const res = await applyInterpreter({ decodedTx, interpreter });
+    return {
+      tx: decodedTx,
+      interpretation: res,
+    };
+  } catch (e) {
+    return {
+      tx: decodedTx,
+      interpretation: undefined,
+      error: (e as Error).message,
+    };
+  }
 }
 
 export async function findAndRunInterpreter(
   decodedTx: DecodedTx,
-  interpreters: Interpreter[]
-) {
+  interpreters: Interpreter[],
+): Promise<Interpretation> {
   const interpreter = findInterpreter({ decodedTx, interpreters });
 
   if (!interpreter) {
     return {
       tx: decodedTx,
-      interpretation: decodedTx,
+      interpretation: undefined,
     };
   }
 
-  const res = await applyInterpreter({ decodedTx, interpreter });
+  const res = await interpretTx(decodedTx, interpreter);
 
-  return {
-    tx: decodedTx,
-    interpretation: res,
-  };
+  return res;
 }
diff --git a/packages/transaction-decoder/src/interpreters/vm.ts b/packages/transaction-decoder/src/interpreters/vm.ts
@@ -1,6 +1,6 @@
-import { getQuickJS, shouldInterruptAfterDeadline } from 'quickjs-emscripten'
+import { getQuickJS, QuickJSContext, shouldInterruptAfterDeadline } from 'quickjs-emscripten'
 
-export default async function makeVM(timeout = -1) {
+export default async function makeVM(timeout = -1): Promise<QuickJSContext> {
     const QuickJS = await getQuickJS()
     const vm = QuickJS.newContext()
     if (timeout !== -1) {