8 | {children}
9 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "short_name": "Arb Bridge",
3 | "name": "Arbitrum Token Bridge",
4 | "icons": [
5 | {
6 | "src": "favicon.ico",
7 | "sizes": "64x64 32x32 24x24 16x16",
8 | "type": "image/x-icon"
9 | }
10 | ],
11 | "start_url": ".",
12 | "display": "standalone",
13 | "theme_color": "#000000",
14 | "background_color": "#ffffff"
15 | }
16 |
--------------------------------------------------------------------------------
/.github/actions/restore-build-artifacts/action.yml:
--------------------------------------------------------------------------------
1 | name: Restore build artifacts
2 | description: Restore build artifacts
3 |
4 | runs:
5 | using: composite
6 | steps:
7 | - name: Restore build artifacts
8 | uses: actions/cache/restore@v4
9 | with:
10 | path: |
11 | ./packages/arb-token-bridge-ui/build
12 | key: build-artifacts-${{ github.run_id }}
13 | fail-on-cache-miss: true
14 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/utils.ts:
--------------------------------------------------------------------------------
1 | import { ChainId } from '../../../util/networks'
2 |
3 | export enum NetworkType {
4 | parentChain = 'parentChain',
5 | childChain = 'childChain'
6 | }
7 |
8 | export function shouldOpenOneNovaDialog(selectedChainIds: number[]) {
9 | return [ChainId.ArbitrumOne, ChainId.ArbitrumNova].every(chainId =>
10 | selectedChainIds.includes(chainId)
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/images/GeistMainnetLogo.svg:
--------------------------------------------------------------------------------
1 |
5 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/tests/e2e/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "baseUrl": "../../../../",
4 | "types": [
5 | "cypress.d.ts",
6 | "@synthetixio/synpress/support",
7 | "cypress-wait-until",
8 | "@testing-library/cypress"
9 | ],
10 | "outDir": "./output",
11 | "resolveJsonModule": true,
12 | "esModuleInterop": true
13 | },
14 | "include": ["**/*.*"],
15 | "exclude": ["node_modules"]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/scripts/src/addOrbitChain/github.ts:
--------------------------------------------------------------------------------
1 | import { context, getOctokit } from "@actions/github";
2 | import { Issue } from "./schemas";
3 |
4 | const github = getOctokit(process.env.GITHUB_TOKEN || "");
5 |
6 | export const getIssue = async (issueNumber: string): Promise
4 |
5 | Cannot connect from your location
6 |
7 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/tsconfig.base.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es6",
4 | "lib": ["dom", "dom.iterable", "esnext"],
5 | "allowJs": true,
6 | "skipLibCheck": true,
7 | "esModuleInterop": true,
8 | "allowSyntheticDefaultImports": true,
9 | "strict": true,
10 | "forceConsistentCasingInFileNames": true,
11 | "noFallthroughCasesInSwitch": true,
12 | "module": "esnext",
13 | "moduleResolution": "node",
14 | "resolveJsonModule": true,
15 | "isolatedModules": true,
16 | "noUncheckedIndexedAccess": true,
17 | "jsx": "react-jsx"
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/state/index.ts:
--------------------------------------------------------------------------------
1 | import { IContext } from 'overmind'
2 | import { createActionsHook, createStateHook } from 'overmind-react'
3 | import { namespaced } from 'overmind/config'
4 |
5 | import * as app from './app'
6 |
7 | export const config = namespaced({
8 | app: app.config
9 | })
10 |
11 | export type Context = IContext<{
12 | state: typeof config.state
13 | actions: typeof config.actions
14 | effects: typeof config.effects
15 | }>
16 |
17 | export const useAppState = createStateHook8 | We apologize, this page is not available in certain jurisdictions due to 9 | legal restrictions. 10 |
11 |
7 | 404
8 |
15 | )
16 | }
17 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/hooks/useIsTestnetMode.ts:
--------------------------------------------------------------------------------
1 | import { useCallback } from 'react'
2 | import { useNetworks } from './useNetworks'
3 | import { ChainId, isNetwork } from '../util/networks'
4 |
5 | export const useIsTestnetMode = () => {
6 | const [networks, setNetworks] = useNetworks()
7 |
8 | const isTestnetMode = isNetwork(networks.sourceChain.id).isTestnet
9 |
10 | const toggleTestnetMode = useCallback(() => {
11 | setNetworks({
12 | sourceChainId: isTestnetMode ? ChainId.Ethereum : ChainId.Sepolia
13 | })
14 | }, [isTestnetMode, setNetworks])
15 |
16 | return [isTestnetMode, toggleTestnetMode] as const
17 | }
18 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/components/Sidebar/AppSidebar.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 | import dynamic from 'next/dynamic'
3 | import { usePostHog } from 'posthog-js/react'
4 |
5 | // Dynamically import the Sidebar component with SSR disabled
6 | const DynamicSidebar = dynamic(
7 | () => import('@offchainlabs/cobalt').then(mod => ({ default: mod.Sidebar })),
8 | { ssr: false }
9 | )
10 |
11 | export const AppSidebar = () => {
12 | const posthog = usePostHog()
13 | return (
14 | Page not found in this solar system
9 |
15 |
17 | )
18 | }
19 |
--------------------------------------------------------------------------------
/tsconfig.eslint.json:
--------------------------------------------------------------------------------
1 | {
2 | // extend your base config to share compilerOptions, etc
3 | "extends": "./tsconfig.base.json",
4 | "compilerOptions": {
5 | // ensure that nobody can accidentally use this config for a build
6 | "noEmit": true
7 | },
8 | "include": [
9 | // whatever paths you intend to lint
10 | // adding eslintrc here fixes eslint from throwing an error
11 | // https://stackoverflow.com/questions/63118405/how-to-fix-eslintrc-the-file-does-not-match-your-project-config
12 | ".eslintrc.js",
13 | "./packages/arb-token-bridge-ui/tests/**/*.ts",
14 | "./packages/arb-token-bridge-ui/synpress*.ts"
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/util/deposits/__tests__/fetchDepositsTestHelpers.ts:
--------------------------------------------------------------------------------
1 | const sender = '0x5d64a0fd6af0d76a7ed189d4061ffa6823fbf97e'
2 |
3 | const baseQuery = {
4 | sender,
5 | l2ChainId: 42161,
6 | pageSize: 100
7 | }
8 |
9 | export function getQueryCoveringClassicOnlyWithoutResults() {
10 | return { ...baseQuery, fromBlock: 0, toBlock: 14309825 }
11 | }
12 |
13 | export function getQueryCoveringClassicOnlyWithResults() {
14 | return { ...baseQuery, fromBlock: 14309825, toBlock: 14428639 }
15 | }
16 |
17 | export function getQueryCoveringClassicAndNitroWithResults() {
18 | return { ...baseQuery, fromBlock: 15362737, toBlock: 15517648 }
19 | }
20 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/hooks/useChainId.ts:
--------------------------------------------------------------------------------
1 | import { useState, useEffect } from 'react'
2 | import { providers } from 'ethers'
3 |
4 | export function useChainId({ provider }: { provider: providers.Provider }) {
5 | const [chainId, setChainId] = useState{children}
29 |
9 |
14 | )
15 | }
16 |
17 | export function SecurityNotGuaranteed() {
18 | return (
19 |
10 |
13 |
20 |
25 | )
26 | }
27 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/components/syncers/useBalanceUpdater.tsx:
--------------------------------------------------------------------------------
1 | import { useInterval, useLatest } from 'react-use'
2 | import { useAccount } from 'wagmi'
3 |
4 | import { useAppState } from '../../state'
5 | import { useUpdateUSDCBalances } from '../../hooks/CCTP/useUpdateUSDCBalances'
6 |
7 | // Updates all balances periodically
8 | export function useBalanceUpdater() {
9 | const {
10 | app: { arbTokenBridge, selectedToken }
11 | } = useAppState()
12 | const { address: walletAddress } = useAccount()
13 | const latestTokenBridge = useLatest(arbTokenBridge)
14 |
15 | const { updateUSDCBalances } = useUpdateUSDCBalances({
16 | walletAddress
17 | })
18 |
19 | useInterval(() => {
20 | updateUSDCBalances()
21 |
22 | if (selectedToken) {
23 | latestTokenBridge?.current?.token?.updateTokenData(selectedToken.address)
24 | }
25 | }, 10000)
26 | }
27 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/images/XMTPLogo.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/hooks/__tests__/helpers.ts:
--------------------------------------------------------------------------------
1 | import { getArbitrumNetwork } from '@arbitrum/sdk'
2 | import { ChainWithRpcUrl } from '../../util/networks'
3 |
4 | export function createMockOrbitChain({
5 | chainId,
6 | parentChainId
7 | }: {
8 | chainId: number
9 | parentChainId: number
10 | }): ChainWithRpcUrl {
11 | const isTestnet =
12 | parentChainId === 1 ? false : getArbitrumNetwork(parentChainId).isTestnet
13 |
14 | return {
15 | chainId: chainId,
16 | confirmPeriodBlocks: 45818,
17 | ethBridge: {
18 | bridge: '',
19 | inbox: '',
20 | outbox: '',
21 | rollup: '',
22 | sequencerInbox: ''
23 | },
24 | nativeToken: '',
25 | explorerUrl: '',
26 | rpcUrl: '',
27 | isCustom: true,
28 | isTestnet,
29 | name: `Mocked Orbit Chain ${chainId}`,
30 | slug: `mocked-orbit-chain-${chainId}`,
31 | parentChainId
32 | }
33 | }
34 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/images/EthereumLogo.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
16 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/tokenLists/660279_default.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "XAI Default List",
3 | "timestamp": "2024-06-28T09:16:36.457Z",
4 | "tokens": [
5 | {
6 | "chainId": 660279,
7 | "address": "0x89c49a3fa372920ac23ce757a029e6936c0b8e02",
8 | "name": "Crypto Unicorns",
9 | "symbol": "CU",
10 | "decimals": 18,
11 | "logoURI": "https://s2.coinmarketcap.com/static/img/coins/64x64/31074.png",
12 | "extensions": {
13 | "bridgeInfo": {
14 | "42161": {
15 | "tokenAddress": "0x89c49a3fa372920ac23ce757a029e6936c0b8e02",
16 | "originBridgeAddress": "0x96551194230725c72ACF8E9573B1382CCBC70635",
17 | "destBridgeAddress": "0xb15A0826d65bE4c2fDd961b72636168ee70Af030"
18 | }
19 | }
20 | }
21 | }
22 | ],
23 | "version": {
24 | "major": 1,
25 | "minor": 0,
26 | "patch": 0
27 | }
28 | }
29 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/hooks/useGasPrice.ts:
--------------------------------------------------------------------------------
1 | import { useMemo } from 'react'
2 | import { BigNumber, constants, providers } from 'ethers'
3 | import useSWR from 'swr'
4 |
5 | import { useChainId } from './useChainId'
6 |
7 | export function useGasPrice({
8 | provider
9 | }: {
10 | provider: providers.Provider
11 | }): BigNumber {
12 | const chainId = useChainId({ provider })
13 |
14 | const queryKey = useMemo(() => {
15 | if (typeof chainId === 'undefined') {
16 | // Don't fetch
17 | return null
18 | }
19 |
20 | return ['gasPrice', chainId]
21 | }, [chainId])
22 |
23 | const { data: gasPrice = constants.Zero } = useSWR(
24 | queryKey,
25 | () => provider.getGasPrice(),
26 | {
27 | refreshInterval: 30_000,
28 | shouldRetryOnError: true,
29 | errorRetryCount: 2,
30 | errorRetryInterval: 5_000
31 | }
32 | )
33 |
34 | return gasPrice
35 | }
36 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/.env.local.sample:
--------------------------------------------------------------------------------
1 | # Default Infura key. If no network-specific keys are set, it will fallback to this key.
2 | NEXT_PUBLIC_INFURA_KEY=
3 |
4 | # L1
5 | NEXT_PUBLIC_INFURA_KEY_ETHEREUM=
6 | # L1 Testnet
7 | NEXT_PUBLIC_INFURA_KEY_SEPOLIA=
8 | NEXT_PUBLIC_INFURA_KEY_HOLESKY=
9 |
10 | # L2
11 | NEXT_PUBLIC_INFURA_KEY_ARBITRUM_ONE=
12 | NEXT_PUBLIC_INFURA_KEY_BASE=
13 | # L2 Testnet
14 | NEXT_PUBLIC_INFURA_KEY_ARBITRUM_SEPOLIA=
15 | NEXT_PUBLIC_INFURA_KEY_BASE_SEPOLIA=
16 |
17 | NEXT_PUBLIC_SENTRY_DSN=
18 |
19 | NEXT_PUBLIC_ETHEREUM_RPC_URL=
20 | NEXT_PUBLIC_SEPOLIA_RPC_URL=
21 |
22 | NEXT_PUBLIC_LOCAL_ETHEREUM_RPC_URL="http://localhost:8545"
23 | NEXT_PUBLIC_LOCAL_ARBITRUM_RPC_URL="http://localhost:8547"
24 |
25 | NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID=
26 |
27 | THE_GRAPH_NETWORK_API_KEY=
28 | SELF_HOSTED_SUBGRAPH_API_KEY=
29 |
30 | NEXT_PUBLIC_SCREENING_API_ENDPOINT=
31 |
32 | NEXT_PUBLIC_POSTHOG_KEY=
33 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/util/withdrawals/__tests__/fetchETHWithdrawalsTestHelpers.ts:
--------------------------------------------------------------------------------
1 | import { StaticJsonRpcProvider } from '@ethersproject/providers'
2 |
3 | const receiver = '0xd898275e8b9428429155752f89fe0899ce232830'
4 | const l2Provider = new StaticJsonRpcProvider('https://arb1.arbitrum.io/rpc')
5 |
6 | const baseQuery = {
7 | receiver,
8 | l2Provider
9 | }
10 |
11 | export function getQueryCoveringClassicOnlyWithoutResults() {
12 | // keeping the block range low (not fetching from 0) to make sure we don't run into event-log deadline-exceeded error #904
13 | return { ...baseQuery, fromBlock: 20780771, toBlock: 20785771 }
14 | }
15 |
16 | export function getQueryCoveringClassicOnlyWithResults() {
17 | return { ...baseQuery, fromBlock: 20785772, toBlock: 22207816 }
18 | }
19 |
20 | export function getQueryCoveringClassicAndNitroWithResults() {
21 | return { ...baseQuery, fromBlock: 20785772, toBlock: 24905369 }
22 | }
23 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/components/common/atoms/Toast.tsx:
--------------------------------------------------------------------------------
1 | import { ToastContainer, toast } from 'react-toastify'
2 |
3 | export const errorToast = (
4 | message: React.ReactNode,
5 | {
6 | autoClose
7 | }: {
8 | autoClose?: number | false | undefined
9 | } = { autoClose: 5000 }
10 | ) => {
11 | toast.error(message, { autoClose })
12 | }
13 |
14 | export const warningToast = (
15 | message: React.ReactNode,
16 | {
17 | autoClose
18 | }: {
19 | autoClose?: number | false | undefined
20 | } = { autoClose: 5000 }
21 | ) => {
22 | toast.warning(message, { autoClose })
23 | }
24 |
25 | export const Toast = () => {
26 | return (
27 |
21 |
24 |
10 |
21 |
22 | )}
23 |
31 | {children}
32 |
33 | )
34 | }
35 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/images/LightningIcon.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/tests/e2e/specs/switchNetworks.cy.ts:
--------------------------------------------------------------------------------
1 | import { getL1NetworkName, getL2NetworkName } from '../../support/common'
2 |
3 | describe('Switch Networks', () => {
4 | context('User is on test network L1', () => {
5 | it('should show L1 and L2 chains correctly', () => {
6 | cy.login({ networkType: 'parentChain' })
7 | cy.findSourceChainButton(getL1NetworkName())
8 | cy.findDestinationChainButton(getL2NetworkName())
9 | })
10 |
11 | context(
12 | 'User is connected to Ethereum, source chain is Ethereum and destination chain is Arbitrum',
13 | () => {
14 | it('should switch "from: Ethereum" to "from: Arbitrum" successfully', () => {
15 | cy.login({ networkType: 'parentChain' })
16 | cy.findSourceChainButton(getL1NetworkName())
17 |
18 | cy.findByRole('button', { name: /Switch Networks/i })
19 | .should('be.visible')
20 | .click()
21 |
22 | cy.findSourceChainButton(getL2NetworkName())
23 | })
24 | }
25 | )
26 | })
27 | })
28 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/components/common/TestnetToggle.tsx:
--------------------------------------------------------------------------------
1 | import { twMerge } from 'tailwind-merge'
2 |
3 | import { useIsTestnetMode } from '../../hooks/useIsTestnetMode'
4 |
5 | import { Switch } from './atoms/Switch'
6 |
7 | export const TestnetToggle = ({
8 | className,
9 | label,
10 | description,
11 | includeToggleStateOnLabel
12 | }: {
13 | className?: {
14 | wrapper?: string
15 | switch?: string
16 | }
17 | label: string
18 | description?: string
19 | includeToggleStateOnLabel?: boolean
20 | }) => {
21 | const [isTestnetMode, toggleTestnetMode] = useIsTestnetMode()
22 |
23 | const labelText = includeToggleStateOnLabel
24 | ? `${label} ${isTestnetMode ? 'ON' : 'OFF'}`
25 | : label
26 |
27 | return (
28 |
37 | )
38 | }
39 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/images/sidebar/gethelp.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/hooks/useTheme.ts:
--------------------------------------------------------------------------------
1 | import { useEffect } from 'react'
2 | import useLocalStorage from '@rehooks/local-storage'
3 |
4 | export const themeLocalStorageKey = 'arbitrum:bridge:preferences:theme'
5 |
6 | export const classicThemeKey = 'arbitrum-classic-theme'
7 |
8 | export const THEME_CONFIG = [
9 | {
10 | id: 'space',
11 | label: 'Space',
12 | description:
13 | 'A dark, space-themed UI with a sleek and futuristic aesthetic, featuring Arbinaut on a backdrop of shining stars and moon.'
14 | },
15 | {
16 | id: classicThemeKey,
17 | label: 'Arbitrum Classic',
18 | description:
19 | 'Arbitrum before it was cool: A reminiscent of the pre-nitro era, with simple, solid buttons, a minimal purple layout and chunky fonts.'
20 | }
21 | ]
22 |
23 | export const useTheme = () => {
24 | const [theme, setTheme] = useLocalStorage
30 |
38 | )
39 | }
40 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/hooks/useETHPrice.ts:
--------------------------------------------------------------------------------
1 | import { useCallback } from 'react'
2 | import axios from 'axios'
3 | import useSWR, { KeyedMutator } from 'swr'
4 |
5 | export type UseETHPriceResult = {
6 | ethPrice: number
7 | ethToUSD: (etherValue: number) => number
8 | error?: Error
9 | isValidating: boolean
10 | mutate: KeyedMutator
35 | {variant === 'info' && (
36 |
44 | )
45 | }
46 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/components/TransactionHistory/TransactionHistory.tsx:
--------------------------------------------------------------------------------
1 | import { create } from 'zustand'
2 |
3 | import { MergedTransaction } from '../../state/app/state'
4 | import { TransactionHistorySearchBar } from './TransactionHistorySearchBar'
5 | import { TransactionHistorySearchResults } from './TransactionHistorySearchResults'
6 |
7 | type TxDetailsStore = {
8 | tx: MergedTransaction | null
9 | isOpen: boolean
10 | open: (tx: MergedTransaction) => void
11 | close: () => void
12 | reset: () => void
13 | }
14 |
15 | export const useTxDetailsStore = create
36 |
40 | )
41 | }
42 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/next.config.js:
--------------------------------------------------------------------------------
1 | // @ts-check type next.config.js
2 |
3 | /**
4 | * @type {import('next').NextConfig}
5 | **/
6 |
7 | module.exports = {
8 | distDir: 'build',
9 | productionBrowserSourceMaps: true,
10 | reactStrictMode: true,
11 | images: {
12 | remotePatterns: [
13 | {
14 | protocol: 'https',
15 | hostname: 'portal.arbitrum.io'
16 | }
17 | ]
18 | },
19 | async headers() {
20 | return [
21 | {
22 | source: '/api/status',
23 | headers: [
24 | {
25 | key: 'Access-Control-Allow-Origin',
26 | value: 'https://portal.arbitrum.io'
27 | },
28 | {
29 | key: 'Access-Control-Allow-Methods',
30 | value: 'GET'
31 | }
32 | ]
33 | }
34 | ]
35 | },
36 | async redirects() {
37 | return [
38 | {
39 | source: '/:slug((?!^$|api/|_next/|public/)(?!.*\\.[^/]+$).+)',
40 | missing: [
41 | {
42 | type: 'query',
43 | key: 'destinationChain'
44 | },
45 | {
46 | type: 'header',
47 | key: 'accept',
48 | value: 'image/.*'
49 | }
50 | ],
51 | destination: '/?destinationChain=:slug',
52 | permanent: true
53 | }
54 | ]
55 | }
56 | }
57 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/images/ApeChainLogo.svg:
--------------------------------------------------------------------------------
1 |
12 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/hooks/useAccountType.ts:
--------------------------------------------------------------------------------
1 | import { useAccount } from 'wagmi'
2 | import useSWRImmutable from 'swr/immutable'
3 |
4 | import { addressIsSmartContract } from '../util/AddressUtils'
5 | import { useNetworks } from './useNetworks'
6 |
7 | type Result = {
8 | isEOA: boolean
9 | isSmartContractWallet: boolean
10 | isLoading: boolean
11 | }
12 |
13 | export function useAccountType(): Result {
14 | const { address, isConnected } = useAccount()
15 | // TODO: change to use connected chain when Safe wallet returns it correctly
16 | // atm Safe UI would try to switch connected chain even when user is at the correct chain
17 | // so the connected chain WAGMI returns is the wrong chain where the SCW is not deployed on
18 | const [{ sourceChain }] = useNetworks()
19 |
20 | const { data: isSmartContractWallet = false, isLoading } = useSWRImmutable(
21 | address && isConnected && sourceChain
22 | ? [address, sourceChain.id, 'useAccountType']
23 | : null,
24 | ([_address, chainId]) => addressIsSmartContract(_address, chainId),
25 | {
26 | shouldRetryOnError: true,
27 | errorRetryCount: 2,
28 | errorRetryInterval: 5_000
29 | }
30 | )
31 |
32 | // By default, assume it's an EOA
33 | return {
34 | isEOA: !isSmartContractWallet,
35 | isSmartContractWallet,
36 | isLoading
37 | }
38 | }
39 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/components/common/Notifications.tsx:
--------------------------------------------------------------------------------
1 | // import { InformationCircleIcon } from '@heroicons/react/24/outline'
2 | // import { twMerge } from 'tailwind-merge'
3 |
4 | import { PropsWithChildren } from 'react'
5 |
6 | function NotificationContainer({ children }: PropsWithChildren) {
7 | return (
8 |
9 |
13 | )
14 | }
15 |
16 | // function Notification({
17 | // infoIcon,
18 | // children,
19 | // mode = 'dark'
20 | // }: {
21 | // infoIcon?: boolean
22 | // mode?: 'light' | 'dark'
23 | // children: React.ReactNode
24 | // }) {
25 | // return (
26 | //
10 |
12 | {children}
11 |
32 | // {infoIcon && (
33 | //
37 | // )}
38 | // {children}
39 | //
40 | // )
41 | // }
42 |
43 | export function Notifications() {
44 | return 33 | We seem to be having a difficult time loading your data, we're 34 | working hard to resolve it. 35 |
36 |Please give it a moment and then try refreshing the page.
37 |
38 | If the problem persists, please file a ticket{' '}
39 |
There are no recent {tabType} transactions.
51 |
25 |
30 | {isConnected ? (
31 |
34 | {({ openConnectModal }) => (
35 | }
39 | className="border-lime-dark bg-lime-dark py-3"
40 | isMobile
41 | />
42 | )}
43 |
44 | )}
45 |
46 |
47 | )
48 | }
49 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/images/sidebar/home.svg:
--------------------------------------------------------------------------------
1 |
6 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/public/images/header/headerLogo_governance.svg:
--------------------------------------------------------------------------------
1 |
5 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/scripts/utils.ts:
--------------------------------------------------------------------------------
1 | import { ArbitrumNetwork } from '@arbitrum/sdk'
2 | import { OrbitChainConfig } from '../src/util/orbitChainsList'
3 | import { getExplorerUrl, rpcURLs } from '../src/util/networks'
4 |
5 | export interface ChainToMonitor extends ArbitrumNetwork {
6 | parentRpcUrl: string
7 | orbitRpcUrl: string
8 | explorerUrl: string
9 | parentExplorerUrl: string
10 | }
11 |
12 | export const sanitizeExplorerUrl = (url: string) => {
13 | // we want explorer urls to have a trailing slash
14 | if (url.endsWith('/')) {
15 | return url
16 | } else {
17 | return url + '/'
18 | }
19 | }
20 |
21 | export const sanitizeRpcUrl = (url: string) => {
22 | // we want rpc urls to NOT have a trailing slash
23 | if (url.endsWith('/')) {
24 | return url.slice(0, -1)
25 | } else {
26 | return url
27 | }
28 | }
29 |
30 | const hasExplorerUrl = (
31 | chain: ArbitrumNetwork | OrbitChainConfig
32 | ): chain is OrbitChainConfig => {
33 | return typeof (chain as OrbitChainConfig).explorerUrl !== 'undefined'
34 | }
35 |
36 | // make the chain data compatible with that required by the retryable-monitoring script
37 | // TODO: in a later refactor, we will update the term `orbitRpcUrl` to chain-agnostic, `rpcUrl`
38 | export const getChainToMonitor = ({
39 | chain,
40 | rpcUrl
41 | }: {
42 | chain: ArbitrumNetwork | OrbitChainConfig
43 | rpcUrl: string
44 | }): ChainToMonitor => ({
45 | ...chain,
46 | explorerUrl: sanitizeExplorerUrl(
47 | hasExplorerUrl(chain) ? chain.explorerUrl : getExplorerUrl(chain.chainId)
48 | ),
49 | orbitRpcUrl: sanitizeRpcUrl(rpcUrl),
50 | parentRpcUrl: sanitizeRpcUrl(rpcURLs[chain.parentChainId]),
51 | parentExplorerUrl: sanitizeExplorerUrl(getExplorerUrl(chain.parentChainId))
52 | })
53 |
--------------------------------------------------------------------------------
/packages/arb-token-bridge-ui/src/components/common/Transition.tsx:
--------------------------------------------------------------------------------
1 | import { Transition as HeadlessUiTransition } from '@headlessui/react'
2 | import { PropsWithChildren } from 'react'
3 | import { twMerge } from 'tailwind-merge'
4 |
5 | type TransitionSpeed = 'slow' | 'normal' | 'fast'
6 |
7 | type TransitionOptions = {
8 | enterSpeed?: TransitionSpeed
9 | leaveSpeed?: TransitionSpeed
10 | unmountOnLeave?: boolean
11 | }
12 |
13 | type TransitionProps = PropsWithChildren<{
14 | isOpen?: boolean
15 | options?: TransitionOptions
16 | className?: string
17 | afterLeave?: () => void
18 | }>
19 |
20 | function getDurationClassName(speed: TransitionSpeed) {
21 | switch (speed) {
22 | case 'slow':
23 | return 'duration-1000'
24 | case 'normal':
25 | return 'duration-500'
26 | case 'fast':
27 | return 'duration-200'
28 | }
29 | }
30 |
31 | export const Transition = (props: TransitionProps) => {
32 | const { options, children, className, isOpen, afterLeave } = props
33 |
34 | const enterSpeed = options?.enterSpeed ?? 'fast'
35 | const leaveSpeed = options?.leaveSpeed ?? 'fast'
36 | const unmountOnLeave = options?.unmountOnLeave ?? true
37 |
38 | return (
39 |
20 | Access to Circle's bridge is restricted in certain jurisdictions.
21 | For more details, please consult Circle's{' '}
22 |
32 | Receive{' '}
33 |