register-ui: tweak mint os

hyperdrive/src/register-ui/package.json

@@ -19,7 +19,7 @@
     "react-modal": "^3.16.1",
     "react-router-dom": "^6.16.0",
     "unocss": "^0.59.4",
-    "viem": "^2.19.0",
+    "viem": "^2.23.2",
     "wagmi": "^2.12.5"
   },
   "scripts": {

hyperdrive/src/register-ui/src/pages/CommitDotOsName.tsx

@@ -11,7 +11,8 @@ import { Tooltip } from "../components/Tooltip";
 import { useAccount, useWaitForTransactionReceipt, useWriteContract } from "wagmi";
 import { useConnectModal, useAddRecentTransaction } from "@rainbow-me/rainbowkit"
 import { dotOsAbi, DOTOS } from "../abis";
-import { stringToHex, encodeAbiParameters, parseAbiParameters, keccak256 } from "viem";
+import { createPublicClient, http, stringToHex, encodeAbiParameters, parseAbiParameters, keccak256, BaseError, ContractFunctionRevertedError } from "viem";
+import { base } from 'viem/chains'
 import BackButton from "../components/BackButton";
 interface RegisterOsNameProps extends PageProps { }
 
@@ -76,13 +77,35 @@ function CommitDotOsName({
                 [stringToHex(name), address]
             )
         )
-        writeContract({
-            abi: dotOsAbi,
-            address: DOTOS,
-            functionName: 'commit',
-            args: [commit],
-            gas: 1000000n,
-        })
+
+        const publicClient = createPublicClient({
+            chain: base,
+            transport: http(),
+        });
+
+        try {
+            const { request } = await publicClient.simulateContract({
+                abi: dotOsAbi,
+                address: DOTOS,
+                functionName: 'commit',
+                args: [commit],
+                account: address
+            });
+
+            writeContract(request);
+        } catch (err) {
+            if (err instanceof BaseError) {
+                const revertError = err.walk(err => err instanceof ContractFunctionRevertedError)
+                if (revertError instanceof ContractFunctionRevertedError) {
+                    if (revertError?.data) {
+                        const errorName = revertError.data.errorName;
+                        const args = revertError.data.args;
+                        console.log(`Reverted with ${errorName}`, args);
+                    }
+                }
+            }
+            throw err;
+        }
 
     }, [name, direct, address, writeContract, setNetworkingKey, setIpAddress, setWsPort, setTcpPort, setRouters, openConnectModal])
 

hyperdrive/src/register-ui/src/pages/MintDotOsName.tsx

@@ -3,10 +3,11 @@ import { useNavigate } from "react-router-dom";
 import Loader from "../components/Loader";
 import { PageProps } from "../lib/types";
 
-import { useAccount, useWaitForTransactionReceipt, useSendTransaction } from "wagmi";
+import { useAccount, useWaitForTransactionReceipt, useWriteContract } from "wagmi";
 import { useConnectModal, useAddRecentTransaction } from "@rainbow-me/rainbowkit"
 import { generateNetworkingKeys, HYPER_ACCOUNT_IMPL, DOTOS, tbaMintAbi } from "../abis";
-import { encodePacked, encodeFunctionData, stringToHex } from "viem";
+import { createPublicClient, encodePacked, http, stringToHex, BaseError, ContractFunctionRevertedError } from "viem";
+import { base } from 'viem/chains'
 
 interface RegisterOsNameProps extends PageProps { }
 
@@ -23,7 +24,7 @@ function MintDotOsName({
   let navigate = useNavigate();
   let { openConnectModal } = useConnectModal();
 
-  const { data: hash, sendTransaction, isPending, isError, error } = useSendTransaction({
+  const { data: hash, writeContract, isPending, isError, error } = useWriteContract({
     mutation: {
       onSuccess: (data) => {
         addRecentTransaction({ hash: data, description: `Mint ${hnsName}` });
@@ -74,31 +75,40 @@ function MintDotOsName({
     // strip .os suffix
     const name = hnsName.replace(/\.os$/, '');
 
-    const data = encodeFunctionData({
-      abi: tbaMintAbi,
-      functionName: 'mint',
-      args: [
-        address,
-        encodePacked(["bytes"], [stringToHex(name)]),
-        initCall,
-        HYPER_ACCOUNT_IMPL,
-      ],
-    })
-
-    // use data to write to contract -- do NOT use writeContract
-    // writeContract will NOT generate the correct selector for some reason
-    // probably THEIR bug.. no abi works
+    const publicClient = createPublicClient({
+      chain: base,
+      transport: http(),
+    });
+
     try {
-      sendTransaction({
-        to: DOTOS,
-        data: data,
-        gas: 1000000n,
-      })
-    } catch (error) {
-      console.error('Failed to send transaction:', error)
-      setHasMinted(false);
+      const { request } = await publicClient.simulateContract({
+        abi: tbaMintAbi,
+        address: DOTOS,
+        functionName: 'mint',
+        args: [
+          address,
+          encodePacked(["bytes"], [stringToHex(name)]),
+          initCall,
+          HYPER_ACCOUNT_IMPL,
+        ],
+        account: address
+      });
+
+      writeContract(request);
+    } catch (err) {
+      if (err instanceof BaseError) {
+        const revertError = err.walk(err => err instanceof ContractFunctionRevertedError)
+        if (revertError instanceof ContractFunctionRevertedError) {
+          if (revertError?.data) {
+            const errorName = revertError.data.errorName;
+            const args = revertError.data.args;
+            console.log(`Reverted with ${errorName}`, args);
+          }
+        }
+      }
+      throw err;
     }
-  }, [direct, address, sendTransaction, setNetworkingKey, setIpAddress, setWsPort, setTcpPort, setRouters, openConnectModal, hnsName, hasMinted])
+  }, [direct, address, writeContract, setNetworkingKey, setIpAddress, setWsPort, setTcpPort, setRouters, openConnectModal, hnsName, hasMinted])
 
   useEffect(() => {
     if (address && !isPending && !isConfirming) {
@@ -132,4 +142,4 @@ function MintDotOsName({
   );
 }
 
-export default MintDotOsName;
+export default MintDotOsName;