import { useDeBridgeBet } from '@azuro-org/sdk'
 
// using BetslipProvider
import { useBaseBetslip, useDetailedBetslip } from '@azuro-org/sdk'
 
const { items, clear } = useBaseBetslip()
const { betAmount, odds, totalOdds } = useDetailedBetslip()
 
// using useOdds
import { useOdds } from '@azuro-org/sdk'
 
const [ betAmount, setBetAmount ] = useState()
const items = [...]
const { odds, totalOdds } = useOdds({ betAmount, selections })
 
const fromChainId = 42161 // Arbitrum
const fromTokenAddress = '0xfd086bc7cd5c481dcc9c85ebe478a1c0b69fcbb9' // USDT
 
const {
  submit, approveTx, betTx, estimation, fixFee,
  isAllowanceLoading, isApproveRequired, isTxReady, loading
} = useDeBridgeBet({
  fromChainId,
  fromTokenAddress,
  betAmount,
  slippage: 10, // 10%
  referralCode: 0000,
  affiliate: '0x...', // your affiliate address
  selections: items,
  odds,
  totalOdds,
  onSuccess: () => {
    clear()
  },
})
 
submit()

{
  fromChainId: number // blockchain chainId
  fromTokenAddress: string // token address
  betAmount: string // bet amount
  slippage: number // in percent
  referralCode: number // your deBridge referral code
  affiliate: Address // your affiliate address
  odds: Record<string, number>, // odds
  totalOdds: number, // total odds
  selections: Selection[] // user's choise for bet
  deadline?: number // duration after which the bet will be canceled if it does not get included in a block
  onSuccess?(receipt: TransactionReceipt): void // callback function triggered after a successful bet
  onError?(err?: Error): void // callback function triggered upon encountering an error
}

type Selection = {
  conditionId: string
  outcomeId: string
  coreAddress: string
}

{
  orderId: string | undefined // deBridge order id
  submit: () => Promise<void> // function used to trigger the bet action or token spending approval
  estimation: Estimation | undefined, // transaction costs
  fixFee: string | undefined // deBridge fee in native tokens
  supportedChainIds: Array<number> // list of supported blockchains
  approveTx: { // approve transaction state
    isPending: boolean
    isProcessing: boolean
  }
  betTx: { // bet transaction state
    isPending: boolean
    isProcessing: boolean
  }
  isTxReady: boolean // flag indicates the transaction data was created
  loading: boolean // flag indicates the transaction data creating
  isAllowanceLoading: boolean // flag indicates the fetching of allowance
  isApproveRequired: boolean // flag indicates the necessity for token spending approval
}
 
type Estimation = {
  srcChainTokenIn: {
    address: Address
    name: string
    symbol: string
    decimals: number
    amount: string
    approximateOperatingExpense: string
    mutatedWithOperatingExpense: boolean
  }
  srcChainTokenOut: {
    address: Address
    name: string
    symbol: string
    decimals: number
    amount: string
    maxRefundAmount: string
  }
  dstChainTokenOut: {
    address: Address
    name: string
    symbol: string
    decimals: number
    amount: string
    recommendedAmount: string
    withoutAdditionalTakerRewardsAmount: string
    maxTheoreticalAmount: string
  }
  recommendedSlippage: number
  costsDetails: [ string ]
}