@xylabs/sdk-react 2.12.12 → 2.13.3

package/src/components/ScrollToTopButton.tsx

@@ -1,31 +0,0 @@
-import { Box, useScrollTrigger, useTheme, Zoom, ZoomProps } from '@mui/material'
-import React from 'react'
-
-export interface ScrollToTopButtonProps extends ZoomProps {
-  anchorId: string
-}
-
-export const ScrollToTopButton: React.FC<ScrollToTopButtonProps> = ({ children, anchorId, ...props }) => {
-  const trigger = useScrollTrigger({
-    disableHysteresis: true,
-    threshold: 100,
-  })
-
-  const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {
-    const anchor = ((event.target as HTMLDivElement).ownerDocument || document).querySelector(`#${anchorId}`)
-
-    if (anchor) {
-      anchor.scrollIntoView({ behavior: 'smooth', block: 'center' })
-    }
-  }
-
-  const theme = useTheme()
-
-  return (
-    <Zoom in={trigger} {...props}>
-      <Box zIndex={10} position="fixed" right={theme.spacing(2)} bottom={theme.spacing(2)} onClick={handleClick} role="presentation">
-        {children}
-      </Box>
-    </Zoom>
-  )
-}

package/src/components/SelectEx.tsx

@@ -1,14 +0,0 @@
-import { PaletteMode, Select, SelectProps, useTheme } from '@mui/material'
-import merge from 'lodash/merge'
-
-export interface SelectExProps<T> extends SelectProps<T> {
-  colorize?: 'primary' | 'secondary'
-  mode?: PaletteMode
-}
-
-export const SelectEx: <T>(props: SelectExProps<T>) => JSX.Element = ({ MenuProps, mode = 'light', colorize, ...props }) => {
-  const theme = useTheme()
-  const colorizeMenuProps = colorize ? { MenuListProps: { sx: { backgroundColor: theme.palette[colorize][mode] } } } : {}
-
-  return <Select MenuProps={merge(MenuProps, colorizeMenuProps)} {...props} />
-}

package/src/components/TokenAmount/TokenAmount.stories.tsx

@@ -1,63 +0,0 @@
-import { ComponentMeta, ComponentStory } from '@storybook/react'
-import { BigNumber } from '@xylabs/sdk-js'
-
-import { TokenAmount } from './TokenAmount'
-
-const StorybookEntry = {
-  argTypes: {},
-  component: TokenAmount,
-  parameters: {
-    docs: {
-      page: null,
-    },
-  },
-  title: 'Components/TokenAmount',
-} as ComponentMeta<typeof TokenAmount>
-
-const Template: ComponentStory<typeof TokenAmount> = (args) => <TokenAmount {...args}></TokenAmount>
-
-const Default = Template.bind({})
-Default.args = {
-  amount: new BigNumber('1195c751dbcc90ab4200000', 16),
-}
-
-const WithNull = Template.bind({})
-WithNull.args = {
-  amount: null,
-}
-
-const WithUndefined = Template.bind({})
-WithUndefined.args = {
-  amount: undefined,
-}
-
-const WithLogo = Template.bind({})
-WithLogo.args = {
-  amount: new BigNumber('1195c751dbcc90ab4200000', 16),
-  logo: true,
-}
-
-const WithLogoAndColor = Template.bind({})
-WithLogoAndColor.args = {
-  amount: new BigNumber('1195c751dbcc90ab4200000', 16),
-  logo: true,
-  statusColor: '#ff0',
-}
-
-const WithLabel = Template.bind({})
-WithLabel.args = {
-  amount: new BigNumber('1195c751dbcc90ab4200000', 16),
-  label: 'Balance',
-}
-
-const WithLogoAndLabel = Template.bind({})
-WithLogoAndLabel.args = {
-  amount: new BigNumber('1195c751dbcc90ab4200000', 16),
-  label: 'Balance',
-  logo: true,
-}
-
-export { Default, WithLabel, WithLogo, WithLogoAndColor, WithLogoAndLabel, WithNull, WithUndefined }
-
-// eslint-disable-next-line import/no-default-export
-export default StorybookEntry

package/src/components/TokenAmount/TokenAmount.tsx

@@ -1,53 +0,0 @@
-import { Typography } from '@mui/material'
-import { BigNumber } from '@xylabs/sdk-js'
-
-import { ButtonEx } from '../ButtonEx'
-import { FlexRow } from '../FlexBox'
-import xyoLogo from './img/xyo.svg'
-import { TokenAmountProps } from './TokenAmountProps'
-
-const base10Shift = (bn: BigNumber, places: number) => {
-  const factor = new BigNumber(10).pow(new BigNumber(Math.abs(places)))
-  if (places > 0) {
-    return bn.mul(factor)
-  } else {
-    return bn.div(factor)
-  }
-}
-
-const TokenAmount: React.FC<TokenAmountProps> = ({
-  textFontFamily = '"Source Code Pro",monospace',
-  textColor,
-  statusColor,
-  style,
-  amount,
-  places = -18,
-  logo,
-  label,
-  onButtonClick,
-  ...props
-}) => {
-  const adjustedAmount = amount ? base10Shift(amount, places).toNumber() : undefined
-
-  const amountString = adjustedAmount ? Math.trunc(adjustedAmount).toLocaleString() : '-'
-
-  return (
-    <ButtonEx style={{ backgroundColor: statusColor, ...style }} variant="outlined" onClick={onButtonClick} {...props}>
-      <FlexRow justifyContent="space-between" width="100%" busy={amount === undefined} busySize={16}>
-        <FlexRow>
-          {logo ? <img src={xyoLogo} height={24} /> : null}
-          {label ? (
-            <Typography marginRight={1} marginLeft={logo ? 1 : 0} noWrap={true} fontFamily={textFontFamily} variant="caption">
-              {label}
-            </Typography>
-          ) : null}
-        </FlexRow>
-        <Typography color={textColor} noWrap={true} fontFamily={textFontFamily} variant="body1" style={{ textTransform: 'none' }}>
-          {amountString}
-        </Typography>
-      </FlexRow>
-    </ButtonEx>
-  )
-}
-
-export { TokenAmount }

package/src/components/TokenAmount/TokenAmountProps.tsx

@@ -1,17 +0,0 @@
-import { BigNumber } from '@xylabs/sdk-js'
-import { MouseEventHandler } from 'react'
-
-import { ButtonExProps } from '../ButtonEx'
-
-interface TokenAmountProps extends ButtonExProps {
-  amount?: BigNumber | null
-  label?: string
-  logo?: boolean
-  places?: number
-  textFontFamily?: string
-  textColor?: string
-  statusColor?: string
-  onButtonClick?: MouseEventHandler<HTMLButtonElement>
-}
-
-export type { TokenAmountProps }

package/src/components/TokenAmount/img/xyo.svg

@@ -1 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 238"><defs><style>.cls-1{fill:#999;}</style></defs><title>icon_gray</title><path class="cls-1" d="M74.5,28.33,21.29,120.5,74.5,212.67H180.94l1.76-3,51.46-89.13L180.94,28.33ZM84.65,40.54h78.83L111.65,56.93a15.85,15.85,0,0,1,2,5l59.66-18.81L185.22,101a20.12,20.12,0,0,1,5.36-.78l-10-47.91,37.87,65.53h-7.62a24.21,24.21,0,0,1,.15,2.68,23.29,23.29,0,0,1-.15,2.68h7.62l-39.1,67.75,10.92-50.13A20.57,20.57,0,0,1,185,140l-12.88,59-58.37-19.53a17.61,17.61,0,0,1-1.7,5l47.5,15.92H84.65l4-6.85A20.17,20.17,0,0,1,83.93,191L80,197.78,42.67,133.13l37,32.66a20.52,20.52,0,0,1,3.6-4L36.69,120.66,85,77.79a17.45,17.45,0,0,1-3.19-4.32l-39.46,35L80,43.22l5.56,9.69A17.51,17.51,0,0,1,90.12,50Zm28.24,31.17a16.15,16.15,0,0,1-2.68,4.64l62,35.81a19.74,19.74,0,0,1,2.83-4.54Zm-20,10.51v75.33a18,18,0,0,1,2.47-.16,17.18,17.18,0,0,1,2.89.21v-75a11.21,11.21,0,0,1-1.29,0,17.57,17.57,0,0,1-4.07-.47Zm79.34,46.63-62.08,35.81a18.45,18.45,0,0,1,2.68,4.68l62.23-36a19.68,19.68,0,0,1-2.83-4.53Z"/><path class="cls-1" d="M97,48.58a17.06,17.06,0,1,0,17,17,17.08,17.08,0,0,0-17-17Zm0,5.36a11.7,11.7,0,1,1-11.7,11.69A11.65,11.65,0,0,1,97,53.94Z"/><path class="cls-1" d="M95.37,157.39a18.73,18.73,0,1,0,18.7,18.7,18.74,18.74,0,0,0-18.7-18.7Zm0,5.31A13.4,13.4,0,1,1,82,176.09a13.37,13.37,0,0,1,13.4-13.39Z"/><path class="cls-1" d="M190.73,100.2A20.3,20.3,0,1,0,211,120.5a20.34,20.34,0,0,0-20.3-20.3Zm0,5.36a14.94,14.94,0,1,1-14.94,14.94,14.88,14.88,0,0,1,14.94-14.94Z"/></svg>

package/src/components/TokenAmount/index.ts

@@ -1,5 +0,0 @@
-import { TokenAmount } from './TokenAmount'
-import { TokenAmountProps } from './TokenAmountProps'
-
-export { TokenAmount }
-export type { TokenAmountProps }

package/src/components/dialogs/ErrorDialog.stories.tsx

@@ -1,27 +0,0 @@
-import { ComponentMeta, ComponentStory } from '@storybook/react'
-
-import { ErrorDialog } from './ErrorDialog'
-
-const StorybookEntry = {
-  argTypes: {},
-  component: ErrorDialog,
-  parameters: {
-    docs: {
-      page: null,
-    },
-  },
-  title: 'Dialogs/ErrorDialog',
-} as ComponentMeta<typeof ErrorDialog>
-
-const Template: ComponentStory<typeof ErrorDialog> = (args) => <ErrorDialog {...args}></ErrorDialog>
-
-const Default = Template.bind({})
-Default.args = {
-  error: Error('Test Error'),
-  title: 'Test Error',
-}
-
-export { Default }
-
-// eslint-disable-next-line import/no-default-export
-export default StorybookEntry

package/src/components/dialogs/ErrorDialog.tsx

@@ -1,57 +0,0 @@
-import { Dialog, DialogActions, DialogContent, DialogProps, DialogTitle, Typography } from '@mui/material'
-import { AxiosError } from 'axios'
-
-import { ButtonEx } from '../ButtonEx'
-import { FlexRow } from '../FlexBox'
-
-export interface ErrorDialogProps extends DialogProps {
-  error?: Error
-  onAction?: (retry: boolean) => void
-  title?: string
-}
-
-const toAxiosError = (error: Error) => {
-  return (error as AxiosError).isAxiosError ? (error as AxiosError) : undefined
-}
-
-const ErrorDialogOpen: React.FC<ErrorDialogProps> = ({ onAction, title = 'Oops. Something went wrong.', error = Error('Unknown Error'), ...props }) => {
-  const onCloseClicked = () => {
-    onAction?.(false)
-  }
-
-  const onRetryClicked = () => {
-    onAction?.(true)
-  }
-
-  const axiosError = toAxiosError(error)
-  const message = error.message ?? error.toString()
-
-  return (
-    <Dialog {...props}>
-      <DialogTitle>{title}</DialogTitle>
-      <DialogContent>
-        <FlexRow>
-          <Typography color="error">{axiosError ? `${message} [${axiosError?.code ?? 'Connection Failure'}]` : `${message}`}</Typography>
-        </FlexRow>
-      </DialogContent>
-      <DialogActions>
-        <FlexRow justifyContent="space-between" width="100%" minWidth="300px">
-          <ButtonEx onClick={onCloseClicked} variant="text">
-            Close
-          </ButtonEx>
-          <ButtonEx onClick={onRetryClicked} variant="text">
-            Retry
-          </ButtonEx>
-        </FlexRow>
-      </DialogActions>
-    </Dialog>
-  )
-}
-
-export const ErrorDialog: React.FC<ErrorDialogProps> = ({ open, error, ...props }) => {
-  if (error) {
-    return <ErrorDialogOpen open={!!error || open} error={error} {...props} />
-  } else {
-    return null
-  }
-}

package/src/components/dialogs/MessageDialog.stories.tsx

@@ -1,27 +0,0 @@
-import { ComponentMeta, ComponentStory } from '@storybook/react'
-
-import { MessageDialog } from './MessageDialog'
-
-const StorybookEntry = {
-  argTypes: {},
-  component: MessageDialog,
-  parameters: {
-    docs: {
-      page: null,
-    },
-  },
-  title: 'Dialogs/MessageDialog',
-} as ComponentMeta<typeof MessageDialog>
-
-const Template: ComponentStory<typeof MessageDialog> = (args) => <MessageDialog {...args}>Test Message</MessageDialog>
-
-const Default = Template.bind({})
-Default.args = {
-  open: true,
-  title: 'Test Error',
-}
-
-export { Default }
-
-// eslint-disable-next-line import/no-default-export
-export default StorybookEntry

package/src/components/dialogs/MessageDialog.tsx

@@ -1,29 +0,0 @@
-import { Button, Dialog, DialogActions, DialogContent, DialogProps, DialogTitle } from '@mui/material'
-
-import { FlexCol, FlexRow } from '../FlexBox'
-
-export interface MessageDialogProps extends DialogProps {
-  onOk?: () => void
-  onCancel?: () => void
-}
-
-export const MessageDialog: React.FC<MessageDialogProps> = ({ onOk, onCancel, children, title, ...props }) => {
-  return (
-    <Dialog {...props}>
-      <DialogTitle>{title}</DialogTitle>
-      <DialogContent>
-        <FlexCol alignItems="stretch">{children}</FlexCol>
-      </DialogContent>
-      <DialogActions>
-        <FlexRow justifyContent="space-between" width="100%">
-          <Button onClick={onCancel} variant="text">
-            Cancel
-          </Button>
-          <Button onClick={onOk} variant="text">
-            Ok
-          </Button>
-        </FlexRow>
-      </DialogActions>
-    </Dialog>
-  )
-}

package/src/components/dialogs/index.ts

@@ -1,2 +0,0 @@
-export * from './ErrorDialog'
-export * from './MessageDialog'

package/src/components/index.ts

@@ -1,26 +0,0 @@
-export * from './AppBarEx'
-export * from './Background'
-export * from './BasePage'
-export * from './Breadcrumbs'
-export * from './ButtonEx'
-export * from './CookieConsent'
-export * from './CoverProgress'
-export * from './dialogs'
-export * from './EthAccount'
-export * from './Experiments'
-export * from './FlexBox'
-export * from './HoverScale'
-export * from './Identicon'
-export * from './InvertableThemeProvider'
-export * from './LinkEx'
-export * from './MenuEx'
-export * from './NumberStatus'
-export * from './Pixel'
-export * from './Portal'
-export * from './QuickTipButton'
-export * from './RedirectWithQuery'
-export * from './RichResult'
-export * from './ScrollToTop'
-export * from './ScrollToTopButton'
-export * from './SelectEx'
-export * from './TokenAmount'

package/src/contexts/CookieConsent/Context.ts

@@ -1,9 +0,0 @@
-import { createContext } from 'react'
-
-const CookieConsentContext = createContext<{
-  accepted?: boolean
-  setAccepted?: (accepted: boolean) => void
-  clearAccepted?: () => void
-  storageName?: string
-}>({})
-export { CookieConsentContext }

package/src/contexts/CookieConsent/Loader.tsx

@@ -1,33 +0,0 @@
-import { useState } from 'react'
-
-import { WithChildren } from '../../WithChildren'
-import { CookieConsentContext } from './Context'
-
-const CookiesAcceptedLocalStorageName = 'CookiesAccepted'
-
-const CookieConsentLoader: React.FC<WithChildren> = ({ children }) => {
-  const getAcceptedFromLocalStorage = () => {
-    return localStorage.getItem(CookiesAcceptedLocalStorageName) === 'true'
-  }
-  const setAcceptedToLocalStorage = (accepted: boolean) => {
-    localStorage.setItem(CookiesAcceptedLocalStorageName, accepted ? 'true' : 'false')
-  }
-  const [accepted, setAccepted] = useState(getAcceptedFromLocalStorage())
-  const setAcceptedHandler = (accepted: boolean) => {
-    setAcceptedToLocalStorage(accepted)
-    setAccepted(accepted)
-  }
-
-  const clearAccepted = () => {
-    localStorage.removeItem(CookiesAcceptedLocalStorageName)
-    setAccepted(getAcceptedFromLocalStorage())
-  }
-
-  return (
-    <CookieConsentContext.Provider value={{ accepted, clearAccepted, setAccepted: setAcceptedHandler, storageName: CookiesAcceptedLocalStorageName }}>
-      {children}
-    </CookieConsentContext.Provider>
-  )
-}
-
-export { CookieConsentLoader }

package/src/contexts/CookieConsent/index.ts

@@ -1,5 +0,0 @@
-import { CookieConsentContext } from './Context'
-import { CookieConsentLoader } from './Loader'
-import { useCookieConsent } from './use'
-
-export { CookieConsentContext, CookieConsentLoader, useCookieConsent }

package/src/contexts/CookieConsent/use.ts

@@ -1,9 +0,0 @@
-import { useContext } from 'react'
-
-import { CookieConsentContext } from './Context'
-
-const useCookieConsent = () => {
-  return useContext(CookieConsentContext)
-}
-
-export { useCookieConsent }

package/src/contexts/Ethers/Context.ts

@@ -1,21 +0,0 @@
-import { Signer } from '@ethersproject/abstract-signer'
-import { Provider } from '@ethersproject/providers'
-import { EthAddress } from '@xylabs/sdk-js'
-import { createContext } from 'react'
-
-export interface EthersData {
-  busy?: boolean
-  chainId?: number | null
-  connect?: () => Promise<string[] | undefined>
-  connectRefused?: boolean
-  error?: Error | null
-  isConnected?: boolean
-  localAddress?: EthAddress | null
-  provider?: Provider | null
-  providerName?: string
-  showConnectWalletDialog?: () => void
-  signer?: Signer | null
-  walletProvider?: Provider | null
-}
-
-export const EthersContext = createContext<EthersData>({})

package/src/contexts/Ethers/Infura.tsx

@@ -1,31 +0,0 @@
-import { InfuraProvider } from '@ethersproject/providers'
-import React, { PropsWithChildren } from 'react'
-
-import { EthersContext } from './Context'
-
-interface Props {
-  enabled?: boolean
-}
-
-export const infuraKey = '1d9f8053c65a49cfb99fafaa8ef201c0'
-
-export const InfuraEthersLoader: React.FC<PropsWithChildren<Props>> = (props) => {
-  const { children } = props
-
-  const chainId = 1
-  const provider = new InfuraProvider(1, infuraKey)
-
-  return (
-    <EthersContext.Provider
-      value={{
-        busy: false,
-        chainId,
-        isConnected: true,
-        provider,
-        signer: null,
-      }}
-    >
-      {children}
-    </EthersContext.Provider>
-  )
-}

package/src/contexts/Ethers/Loader.tsx

@@ -1,40 +0,0 @@
-import { ReactNode } from 'react'
-
-import { InfuraEthersLoader } from './Infura'
-import { MetaMaskEthersLoader } from './MetaMask'
-import { MyEtherWalletEthersLoader } from './MyEtherWallet'
-import { OperaEthersLoader } from './Opera'
-import { TrustEthersLoader } from './Trust'
-
-export interface EthersLoaderProps {
-  enabled?: boolean
-  children?: ReactNode
-}
-
-export const EthersLoader: React.FC<EthersLoaderProps> = (props) => {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const global = window as any
-  const { children } = props
-
-  if (global.ethereum?.isMetaMask) {
-    return <MetaMaskEthersLoader>{children}</MetaMaskEthersLoader>
-  }
-
-  if (global.ethereum?.isTrust) {
-    return <TrustEthersLoader>{children}</TrustEthersLoader>
-  }
-
-  if (global.ethereum?.isMew) {
-    return <MyEtherWalletEthersLoader>{children}</MyEtherWalletEthersLoader>
-  }
-
-  if (global.ethereum?.providerName === 'opera') {
-    return <OperaEthersLoader>{children}</OperaEthersLoader>
-  }
-
-  if (global.ethereum) {
-    return <OperaEthersLoader>{children}</OperaEthersLoader>
-  }
-
-  return <InfuraEthersLoader>{children}</InfuraEthersLoader>
-}

package/src/contexts/Ethers/MetaMask.tsx

@@ -1,143 +0,0 @@
-import { InfuraProvider, JsonRpcSigner, Provider, Web3Provider } from '@ethersproject/providers'
-import { MetaMaskInpageProvider } from '@metamask/providers'
-import { EthAddress } from '@xylabs/sdk-js'
-import React, { PropsWithChildren, useEffect, useState } from 'react'
-
-import { useAsyncEffect } from '../../lib'
-import { EthersContext } from './Context'
-import { infuraKey } from './Infura'
-
-interface Props {
-  enabled?: boolean
-}
-
-export const MetaMaskEthersLoader: React.FC<PropsWithChildren<Props>> = (props) => {
-  const { children, enabled = true } = props
-
-  const ethereum = window.ethereum as MetaMaskInpageProvider
-  const [error, setError] = useState<Error>()
-  const [localAddress, setLocalAddress] = useState<EthAddress>()
-  const [resetCount, setResetCount] = useState(0)
-  const [providerName, setProviderName] = useState<string>()
-
-  const connect = async () => {
-    const accounts = await walletProvider?.send('eth_requestAccounts', [])
-    // We could have multiple accounts. Check for one.
-    if (accounts.length !== 0) {
-      setLocalAddress(accounts[0])
-      console.log('Connected: ', accounts[0])
-    } else {
-      console.log('No authorized account found.')
-    }
-    return accounts
-  }
-
-  const [isConnected, setIsConnected] = useState<boolean>()
-
-  const [walletProvider, setWalletProvider] = useState<Web3Provider | null>()
-  const [provider, setProvider] = useState<Provider>()
-  const [signer, setSigner] = useState<JsonRpcSigner | null>()
-
-  useEffect(() => {
-    if (provider && enabled) {
-      provider.on('accountsChanged', (accounts: string[]) => {
-        console.log(`accountsChanged: ${JSON.stringify(accounts)}`)
-        setResetCount(resetCount + 1)
-        if (accounts.length > 0) {
-          setLocalAddress(EthAddress.fromString(accounts[0]))
-        } else {
-          setLocalAddress(undefined)
-        }
-      })
-      provider.on('chainChanged', (chainId: string) => {
-        setResetCount(resetCount + 1)
-        if (chainId) {
-          setChainId(parseInt(chainId))
-        } else {
-          setChainId(undefined)
-        }
-      })
-    }
-  }, [provider, resetCount, enabled])
-
-  useEffect(() => {
-    if (enabled) {
-      const walletProvider = ethereum ? new Web3Provider(window.ethereum) : null
-      let provider = null
-      let providerName = null
-      if (walletProvider) {
-        provider = walletProvider
-        providerName = 'Meta Mask'
-      } else {
-        provider = new InfuraProvider(1, infuraKey)
-        providerName = 'Infura (Default)'
-      }
-      provider = walletProvider ?? provider
-      setProvider(provider)
-      setProviderName(providerName)
-      setWalletProvider(walletProvider)
-      let signer = null
-      try {
-        signer = walletProvider?.getSigner()
-      } catch (ex) {
-        console.error(ex)
-      }
-      setSigner(signer)
-    }
-  }, [ethereum, isConnected, enabled])
-
-  useAsyncEffect(
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    async (isMounted) => {
-      if (signer && enabled) {
-        try {
-          const localAddress = EthAddress.fromString(await signer.getAddress())
-          console.log(`Setting Local Address: ${localAddress}`)
-          if (isMounted()) {
-            setLocalAddress(localAddress)
-            setIsConnected(true)
-          }
-        } catch (ex) {
-          if (isMounted()) {
-            setError(Error(`localAddress: ${ex}`))
-            setLocalAddress(undefined)
-            setIsConnected(false)
-          }
-        }
-      }
-    },
-    [signer, resetCount, enabled]
-  )
-
-  const [chainId, setChainId] = useState<number>()
-  useAsyncEffect(
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    async (isMounted) => {
-      if (enabled) {
-        const chainId = (await provider?.getNetwork())?.chainId
-        if (!isMounted()) return
-        setChainId(chainId)
-      }
-    },
-    [provider, enabled]
-  )
-
-  return (
-    <EthersContext.Provider
-      value={{
-        busy: false,
-        chainId,
-        connect,
-        error,
-        isConnected,
-        localAddress,
-        provider,
-        providerName,
-        signer: isConnected ? signer : undefined,
-        walletProvider,
-      }}
-    >
-      {children}
-    </EthersContext.Provider>
-  )
-}