Skip to Content
Developer HubSDKProvidersBetslip

BetslipProvider

The BetslipProvider serves the purpose of storing a user’s bet before its execution, while additionally furnishing information regarding odds and states.

⚠️

Batch bet currently unavailable!

Usage

Wrap your application in BetslipProvider.

import { ChainProvider, LiveProvider, SocketProvider, BetslipProvider } from '@azuro-org/sdk'
import { WagmiProvider, createConfig } from 'wagmi'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import { polygonAmoy } from 'viem/chains'
 
 
const wagmiConfig = createConfig(config)
const queryClient = new QueryClient() 
 
function Providers(props: { children: React.ReactNode }) {
  const { children } = props
 
  return (
    <WagmiProvider config={wagmiConfig}>
      <QueryClientProvider client={queryClient}> 
        <ChainProvider initialChainId={polygonAmoy.id}>
          <FeedSocketProvider>
            <GameUpdatesProvider>
              <ConditionUpdatesProvider>
                <BetslipProvider>
                  {children}
                </BetslipProvider>
              </ConditionUpdatesProvider>
            </GameUpdatesProvider>
          </FeedSocketProvider>
        </ChainProvider>
      </QueryClientProvider>
    </WagmiProvider>
  )
}
ℹ️

The AzuroSDKProvider incorporates the BetslipProvider along with all associated providers.

⚠️

The BetslipProvider necessitates access to the ChainProvider, and Socket Providers.

Accessing Betslip Context

import { useBaseBetslip, useDetailedBetslip } from '@azuro-org/sdk'
 
const { items, addItem, addItems, removeItem, clear } = useBaseBetslip()
const { betAmount, odds} = useDetailedBetslip()
ℹ️

The useBaseBetslip hook is employed to gain access to items and facilitate their modification, while the useDetailedBetslip hook is utilized for obtaining additional information such as odds and states.

ℹ️

The addItems function adds several items to the betslip at once. By default the provided items are merged into the current betslip — for each new item any existing selection from the same game is replaced (the same rule as addItem) and the rest are appended. Pass true as the second argument to overwrite the entire betslip with the provided items instead:

const { addItems } = useBaseBetslip()
 
// merge into the current betslip
addItems([ firstItem, secondItem ])
 
// replace the whole betslip
addItems([ firstItem, secondItem ], true)
ℹ️

The odds is an object where the key combination is determined by the concatenation of conditionId and outcomeId:

odds[`${conditionId}-${outcomeId}`]
ℹ️

The states is an object where the key combination corresponds to conditionId:

states[conditionId]

Storing additional data

You can extend the betslip item in your global.d.ts to suit your needs by adding additional fields to the BetslipItem interface. This allows you to customize the data structure and store extra information as required for your application:

  1. Expand a namespace in global in your global.d.ts file:
global.d.ts
declare global {
  namespace AzuroSDK {
    interface BetslipItem {
      marketName: string
      selectionName: string
    }
  }
}
  1. That’s it! Now you can provide additional data:
const { addItem } = useBaseBetslip()
 
addItem({
  conditionId: '...',
  outcomeId: '...',
  gameId: '...',
  isExpressForbidden: true,
  marketName: 'FTB',
  selectionName: '1',
})

Example can be found here .

Props

type BetslipProviderProps = {
  children: React.ReactNode
  affiliate?: Address // affiliate wallet address; enables fetching available freebets for the selections
}

Return Value

type BaseBetslipContextValue = {
  items: AzuroSDK.BetslipItem[] // betslip items
  addItem: (itemProps: AzuroSDK.BetslipItem) => void // function for adding a new item
  addItems: (items: AzuroSDK.BetslipItem[], replace?: boolean) => void // function for adding multiple items at once; pass replace=true to overwrite the whole betslip
  removeItem: (itemProps: RemoveItemProps) => void // function for removing item from betslip
  clear: () => void // function for clearing betslip
}
 
type DetailedBetslipContextValue = {
  betAmount: string // bet amount for single and combo bet
  odds: Record<string, number> // odds for each item
  totalOdds: number // total bet odds
  maxBet: number | undefined // maximum bet amount
  minBet: number | undefined // minimum bet amount
  selectedFreebet: Freebet | undefined // currently selected freebet
  freebets: Freebet[] | undefined | null // freebets available for the current selections
  states: Record<string, ConditionState> // condition status for each item
  outcomeStates: Record<string, OutcomeState> // outcome status for each item, key is `${conditionId}-${outcomeId}`
  disableReason: BetslipDisableReason | undefined // reason for prohibiting the bet
  changeBetAmount: (value: string) => void // function for changing bet amount
  selectFreebet: (value?: Freebet) => void // function for selecting a freebet, pass undefined to unselect
  isStatesFetching: boolean // indicates condition states fetching
  isOutcomeStatesFetching: boolean // indicates outcome states fetching
  isOddsFetching: boolean // indicates odds fetching
  isFreebetsFetching: boolean // indicates freebets fetching
  isMaxBetFetching: boolean // @deprecated use isBetCalculationFetching instead
  isBetCalculationFetching: boolean // indicates min/max bet calculation fetching
  isBetAllowed: boolean // true if bet can be placed
}
 
enum BetslipDisableReason {
  ConditionState = 'ConditionState', // one or more selected conditions or outcomes have been removed or suspended
  BetAmountGreaterThanMaxBet = 'BetAmountGreaterThanMaxBet', // bet amount exceeds max bet
  BetAmountLowerThanMinBet = 'BetAmountLowerThanMinBet', // bet amount lower than min bet
  ComboWithForbiddenItem = 'ComboWithForbiddenItem', // one or more conditions can't be used in combo
  ComboWithSameGame = 'ComboWithSameGame', // outcomes from same game can't be used in combo
  SelectedOutcomesTemporarySuspended = 'SelectedOutcomesTemporarySuspended', // max bet is zero — selected outcomes temporarily suspended
  TotalOddsTooLow = 'TotalOddsTooLow', // combo total odds below the allowed minimum
  PrematchConditionInStartedGame = 'PrematchConditionInStartedGame', // @deprecated (v2 only) pre-match item in a started game
  FreeBetExpired = 'FreeBetExpired', // selected freebet has expired
}
 
declare global {
  namespace AzuroSDK {
    interface BetslipItem extends Selection {
      gameId: string
      isExpressForbidden: boolean
    }
  }
}
 
type Selection = {
  outcomeId: string
  conditionId: string
}
 
type RemoveItemProps = Selection
ℹ️

selectedFreebet and freebets use the Freebet type returned by useAvailableFreebets — see that hook for the full type shape, and the freebets guide for how freebets are selected and applied.

SocketuseSports