diff --git a/packages/bridge-ui/src/components/ChainSelectors/ChainPill/ChainPill.svelte b/packages/bridge-ui/src/components/ChainSelectors/ChainPill/ChainPill.svelte index 6d2d882cba..fd500c6314 100644 --- a/packages/bridge-ui/src/components/ChainSelectors/ChainPill/ChainPill.svelte +++ b/packages/bridge-ui/src/components/ChainSelectors/ChainPill/ChainPill.svelte @@ -21,7 +21,7 @@ let classes = classNames('ChainPill relative', $$props.class); - let buttonClasses = `f-row body-regular bg-neutral-background px-2 py-[6px] !rounded-[10px] dark:hover:bg-primary-secondary-hover flex justify-start content-center ${$$props.class}`; + let buttonClasses = `f-row body-regular bg-neutral-background px-2 py-[6px] !rounded-full dark:hover:bg-primary-secondary-hover flex justify-start content-center ${$$props.class}`; let iconSize = 'min-w-5 max-w-5 min-h-5 max-h-5'; diff --git a/packages/bridge-ui/src/components/ConnectButton/ConnectButton.svelte b/packages/bridge-ui/src/components/ConnectButton/ConnectButton.svelte index 1db34da4d1..3c003bab68 100644 --- a/packages/bridge-ui/src/components/ConnectButton/ConnectButton.svelte +++ b/packages/bridge-ui/src/components/ConnectButton/ConnectButton.svelte @@ -8,6 +8,7 @@ import { web3modal } from '$libs/connect'; import { refreshUserBalance, renderEthBalance } from '$libs/util/balance'; import { noop } from '$libs/util/noop'; + import { isMobile } from '$libs/util/responsiveCheck'; import { shortenAddress } from '$libs/util/shortenAddress'; import { account } from '$stores/account'; import { ethBalance } from '$stores/balance'; @@ -43,15 +44,17 @@ {#if connected} - {/if} + + {$t('paginator.page')} - {#if !isLastPage} - - {/if} + {/if} diff --git a/packages/bridge-ui/src/components/Relayer/Relayer.svelte b/packages/bridge-ui/src/components/Relayer/Relayer.svelte index 70398dfdbf..8e87e8cabf 100644 --- a/packages/bridge-ui/src/components/Relayer/Relayer.svelte +++ b/packages/bridge-ui/src/components/Relayer/Relayer.svelte @@ -6,8 +6,9 @@ import ActionButton from '$components/Button/ActionButton.svelte'; import Card from '$components/Card/Card.svelte'; import OnAccount from '$components/OnAccount/OnAccount.svelte'; - import Transaction from '$components/Transactions/Transaction.svelte'; + import { FungibleTransactionRow, NftTransactionRow } from '$components/Transactions/Rows'; import { type BridgeTransaction, fetchTransactions, MessageStatus } from '$libs/bridge'; + import { TokenType } from '$libs/token'; import { getLogger } from '$libs/util/logger'; import { type Account, account } from '$stores/account'; @@ -20,7 +21,7 @@ const onAccountChange = async (newAccount: Account, oldAccount?: Account) => { // We want to make sure that we are connected and only // fetch if the account has changed - if (newAccount.address && newAccount.address !== oldAccount?.address) { + if (newAccount && newAccount.address && newAccount.address !== oldAccount?.address) { reset(); } }; @@ -80,6 +81,8 @@
{$t('relayer_component.step1.title')} + {transactions?.length} + {transactionsToShow?.length} {/if}
- {#each transactionsToShow as tx} - {#if tx.status === MessageStatus.NEW} - + + {#each transactionsToShow as bridgeTx (bridgeTx.srcTxHash)} + {@const status = bridgeTx.msgStatus} + {@const isFungible = bridgeTx.tokenType === TokenType.ERC20 || bridgeTx.tokenType === TokenType.ETH} + {#if isFungible} + + {:else} + {/if} +
{/each} diff --git a/packages/bridge-ui/src/components/SideNavigation/SideNavigation.svelte b/packages/bridge-ui/src/components/SideNavigation/SideNavigation.svelte index d86be1f29e..c428a0861e 100644 --- a/packages/bridge-ui/src/components/SideNavigation/SideNavigation.svelte +++ b/packages/bridge-ui/src/components/SideNavigation/SideNavigation.svelte @@ -10,7 +10,6 @@ import BridgeTabs from '$components/Bridge/BridgeTabs.svelte'; import { Icon } from '$components/Icon'; import { LinkButton } from '$components/LinkButton'; - import { LogoWithText } from '$components/Logo'; import { ThemeButton } from '$components/ThemeButton'; import { PUBLIC_DEFAULT_EXPLORER, @@ -23,8 +22,12 @@ let testnetName = PUBLIC_TESTNET_NAME || ''; let drawerToggleElem: HTMLInputElement; + export let sideBarOpen: boolean; + function closeDrawer() { + if (!drawerToggleElem) return; drawerToggleElem.checked = false; + sideBarOpen = false; } function onMenuKeydown(event: KeyboardEvent) { @@ -40,63 +43,36 @@ $: isBridgePage = $page.route.id === '/' || $page.route.id === '/nft'; $: isFaucetPage = $page.route.id === '/faucet'; $: isTransactionsPage = $page.route.id === '/transactions'; - - $: hasTestnetName = testnetName !== ''; -
+
-
- -
+