useTransactionSimulation

$npx shadcn@latest add https://uxdotsol.xyz/r/use-transaction-simulation.json

"use client";
 
import type {
  Connection,
  Transaction,
  VersionedTransaction,
} from "@solana/web3.js";
import { useTransactionSimulation } from "@/hooks/use-transaction-simulation";
 
type TransferReviewProps = {
  connection: Connection;
  transaction: Transaction | VersionedTransaction;
  onContinue: () => void;
};
 
export function TransferReview({
  connection,
  transaction,
  onContinue,
}: TransferReviewProps) {
  const simulation = useTransactionSimulation({ client: connection, transaction });
 
  return (
    <section>
      <h2>Review transfer</h2>
      <button
        onClick={() => simulation.simulate()}
        disabled={!simulation.canSimulate || simulation.isSimulating}
      >
        {simulation.isSimulating ? "Checking transfer..." : "Check before signing"}
      </button>
 
      {simulation.status === "success" ? (
        <p>Ready to sign. Estimated compute: {simulation.unitsConsumed ?? "unknown"} units.</p>
      ) : null}
      {simulation.hasError ? (
        <p role="alert">This transfer would fail. Review the amount and recipient.</p>
      ) : null}
 
      <button disabled={simulation.status !== "success"} onClick={onContinue}>
        Continue to wallet
      </button>
    </section>
  );
}