How to use the @aragon/api-react.useApi function in @aragon/api-react

export function useWithdrawAction(onDone) {
  const api = useApi()

  return useCallback(
    count => {
      api.withdrawTokens(count).toPromise()
      onDone()
    },
    [api, onDone]
  )
}

function NewRequest({ network, panelOpened, onRequest }) {
  const { acceptedTokens, account, token, ready } = useAppState()
  const api = useApi()
  const isMainnet = network.type === 'main'

  const [selectedToken, setSelectedToken] = useState({ ...initialState.selectedToken })
  const [depositedAmount, setDepositedAmount] = useState({ ...initialState.amount })
  const [selectedTokenData, setSelectedTokenData] = useState({ ...initialState.selectedTokenData })
  const [requestedAmount, setRequestedAmount] = useState('')
  const [tokenBalanceMessage, setTokenBalanceMessage] = useState('')
  const [depositErrorMessage, setDepositErrorMessage] = useState(initialState.depositErrorMessage)
  const [submitButtonDisabled, setSubmitButtonDisabled] = useState(initialState.submitButtonDisabled)
  const [isTokenSelected, setIsTokenSelected] = useState(initialState.isTokenSelected)
  const [orgToken, setOrgToken] = useState(initialState.orgToken)

  useEffect(() => {
    async function getSelectedTokenData() {
      const tokenData = await loadTokenData(selectedToken.value)
      setSelectedTokenData(tokenData)