Merge branch 'main' into challenge-view

Scaffold-Stark · Apr 20, 2024 · 51f9fa9 · 51f9fa9
2 parents f54d790 + 91758df
commit 51f9fa9
Show file tree

Hide file tree

Showing 19 changed files with 442 additions and 698 deletions.
diff --git a/packages/nextjs/app/debug/_components/contract/ContractReadMethods.tsx b/packages/nextjs/app/debug/_components/contract/ContractReadMethods.tsx
@@ -5,6 +5,7 @@ import {
   ContractName,
   GenericContract,
   InheritedFunctions,
+  getFunctionsByStateMutability,
 } from "~~/utils/scaffold-stark/contract";
 import { ReadOnlyFunctionForm } from "./ReadOnlyFunctionForm";
 
@@ -17,36 +18,19 @@ export const ContractReadMethods = ({
     return null;
   }
 
-  const functionsToDisplay = ((deployedContractData.abi || []) as Abi)
-    .reduce((acc, part) => {
-      if (part.type === "function") {
-        acc.push(part);
-      } else if (part.type === "interface" && Array.isArray(part.items)) {
-        part.items.forEach((item) => {
-          if (item.type === "function") {
-            acc.push(item);
-          }
-        });
-      }
-      return acc;
-    }, [] as AbiFunction[])
+  const functionsToDisplay = getFunctionsByStateMutability(
+    (deployedContractData.abi || []) as Abi,
+    "view",
+  )
     .filter((fn) => {
-      const isQueryableWithParams =
-        fn.state_mutability === "view" && fn.inputs.length > 0;
+      const isQueryableWithParams = fn.inputs.length > 0;
       return isQueryableWithParams;
     })
     .map((fn) => {
       return {
         fn,
-        //   inheritedFrom: (
-        //     (deployedContractData as GenericContract)
-        //       ?.inheritedFunctions as InheritedFunctions
-        //   )?.[fn.name],
       };
     });
-  //     .sort((a, b) =>
-  //       b.inheritedFrom ? b.inheritedFrom.localeCompare(a.inheritedFrom) : 1
-  //     );
   if (!functionsToDisplay.length) {
     return <>No read methods</>;
   }
@@ -58,7 +42,6 @@ export const ContractReadMethods = ({
           contractAddress={deployedContractData.address}
           abiFunction={fn}
           key={fn.name}
-          //   inheritedFrom={inheritedFrom}
         />
       ))}
     </>

diff --git a/packages/nextjs/app/debug/_components/contract/ContractVariables.tsx b/packages/nextjs/app/debug/_components/contract/ContractVariables.tsx
@@ -5,6 +5,7 @@ import {
   ContractName,
   GenericContract,
   InheritedFunctions,
+  getFunctionsByStateMutability,
 } from "~~/utils/scaffold-stark/contract";
 import { DisplayVariable } from "./DisplayVariable";
 
@@ -19,37 +20,19 @@ export const ContractVariables = ({
     return null;
   }
 
-  const functionsToDisplay = ((deployedContractData.abi || []) as Abi)
-    .reduce((acc, part) => {
-      if (part.type === "function") {
-        acc.push(part);
-      } else if (part.type === "interface" && Array.isArray(part.items)) {
-        part.items.forEach((item) => {
-          if (item.type === "function") {
-            acc.push(item);
-          }
-        });
-      }
-      return acc;
-    }, [] as AbiFunction[])
+  const functionsToDisplay = getFunctionsByStateMutability(
+    (deployedContractData.abi || []) as Abi,
+    "view",
+  )
     .filter((fn) => {
-      const isQueryableWithNoParams =
-        fn.state_mutability === "view" && fn.inputs.length === 0;
-      return isQueryableWithNoParams;
+      const isQueryableWithParams = fn.inputs.length === 0;
+      return isQueryableWithParams;
     })
     .map((fn) => {
       return {
         fn,
-        // inheritedFrom: (
-        //   (deployedContractData as GenericContract)
-        //     ?.inheritedFunctions as InheritedFunctions
-        // )?.[fn.name],
       };
     });
-  // .sort((a, b) =>
-  //   b.inheritedFrom ? b.inheritedFrom.localeCompare(a.inheritedFrom) : 1
-  // );
-
   if (!functionsToDisplay.length) {
     return <>No contract variables</>;
   }

diff --git a/packages/nextjs/app/debug/_components/contract/ContractWriteMethods.tsx b/packages/nextjs/app/debug/_components/contract/ContractWriteMethods.tsx
@@ -6,6 +6,7 @@ import {
   ContractName,
   GenericContract,
   InheritedFunctions,
+  getFunctionsByStateMutability,
 } from "~~/utils/scaffold-stark/contract";
 
 export const ContractWriteMethods = ({
@@ -19,35 +20,14 @@ export const ContractWriteMethods = ({
     return null;
   }
 
-  const functionsToDisplay = ((deployedContractData.abi || []) as Abi)
-    .reduce((acc, part) => {
-      if (part.type === "function") {
-        acc.push(part);
-      } else if (part.type === "interface" && Array.isArray(part.items)) {
-        part.items.forEach((item) => {
-          if (item.type === "function") {
-            acc.push(item);
-          }
-        });
-      }
-      return acc;
-    }, [] as AbiFunction[])
-    .filter((fn) => {
-      const isWriteableFunction = fn.state_mutability == "external";
-      return isWriteableFunction;
-    })
-    .map((fn) => {
-      return {
-        fn,
-        // inheritedFrom: (
-        //   (deployedContractData as GenericContract)
-        //     ?.inheritedFunctions as InheritedFunctions
-        // )?.[fn.name],
-      };
-    });
-  // .sort((a, b) =>
-  //   b.inheritedFrom ? b.inheritedFrom.localeCompare(a.inheritedFrom) : 1
-  // );
+  const functionsToDisplay = getFunctionsByStateMutability(
+    (deployedContractData.abi || []) as Abi,
+    "external",
+  ).map((fn) => {
+    return {
+      fn,
+    };
+  });
 
   if (!functionsToDisplay.length) {
     return <>No write methods</>;

diff --git a/packages/nextjs/app/debug/_components/contract/DisplayVariable.tsx b/packages/nextjs/app/debug/_components/contract/DisplayVariable.tsx
@@ -27,6 +27,7 @@ export const DisplayVariable = ({
 }: DisplayVariableProps) => {
   const {
     data: result,
+    isLoading,
     isFetching,
     refetch,
   } = useContractRead({
@@ -52,7 +53,7 @@ export const DisplayVariable = ({
           className="btn btn-ghost btn-xs"
           onClick={async () => await refetch()}
         >
-          {isFetching ? (
+          {!isLoading && isFetching ? (
             <span className="loading loading-spinner loading-xs"></span>
           ) : (
             <ArrowPathIcon

diff --git a/packages/nextjs/app/debug/_components/contract/ReadOnlyFunctionForm.tsx b/packages/nextjs/app/debug/_components/contract/ReadOnlyFunctionForm.tsx
@@ -32,13 +32,13 @@ export const ReadOnlyFunctionForm = ({
   const [form, setForm] = useState<Record<string, any>>(() =>
     getInitialFormState(abiFunction),
   );
-  const [result, setResult] = useState<unknown>();
+  const [inputValue, setInputValue] = useState<any>();
 
-  const { isLoading, isFetching, refetch } = useContractRead({
+  const { isLoading, isFetching, data } = useContractRead({
     address: contractAddress,
     functionName: abiFunction.name,
     abi: [...abi],
-    args: getParsedContractFunctionArgs(form),
+    args: inputValue,
     enabled: false, // TODO : notify when failed - add error
     blockIdentifier: "pending" as BlockNumber,
   });
@@ -49,7 +49,7 @@ export const ReadOnlyFunctionForm = ({
       <ContractInput
         key={key}
         setForm={(updatedFormValue) => {
-          setResult(undefined);
+          setInputValue(undefined);
           setForm(updatedFormValue);
         }}
         form={form}
@@ -68,20 +68,19 @@ export const ReadOnlyFunctionForm = ({
       {inputElements}
       <div className="flex justify-between gap-2 flex-wrap">
         <div className="flex-grow w-4/5">
-          {result !== null && result !== undefined && (
+          {data !== null && data !== undefined && (
             <div className="bg-secondary rounded-3xl text-sm px-4 py-1.5 break-words">
               <p className="font-bold m-0 mb-1">Result:</p>
               <pre className="whitespace-pre-wrap break-words">
-                {displayTxResult(result, false, abiFunction?.outputs)}
+                {displayTxResult(data, false, abiFunction?.outputs)}
               </pre>
             </div>
           )}
         </div>
         <button
           className="btn btn-secondary btn-sm"
           onClick={async () => {
-            const { data } = await refetch();
-            setResult(data);
+            setInputValue(getParsedContractFunctionArgs(form));
           }}
           disabled={!isLoading && isFetching}
         >

diff --git a/packages/nextjs/app/debug/_components/contract/utilsContract.tsx b/packages/nextjs/app/debug/_components/contract/utilsContract.tsx
@@ -1,4 +1,8 @@
-import { AbiFunction, AbiParameter } from "~~/utils/scaffold-stark/contract";
+import {
+  AbiFunction,
+  AbiParameter,
+  parseParamWithType,
+} from "~~/utils/scaffold-stark/contract";
 import { uint256 } from "starknet";
 import { byteArray } from "starknet-dev";
 /**
@@ -35,12 +39,7 @@ const getInitialFormState = (abiFunction: AbiFunction) => {
 // Recursive function to deeply parse JSON strings, correctly handling nested arrays and encoded JSON strings
 const deepParseValues = (value: any, keyAndType?: any): any => {
   if (keyAndType) {
-    if (keyAndType.includes("core::integer::u256")) {
-      return uint256.bnToUint256(value);
-    }
-    if (keyAndType.includes("core::byte_array::ByteArray")) {
-      return byteArray.byteArrayFromString(value);
-    }
+    return parseParamWithType(keyAndType, value);
   }
   if (typeof value === "string") {
     if (isJsonString(value)) {