Merge branch 'main' into crosschain-ui

Author: kumaryash90

.changeset/rotten-vans-sleep.md renamed to .changeset/friendly-lamps-think.md

@@ -2,4 +2,4 @@
 "@thirdweb-dev/service-utils": patch
 ---
 
-Use a cache key that doesn't involve hashing
+Export usageV2 util functions

.changeset/short-carrots-smile.md

@@ -0,0 +1,5 @@
+---
+"@thirdweb-dev/service-utils": patch
+---
+
+[service-utils] replace client_id with project_id in usage_v2

.vscode/settings.json

@@ -27,5 +27,9 @@
   },
   "[css]": {
     "editor.defaultFormatter": "biomejs.biome"
-  }
+  },
+  "eslint.workingDirectories": [
+    { "pattern": "./packages/*/" },
+    { "pattern": "./apps/*/" }
+  ]
 }

apps/dashboard/package.json

@@ -129,7 +129,7 @@
     "@typescript-eslint/eslint-plugin": "7.14.1",
     "@typescript-eslint/parser": "7.14.1",
     "autoprefixer": "^10.4.19",
-    "checkly": "^4.15.0",
+    "checkly": "^4.18.0",
     "eslint": "8.57.0",
     "eslint-config-biome": "1.9.4",
     "eslint-plugin-react-compiler": "19.0.0-beta-df7b47d-20241124",

apps/dashboard/src/app/team/[team_slug]/(team)/~/projects/TeamProjectsPage.tsx

@@ -94,9 +94,21 @@ export function TeamProjectsPage(props: {
     <div className="flex grow flex-col">
       {/* Filters + Add New */}
       <div className="flex flex-col gap-4 md:flex-row md:items-center">
-        <SearchInput value={searchTerm} onValueChange={setSearchTerm} />
+        <SearchInput
+          value={searchTerm}
+          onValueChange={(v) => {
+            setSearchTerm(v);
+            setPage(1);
+          }}
+        />
         <div className="flex gap-4">
-          <SelectBy value={sortBy} onChange={setSortBy} />
+          <SelectBy
+            value={sortBy}
+            onChange={(v) => {
+              setSortBy(v);
+              setPage(1);
+            }}
+          />
           <AddNewButton
             createProject={() => setIsCreateProjectDialogOpen(true)}
             teamMembersSettingsPath={`/team/${props.team.slug}/~/settings/members`}

apps/dashboard/src/components/contract-functions/interactive-abi-function.tsx

@@ -14,7 +14,7 @@ import {
   Input,
 } from "@chakra-ui/react";
 import { useMutation } from "@tanstack/react-query";
-import type { AbiFunction, AbiParameter } from "abitype";
+import { type AbiFunction, type AbiParameter, formatAbiItem } from "abitype";
 import { TransactionButton } from "components/buttons/TransactionButton";
 import { SolidityInput } from "contract-ui/components/solidity-inputs";
 import { camelToTitle } from "contract-ui/components/solidity-inputs/helpers";
@@ -28,13 +28,12 @@ import {
   type ThirdwebContract,
   prepareContractCall,
   readContract,
-  resolveMethod,
   simulateTransaction,
   toSerializableTransaction,
   toWei,
 } from "thirdweb";
 import { useActiveAccount, useSendAndConfirmTransaction } from "thirdweb/react";
-import { parseAbiParams, stringify } from "thirdweb/utils";
+import { parseAbiParams, stringify, toFunctionSelector } from "thirdweb/utils";
 import {
   Button,
   Card,
@@ -135,7 +134,12 @@ interface InteractiveAbiFunctionProps {
   twAccount: Account | undefined;
 }
 
-function useAsyncRead(contract: ThirdwebContract, functionName: string) {
+function useAsyncRead(contract: ThirdwebContract, abiFunction: AbiFunction) {
+  const formattedAbi = formatAbiItem({
+    ...abiFunction,
+    type: "function",
+    // biome-ignore lint/suspicious/noExplicitAny: FIXME
+  } as any);
   return useMutation({
     mutationFn: async ({
       args,
@@ -144,7 +148,8 @@ function useAsyncRead(contract: ThirdwebContract, functionName: string) {
       const params = parseAbiParams(types, args);
       return readContract({
         contract,
-        method: resolveMethod(functionName),
+        // biome-ignore lint/suspicious/noExplicitAny: dynamic typing
+        method: formattedAbi as any,
         params,
       });
     },
@@ -156,21 +161,32 @@ function useSimulateTransaction() {
   return useMutation({
     mutationFn: async ({
       contract,
-      functionName,
+      abiFunction,
       params,
       value,
     }: {
       contract: ThirdwebContract;
-      functionName: string;
+      abiFunction: AbiFunction;
       params: unknown[];
       value?: bigint;
     }) => {
       if (!from) {
         return toast.error("No account connected");
       }
+      const formattedAbi = formatAbiItem({
+        ...abiFunction,
+        type: "function",
+        // biome-ignore lint/suspicious/noExplicitAny: FIXME
+      } as any);
+      console.log(
+        "formattedAbi",
+        formattedAbi,
+        toFunctionSelector(abiFunction),
+      );
       const transaction = prepareContractCall({
         contract,
-        method: resolveMethod(functionName),
+        // biome-ignore lint/suspicious/noExplicitAny: dynamic typing
+        method: formattedAbi as any,
         params,
         value,
       });
@@ -179,10 +195,16 @@ function useSimulateTransaction() {
           simulateTransaction({
             from,
             transaction,
+          }).catch((e) => {
+            console.error("Error simulating transaction", e);
+            throw e;
           }),
           toSerializableTransaction({
             from,
             transaction,
+          }).catch((e) => {
+            console.error("Error serializing transaction", e);
+            throw e;
           }),
         ]);
         return `--- ✅ Simulation succeeded ---
@@ -257,7 +279,7 @@ export const InteractiveAbiFunction: React.FC<InteractiveAbiFunctionProps> = (
     data: readData,
     isPending: readLoading,
     error: readError,
-  } = useAsyncRead(contract, abiFunction.name);
+  } = useAsyncRead(contract, abiFunction);
 
   const txSimulation = useSimulateTransaction();
 
@@ -311,12 +333,18 @@ export const InteractiveAbiFunction: React.FC<InteractiveAbiFunctionProps> = (
     if (!abiFunction.name) {
       return toast.error("Cannot detect function name");
     }
+    const formattedAbi = formatAbiItem({
+      ...abiFunction,
+      type: "function",
+      // biome-ignore lint/suspicious/noExplicitAny: FIXME
+    } as any);
     const types = abiFunction.inputs.map((o) => o.type);
     const formatted = formatContractCall(d.params);
     const params = parseAbiParams(types, formatted);
     const transaction = prepareContractCall({
       contract,
-      method: resolveMethod(abiFunction.name),
+      // biome-ignore lint/suspicious/noExplicitAny: dynamic typing
+      method: formattedAbi as any,
       params,
       value: d.value ? toWei(d.value) : undefined,
     });
@@ -334,7 +362,7 @@ export const InteractiveAbiFunction: React.FC<InteractiveAbiFunctionProps> = (
     txSimulation.mutate({
       contract,
       params,
-      functionName: abiFunction.name,
+      abiFunction,
       value: d.value ? toWei(d.value) : undefined,
     });
   });

apps/playground-web/src/components/account-abstraction/sponsored-tx-zksync.tsx

@@ -1,5 +1,4 @@
 "use client";
-
 import { useState } from "react";
 import { getContract } from "thirdweb";
 import { zkSyncSepolia } from "thirdweb/chains";
@@ -15,6 +14,12 @@ import { shortenHex } from "thirdweb/utils";
 import { THIRDWEB_CLIENT } from "../../lib/client";
 import { WALLETS } from "../../lib/constants";
 
+// const chain = abstractTestnet;
+// const editionDropContract = getContract({
+//   client: THIRDWEB_CLIENT,
+//   address: "0x8A24a7Df38fA5fCCcFD1259e90Fb6996fDdfcADa",
+//   chain,
+// });
 const chain = zkSyncSepolia;
 const editionDropContract = getContract({
   client: THIRDWEB_CLIENT,
@@ -83,6 +88,7 @@ export function SponsoredTxZksyncPreview() {
                   metadata: nft?.metadata,
                 }}
                 onError={(error) => {
+                  console.error("error", error);
                   alert(`Error: ${error.message}`);
                 }}
                 onClick={() => {

apps/playground-web/src/components/sign-in/hooks.tsx

@@ -1,5 +1,4 @@
 "use client";
-
 import {
   useActiveAccount,
   useActiveWallet,
@@ -39,7 +38,9 @@ export function HooksPreview() {
         </>
       ) : (
         <Button variant="default" onClick={connect}>
-          Connect with Metamask
+          {connectMutation.isConnecting
+            ? "Connecting..."
+            : "Connect with Metamask"}
         </Button>
       )}
     </div>

apps/portal/.eslintrc.json

@@ -5,12 +5,20 @@
     "eslint:recommended",
     "plugin:@typescript-eslint/recommended",
     "plugin:@next/next/recommended",
-    "plugin:storybook/recommended"
+    "plugin:mdx/recommended",
+    "plugin:tailwindcss/recommended"
   ],
   "rules": {
     "no-unused-vars": "off",
     "@typescript-eslint/no-unused-vars": "error",
     "@typescript-eslint/no-explicit-any": "off",
-    "svg-jsx/camel-case-dash": "error"
-  }
+    "svg-jsx/camel-case-dash": "error",
+    "tailwindcss/classnames-order": "off"
+  },
+  "overrides": [
+    {
+      "files": ["*.ts", "*.js", "*.tsx", "*.jsx"],
+      "extends": ["biome"]
+    }
+  ]
 }

apps/portal/knip.json

@@ -0,0 +1,33 @@
+{
+  "$schema": "https://unpkg.com/knip@5/schema.json",
+  "next": true,
+  "project": ["src/**"],
+  "ignoreBinaries": ["only-allow", "biome"],
+  "ignore": ["src/components/ui/**"],
+  "ignoreDependencies": [
+    "@thirdweb-dev/chains",
+    "@thirdweb-dev/wallets",
+    "thirdweb",
+    "@types/mdx"
+  ],
+  "entry": [
+    "next.config.{js,ts,cjs,mjs}",
+    "{instrumentation,middleware}.{js,ts}",
+    "app/global-error.{js,jsx,ts,tsx}",
+    "app/**/{error,layout,loading,not-found,page,template,default}.{js,jsx,ts,tsx,mdx}",
+    "app/**/route.{js,jsx,ts,tsx}",
+    "app/{manifest,sitemap,robots}.{js,ts}",
+    "app/**/{icon,apple-icon}.{js,jsx,ts,tsx}",
+    "app/**/{opengraph,twitter}-image.{js,jsx,ts,tsx}",
+    "pages/**/*.{js,jsx,ts,tsx}",
+    "src/{instrumentation,middleware}.{js,ts}",
+    "src/app/global-error.{js,jsx,ts,tsx}",
+    "src/app/**/{error,layout,loading,not-found,page,template,default}.{js,jsx,ts,tsx,mdx}",
+    "src/app/**/route.{js,jsx,ts,tsx}",
+    "src/app/{manifest,sitemap,robots}.{js,ts}",
+    "src/app/**/{icon,apple-icon}.{js,jsx,ts,tsx}",
+    "src/app/**/{opengraph,twitter}-image.{js,jsx,ts,tsx}",
+    "src/pages/**/*.{js,jsx,ts,tsx}",
+    "scripts/*.ts"
+  ]
+}