useRegister

import { useRegister, useAvailable, useRentPrice } from "@oniym/react";
import { useWalletClient } from "wagmi"; // or your wallet library
 
function RegisterForm() {
  const { data: walletClient } = useWalletClient();
  const { data: available } = useAvailable("alice", "web3");
  const { data: price } = useRentPrice("alice", "web3", 365 * 24 * 60 * 60);
 
  const {
    mutate: register,
    isPending,
    isSuccess,
    error,
  } = useRegister(walletClient);
 
  return (
    <div>
      <p>Price: {price ? `${Number(price) / 1e18} ETH` : "—"}</p>
      <button
        disabled={!available || isPending || !walletClient}
        onClick={() =>
          register({
            name: "alice",
            tld: "web3",
            duration: 365 * 24 * 60 * 60,
            reverseRecord: true,
            onCommit: (hash) => console.log("Committed:", hash),
            onWaiting: (ms) => console.log(`Waiting ${ms / 1000}s...`),
          })
        }
      >
        {isPending ? "Registering..." : "Register alice.web3"}
      </button>
      {isSuccess && <p>Registered!</p>}
      {error && <p>Error: {error.message}</p>}
    </div>
  );
}