Skip to main content

​
Usage

const {
  data,
  isLoading,
  isError,
  isSuccess,
  error,
  refetch,
  fetchTransactionStatus,
} = useGetTransactionStatus({
  hash: "0x...",
  getBearerToken: getToken,
  refetchInterval: 3000, // polls every 3s, stops on terminal status
});

​
Input Parameters

ParameterTypeRequiredDescription
hashstringYesTransaction hash (0x...)
getBearerToken() => Promise<string>YesFunction returning the auth token
refetchIntervalnumber | falseNoPolling interval in ms (default: 3000). false to disable.
queryOptionsUseQueryOptionsNoReact Query options

​
Return Value

PropertyTypeDescription
dataTransactionStatusResponse | undefinedTransaction status data
isLoadingbooleanTrue while fetching
isErrorbooleanTrue if an error occurred
isSuccessbooleanTrue if the query succeeded
errorError | nullError when isError is true
refetch() => Promise<QueryObserverResult>Re-run the query
fetchTransactionStatus(input) => Promise<TransactionStatusResponse>Imperatively fetch
Polling automatically stops when the status reaches a terminal state: ACCEPTED_ON_L1, REJECTED, or REVERTED.

​
Example Implementation

import { useGetTransactionStatus } from "@chipi-stack/chipi-react";
import { OnChainTxStatus } from "@chipi-stack/types";

export function TransactionTracker({
  txHash,
  getBearerToken,
}: {
  txHash: string;
  getBearerToken: () => Promise<string>;
}) {
  const { data, isLoading } = useGetTransactionStatus({
    hash: txHash,
    getBearerToken,
    refetchInterval: 3000,
  });

  if (isLoading) return <p>Checking status...</p>;

  const confirmed = data?.status === OnChainTxStatus.ACCEPTED_ON_L2
    || data?.status === OnChainTxStatus.ACCEPTED_ON_L1;

  return (
    <div>
      <p>Status: {data?.status}</p>
      {data?.blockNumber && <p>Block: {data.blockNumber}</p>}
      {data?.revertReason && <p>Revert reason: {data.revertReason}</p>}
      {confirmed && <p>Transaction confirmed!</p>}
    </div>
  );
}