Change instructions to 64-bit set

package.json

@@ -29,8 +29,8 @@
     "@reduxjs/toolkit": "^2.2.8",
     "@tanstack/react-virtual": "^3.10.9",
     "@typeberry/block": "^0.0.1-1a02906",
-    "@typeberry/pvm-debugger-adapter": "0.0.1-3eb6bed",
-    "@typeberry/spectool-wasm": "^0.13.0",
+    "@typeberry/pvm-debugger-adapter": "0.1.0-dc28f3f",
+    "@typeberry/spectool-wasm": "0.18.0",
     "@uiw/react-codemirror": "^4.23.6",
     "class-variance-authority": "^0.7.0",
     "classnames": "^2.5.1",

src/components/Instructions/utils.tsx

@@ -8,7 +8,7 @@ export const valueToNumeralSystem = (
   withPrefix: boolean = true,
 ): string => {
   const stringValue =
-    typeof value === "bigint" ? BigInt.asUintN(32, value).toString(16) : ((value ?? 0) >>> 0).toString(16);
+    typeof value === "bigint" ? BigInt.asUintN(64, value).toString(16) : ((value ?? 0) >>> 0).toString(16);
 
   return numeralSystem === NumeralSystem.HEXADECIMAL
     ? `${withPrefix ? "0x" : ""}${stringValue.padStart(padStartVal, "0")}`

src/components/KnowledgeBase/index.tsx

@@ -63,14 +63,16 @@ export const KnowledgeBase = ({ currentInstruction }: { currentInstruction: Curr
               </div>
               <p className="my-3">{currentInstructionFromKnowledgeBase?.description}</p>
               <div className="flex mb-3 mr-3 justify-end">
-                <Button
-                  size={"sm"}
-                  onClick={() => {
-                    window.open(currentInstructionFromKnowledgeBase?.linkInGrayPaperReader, "_blank");
-                  }}
-                >
-                  Open in GP
-                </Button>
+                {currentInstructionFromKnowledgeBase?.linkInGrayPaperReader && (
+                  <Button
+                    size={"sm"}
+                    onClick={() => {
+                      window.open(currentInstructionFromKnowledgeBase?.linkInGrayPaperReader, "_blank");
+                    }}
+                  >
+                    Open in GP
+                  </Button>
+                )}
               </div>
             </div>
           );

src/components/NumeralSystemSwitch/index.tsx

@@ -5,13 +5,14 @@ import { NumeralSystemContext } from "@/context/NumeralSystemContext";
 import { NumeralSystem } from "@/context/NumeralSystem";
 
 export const NumeralSystemSwitch = ({ className }: { className: string }) => {
-  const { setNumeralSystem } = useContext(NumeralSystemContext);
+  const { setNumeralSystem, numeralSystem } = useContext(NumeralSystemContext);
 
   return (
     <div className={`flex items-center space-x-2 ${className}`}>
       <Label htmlFor="numerical-system-mode">DEC</Label>
       <Switch
         id="numerical-system-mode"
+        checked={numeralSystem === NumeralSystem.HEXADECIMAL}
         onCheckedChange={(checked) => setNumeralSystem(checked ? NumeralSystem.HEXADECIMAL : NumeralSystem.DECIMAL)}
       />
       <Label htmlFor="numerical-system-mode">HEX</Label>

src/components/ProgramLoader/Assembly.tsx

@@ -37,6 +37,7 @@ function assemblyFromInputProgram(initialState: InitialState, program: number[])
   if (program.length === 0) {
     return DEFAULT_ASSEMBLY;
   }
+
   try {
     const raw = disassemble(new Uint8Array(program));
     const lines = raw.split("\n");
@@ -71,7 +72,7 @@ function assemblyFromInputProgram(initialState: InitialState, program: number[])
     // now append initial registers
     const registers: string[] = [];
     for (const [idx, reg] of (initialState.regs ?? []).entries()) {
-      if (reg !== 0) {
+      if (BigInt(reg) !== 0n) {
         registers.push(`pre: r${idx} = ${reg}`);
       }
     }
@@ -131,7 +132,9 @@ export const Assembly = ({
         }
         // we want to keep all of the old stuff to avoid re-rendering.
         output.initial = newInitialState;
-        onProgramLoad(output);
+        // TODO [ToDr] Assembly for 64-bit is temporarily broken, so we don't trigger
+        // the `onProgramLoad` here.
+        // onProgramLoad(output);
         setError(undefined);
       } catch (e) {
         if (e instanceof Error) {
@@ -149,8 +152,7 @@ export const Assembly = ({
         setError(`${e}`);
       }
     },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [onProgramLoad, program],
+    [onProgramLoad, program, initialState],
   );
 
   const [error, setError] = useState<string>();
@@ -193,8 +195,10 @@ export const Assembly = ({
           className="h-full"
           height="100%"
           placeholder="Try writing some PolkaVM assembly code."
+          /* TODO [ToDr] Marking as readonly since the 64-bit assembly is not working correctly yet */
+          readOnly
           value={assembly}
-          onChange={(value) => compile(value)}
+          onChange={compile}
         />
       </div>
       <div>

src/components/ProgramLoader/Examples.tsx

@@ -1,3 +1,4 @@
+import { RegistersArray } from "@/types/pvm";
 import { ProgramUploadFileOutput } from "./types";
 import { Button } from "@/components/ui/button.tsx";
 
@@ -15,8 +16,8 @@ const programs: {
   fibonacci: {
     name: "Fibonacci sequence",
     program: [
-      0, 0, 33, 4, 8, 1, 4, 9, 1, 5, 3, 0, 2, 119, 255, 7, 7, 12, 82, 138, 8, 152, 8, 82, 169, 5, 243, 82, 135, 4, 8, 4,
-      9, 17, 19, 0, 73, 147, 82, 213, 0,
+      0, 0, 33, 51, 8, 1, 51, 9, 1, 40, 3, 0, 121, 119, 255, 81, 7, 12, 100, 138, 170, 152, 8, 100, 169, 40, 243, 100,
+      135, 51, 8, 51, 9, 1, 50, 0, 73, 147, 82, 213, 0,
     ],
     regs: [4294901760, 0, 0, 0, 0, 0, 0, 9, 0, 0, 0, 0, 0],
     pc: 0,
@@ -27,16 +28,17 @@ const programs: {
   gameOfLife: {
     name: "Conway's Game of Life",
     program: [
-      0, 0, 129, 23, 62, 1, 3, 255, 0, 62, 1, 11, 255, 0, 62, 1, 19, 255, 0, 62, 1, 18, 255, 0, 62, 1, 9, 255, 0, 5,
-      233, 0, 4, 1, 255, 17, 2, 17, 1, 7, 17, 8, 223, 0, 4, 2, 255, 17, 2, 34, 1, 7, 18, 8, 241, 35, 19, 8, 8, 35, 3, 5,
-      47, 2, 51, 128, 0, 11, 52, 18, 68, 1, 15, 20, 1, 14, 44, 21, 2, 25, 50, 21, 3, 21, 5, 8, 7, 21, 3, 6, 5, 11, 2,
-      51, 128, 26, 3, 255, 0, 5, 205, 2, 51, 128, 26, 3, 5, 198, 4, 5, 82, 52, 4, 8, 64, 2, 68, 255, 73, 132, 7, 2, 119,
-      128, 0, 11, 118, 18, 102, 1, 8, 101, 5, 2, 68, 2, 73, 132, 7, 2, 119, 128, 0, 11, 118, 18, 102, 1, 8, 101, 5, 2,
-      68, 247, 73, 132, 7, 2, 119, 128, 0, 11, 118, 18, 102, 1, 8, 101, 5, 2, 68, 16, 73, 132, 7, 2, 119, 128, 0, 11,
-      118, 18, 102, 1, 8, 101, 5, 2, 68, 1, 73, 132, 7, 2, 119, 128, 0, 11, 118, 18, 102, 1, 8, 101, 5, 2, 68, 254, 73,
-      132, 7, 2, 119, 128, 0, 11, 118, 18, 102, 1, 8, 101, 5, 2, 68, 240, 73, 132, 7, 2, 119, 128, 0, 11, 118, 18, 102,
-      1, 8, 101, 5, 2, 68, 2, 73, 132, 7, 2, 119, 128, 0, 11, 118, 18, 102, 1, 8, 101, 5, 5, 60, 255, 4, 1, 17, 2, 19,
-      128, 0, 1, 18, 3, 50, 2, 17, 4, 7, 17, 64, 12, 255, 5, 240, 33, 132, 16, 146, 9, 153, 72, 138, 18, 17, 69, 137,
+      0, 0, 129, 23, 30, 1, 3, 255, 0, 30, 1, 11, 255, 0, 30, 1, 19, 255, 0, 30, 1, 18, 255, 0, 30, 1, 9, 255, 0, 40,
+      233, 0, 51, 1, 255, 1, 139, 17, 1, 81, 17, 8, 223, 0, 51, 2, 255, 1, 139, 34, 1, 81, 18, 8, 241, 140, 19, 8, 180,
+      35, 3, 40, 47, 139, 51, 128, 0, 114, 52, 122, 68, 1, 82, 20, 1, 14, 83, 21, 2, 25, 86, 21, 3, 21, 40, 8, 81, 21,
+      3, 6, 40, 11, 139, 51, 128, 70, 3, 255, 0, 40, 205, 139, 51, 128, 70, 3, 40, 198, 51, 5, 100, 52, 51, 8, 64, 139,
+      68, 255, 185, 132, 7, 139, 119, 128, 0, 114, 118, 122, 102, 1, 180, 101, 5, 139, 68, 2, 185, 132, 7, 139, 119,
+      128, 0, 114, 118, 122, 102, 1, 180, 101, 5, 139, 68, 247, 185, 132, 7, 139, 119, 128, 0, 114, 118, 122, 102, 1,
+      180, 101, 5, 139, 68, 16, 185, 132, 7, 139, 119, 128, 0, 114, 118, 122, 102, 1, 180, 101, 5, 139, 68, 1, 185, 132,
+      7, 139, 119, 128, 0, 114, 118, 122, 102, 1, 180, 101, 5, 139, 68, 254, 185, 132, 7, 139, 119, 128, 0, 114, 118,
+      122, 102, 1, 180, 101, 5, 139, 68, 240, 185, 132, 7, 139, 119, 128, 0, 114, 118, 122, 102, 1, 180, 101, 5, 139,
+      68, 2, 185, 132, 7, 139, 119, 128, 0, 114, 118, 122, 102, 1, 180, 101, 5, 40, 60, 255, 51, 1, 1, 139, 19, 128, 0,
+      118, 18, 112, 50, 139, 17, 4, 81, 17, 64, 12, 255, 40, 240, 33, 132, 16, 146, 9, 153, 72, 138, 18, 17, 69, 137,
       82, 149, 36, 74, 146, 40, 73, 162, 36, 137, 146, 36, 74, 146, 40, 73, 162, 36, 137, 146, 52, 42, 33,
     ],
     regs: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
@@ -53,7 +55,7 @@ const programs: {
   },
   branch: {
     name: "Branch instruction",
-    program: [0, 0, 16, 4, 7, 210, 4, 7, 39, 210, 4, 6, 0, 4, 7, 239, 190, 173, 222, 17, 6],
+    program: [0, 0, 16, 51, 7, 210, 4, 81, 39, 210, 4, 6, 0, 51, 7, 239, 190, 173, 222, 17, 6],
     regs: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
     pc: 0,
     pageMap: [],
@@ -62,7 +64,7 @@ const programs: {
   },
   add: {
     name: "ADD instruction",
-    program: [0, 0, 3, 8, 135, 9, 1],
+    program: [0, 0, 3, 121, 121, 2, 1],
     regs: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
     pc: 0,
     pageMap: [],
@@ -71,7 +73,7 @@ const programs: {
   },
   storeU16: {
     name: "Store U16 instruction",
-    program: [0, 0, 5, 69, 7, 0, 0, 2, 1],
+    program: [0, 0, 7, 31, 3, 0, 0, 2, 52, 18, 1],
     regs: [0, 0, 0, 0, 0, 0, 0, 305419896, 0, 0, 0, 0, 0],
     pc: 0,
     pageMap: [
@@ -87,21 +89,7 @@ const programs: {
   empty: {
     name: "Empty",
     program: [0, 0, 0],
-    regs: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0] as [
-      number,
-      number,
-      number,
-      number,
-      number,
-      number,
-      number,
-      number,
-      number,
-      number,
-      number,
-      number,
-      number,
-    ],
+    regs: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
     pc: 0,
     pageMap: [],
     memory: [],
@@ -125,7 +113,7 @@ export const Examples = ({ onProgramLoad }: { onProgramLoad: (val: ProgramUpload
             onClick={() => {
               onProgramLoad({
                 initial: {
-                  regs: programs[key].regs,
+                  regs: programs[key].regs.map((x) => BigInt(x)) as RegistersArray,
                   pc: programs[key].pc,
                   pageMap: programs[key].pageMap,
                   memory: programs[key].memory,

src/components/ProgramLoader/ProgramFileUpload.tsx

@@ -93,7 +93,7 @@ export const ProgramFileUpload = ({
             program: Array.from(code),
             name: "custom",
             initial: {
-              regs: Array.from(registers) as RegistersArray,
+              regs: Array.from(registers).map((x) => BigInt(x as number | bigint)) as RegistersArray,
               pc: 0,
               pageMap: [],
               // TODO: map memory properly

src/components/ProgramLoader/utils.ts

@@ -1,5 +1,6 @@
 import { mapKeys, camelCase, pickBy } from "lodash";
 import { ProgramUploadFileInput, ProgramUploadFileOutput } from "./types";
+import { RegistersArray } from "@/types/pvm";
 
 export function mapUploadFileInputToOutput(data: ProgramUploadFileInput): ProgramUploadFileOutput {
   const camelCasedData = mapKeys(data, (_value: unknown, key: string) => camelCase(key));
@@ -20,5 +21,6 @@ export function mapUploadFileInputToOutput(data: ProgramUploadFileInput): Progra
     // expected: mapKeys(expected, (_value: unknown, key) => camelCase(key.replace("expected", ""))) as unknown as ProgramUploadFileOutput["expected"],
   };
 
+  result.initial.regs = result.initial.regs?.map((x) => BigInt(x as number | bigint)) as RegistersArray;
   return result;
 }

src/components/PvmSelect/index.tsx

@@ -171,7 +171,7 @@ export const PvmSelect = () => {
             id: value,
             type: PvmTypes.WASM_URL,
             params: {
-              url: path.join(url, "../", metadata.wasmBlobUrl32 || metadata.wasmBlobUrl),
+              url: path.join(url, "../", metadata.wasmBlobUrl),
               lang,
             },
           },

src/components/Registers/index.tsx

@@ -1,6 +1,5 @@
 import { ExpectedState, InitialState, RegistersArray, Status } from "@/types/pvm";
 import { ReactNode, useContext } from "react";
-import { NumeralSystem } from "@/context/NumeralSystem";
 import { NumeralSystemContext } from "@/context/NumeralSystemContext";
 import { valueToNumeralSystem } from "@/components/Instructions/utils.tsx";
 import classNames from "classnames";
@@ -131,7 +130,7 @@ export const Registers = ({
     <div className="border-2 rounded-md h-[70vh] overflow-auto">
       <div className="p-3">
         <div>
-          <div className="font-mono flex flex-col items-start">
+          <div className="font-mono flex flex-col items-start text-xs">
             <div className="flex flex-row items-center justify-between w-full mb-2">
               <p className="flex-[2]">PC</p>
               {allowEditingPc ? (
@@ -140,13 +139,10 @@ export const Registers = ({
                     className="w-20 h-6 m-0 py-0 px-[4px] text-md border-white hover:border-input"
                     onChange={(e) => {
                       const value = e.target?.value;
-                      const valueInDecimal =
-                        numeralSystem === NumeralSystem.HEXADECIMAL ? `${parseInt(value, 16)}` : value;
-                      const pcValue =
-                        valueInDecimal && !Number.isNaN(parseInt(valueInDecimal)) ? parseInt(valueInDecimal) : 0;
+                      const newValue = stringToNumber(value, Number);
                       onCurrentStateChange({
                         ...currentState,
-                        pc: pcValue,
+                        pc: newValue,
                       });
                     }}
                     onKeyUp={(e) => {
@@ -205,14 +201,11 @@ export const Registers = ({
                       className="w-20 h-6 m-0 p-0"
                       onChange={(e) => {
                         const value = e.target?.value;
-                        const valueInDecimal =
-                          numeralSystem === NumeralSystem.HEXADECIMAL ? `${parseInt(value, 16)}` : value;
-                        const regValue =
-                          valueInDecimal && !Number.isNaN(parseInt(valueInDecimal)) ? parseInt(valueInDecimal) : "";
+                        const newValue = stringToNumber(value, BigInt);
                         onCurrentStateChange({
                           ...currentState,
-                          regs: currentState.regs?.map((val: number, index: number) =>
-                            index === regNo ? regValue : val,
+                          regs: currentState.regs?.map((val: bigint, index: number) =>
+                            index === regNo ? newValue : val,
                           ) as InitialState["regs"],
                         });
                       }}
@@ -231,7 +224,7 @@ export const Registers = ({
                     propName="regs"
                     propNameIndex={regNo}
                     workers={workers}
-                    padStartVal={numeralSystem ? 8 : 0}
+                    padStartVal={numeralSystem ? 16 : 0}
                   />
                 )}
               </div>
@@ -242,3 +235,11 @@ export const Registers = ({
     </div>
   );
 };
+
+function stringToNumber<T>(value: string, cb: (x: string) => T): T {
+  try {
+    return cb(value);
+  } catch (_e) {
+    return cb("0");
+  }
+}

src/context/NumeralSystemProvider.tsx

@@ -3,7 +3,7 @@ import { NumeralSystem } from "./NumeralSystem";
 import { NumeralSystemContext } from "./NumeralSystemContext";
 
 export const NumeralSystemProvider = ({ children }: { children: ReactNode }) => {
-  const [numeralSystem, setNumeralSystem] = useState(NumeralSystem.DECIMAL);
+  const [numeralSystem, setNumeralSystem] = useState(NumeralSystem.HEXADECIMAL);
 
   return (
     <NumeralSystemContext.Provider value={{ numeralSystem, setNumeralSystem }}>