From 3db3982fabe7a5bacf603fd2fdbeb58a1f86d1cc Mon Sep 17 00:00:00 2001 From: MananTank Date: Fri, 17 Oct 2025 03:46:41 +0000 Subject: [PATCH] [MNY-270] Remove in-app wallet options from bridge page connect modal (#8270) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ## PR-Codex overview This PR introduces a centralized `appMetadata` constant for consistent branding across various components and refactors the code to utilize this constant, reducing redundancy and improving maintainability. ### Detailed summary - Added `appMetadata` constant in `connect.ts`. - Refactored `NebulaConnectButton` to use `appMetadata`. - Updated `PageHeader` to include `wallets` prop in `PublicPageConnectButton`. - Created `bridgeWallets` array in `UniversalBridgeEmbed` using `createWallet` with `appMetadata`. - Modified multiple components to utilize `appMetadata` instead of hardcoded values. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` ## Summary by CodeRabbit * **New Features** * Wallet selection is now customizable for Buy, Swap, and Bridge flows. * App branding metadata centralized for consistent presentation across all wallet connection points. * Bridge now includes preset wallet options to streamline onboarding and autoconnect behavior. --- .../src/@/components/blocks/BuyAndSwapEmbed.tsx | 10 ++++++++++ .../src/@/components/connect-wallet/index.tsx | 13 +++---------- apps/dashboard/src/@/constants/connect.ts | 5 +++++ .../_components/PublicPageConnectButton.tsx | 10 +++++----- .../(sidebar)/ai/components/NebulaConnectButton.tsx | 7 ++----- .../components/client/UniversalBridgeEmbed.tsx | 13 +++++++++++++ apps/dashboard/src/app/bridge/components/header.tsx | 6 +++++- 7 files changed, 43 insertions(+), 21 deletions(-) create mode 100644 apps/dashboard/src/@/constants/connect.ts diff --git a/apps/dashboard/src/@/components/blocks/BuyAndSwapEmbed.tsx b/apps/dashboard/src/@/components/blocks/BuyAndSwapEmbed.tsx index b0b207667de..6fbd4981435 100644 --- a/apps/dashboard/src/@/components/blocks/BuyAndSwapEmbed.tsx +++ b/apps/dashboard/src/@/components/blocks/BuyAndSwapEmbed.tsx @@ -4,6 +4,7 @@ import { useTheme } from "next-themes"; import { useEffect, useMemo, useRef, useState } from "react"; import type { Chain } from "thirdweb"; import { BuyWidget, SwapWidget } from "thirdweb/react"; +import type { Wallet } from "thirdweb/wallets"; import { reportAssetBuyCancelled, reportAssetBuyFailed, @@ -25,6 +26,7 @@ import { import { cn } from "@/lib/utils"; import { parseError } from "@/utils/errorParser"; import { getSDKTheme } from "@/utils/sdk-component-theme"; +import { appMetadata } from "../../constants/connect"; import { getConfiguredThirdwebClient } from "../../constants/thirdweb.server"; type PageType = "asset" | "bridge" | "chain"; @@ -35,6 +37,7 @@ export function BuyAndSwapEmbed(props: { buyAmount: string | undefined; pageType: PageType; isTestnet: boolean | undefined; + wallets?: Wallet[]; }) { const { theme } = useTheme(); const [tab, setTab] = useState<"buy" | "swap">("swap"); @@ -91,6 +94,8 @@ export function BuyAndSwapEmbed(props: { client={client} connectOptions={{ autoConnect: false, + wallets: props.wallets, + appMetadata: appMetadata, }} onError={(e, quote) => { const errorMessage = parseError(e); @@ -184,6 +189,11 @@ export function BuyAndSwapEmbed(props: { client={client} theme={themeObj} className="!rounded-2xl !border-none" + connectOptions={{ + autoConnect: false, + wallets: props.wallets, + appMetadata: appMetadata, + }} prefill={{ // buy this token by default buyToken: { diff --git a/apps/dashboard/src/@/components/connect-wallet/index.tsx b/apps/dashboard/src/@/components/connect-wallet/index.tsx index 0bd5c017212..1a755e705e8 100644 --- a/apps/dashboard/src/@/components/connect-wallet/index.tsx +++ b/apps/dashboard/src/@/components/connect-wallet/index.tsx @@ -17,6 +17,7 @@ import { resetAnalytics } from "@/analytics/reset"; import { CustomChainRenderer } from "@/components/misc/CustomChainRenderer"; import { LazyConfigureNetworkModal } from "@/components/misc/configure-networks/LazyConfigureNetworkModal"; import { Button } from "@/components/ui/button"; +import { appMetadata } from "@/constants/connect"; import { popularChains } from "@/constants/popularChains"; import { useAllChainsData } from "@/hooks/chains/allChains"; import { useFavoriteChainIds } from "@/hooks/favorite-chains"; @@ -138,11 +139,7 @@ export const CustomConnectWallet = (props: { return ( <> { return connect({ - appMetadata: { - logoUrl: "https://thirdweb.com/favicon.ico", - name: "thirdweb", - url: "https://thirdweb.com", - }, + appMetadata, chain: options?.chain, client: options.client, privacyPolicyUrl: "/privacy-policy", diff --git a/apps/dashboard/src/@/constants/connect.ts b/apps/dashboard/src/@/constants/connect.ts new file mode 100644 index 00000000000..ab88a4fb91c --- /dev/null +++ b/apps/dashboard/src/@/constants/connect.ts @@ -0,0 +1,5 @@ +export const appMetadata = { + logoUrl: "https://thirdweb.com/favicon.ico", + name: "thirdweb", + url: "https://thirdweb.com", +}; diff --git a/apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/_components/PublicPageConnectButton.tsx b/apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/_components/PublicPageConnectButton.tsx index a98f28ab997..2323c4b5788 100644 --- a/apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/_components/PublicPageConnectButton.tsx +++ b/apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/_components/PublicPageConnectButton.tsx @@ -2,6 +2,8 @@ import { useTheme } from "next-themes"; import { ConnectButton } from "thirdweb/react"; +import type { Wallet } from "thirdweb/wallets"; +import { appMetadata } from "@/constants/connect"; import { getClientThirdwebClient } from "@/constants/thirdweb-client.client"; import { useAllChainsData } from "@/hooks/chains/allChains"; import { getSDKTheme } from "@/utils/sdk-component-theme"; @@ -10,6 +12,7 @@ const client = getClientThirdwebClient(); export function PublicPageConnectButton(props: { connectButtonClassName?: string; + wallets?: Wallet[]; }) { const { theme } = useTheme(); const t = theme === "light" ? "light" : "dark"; @@ -17,11 +20,7 @@ export function PublicPageConnectButton(props: { return ( ); } diff --git a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/ai/components/NebulaConnectButton.tsx b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/ai/components/NebulaConnectButton.tsx index b1720bb6564..90b2ae8c045 100644 --- a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/ai/components/NebulaConnectButton.tsx +++ b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/ai/components/NebulaConnectButton.tsx @@ -11,6 +11,7 @@ import { useActiveWalletConnectionStatus, } from "thirdweb/react"; import { Button } from "@/components/ui/button"; +import { appMetadata } from "@/constants/connect"; import { useAllChainsData } from "@/hooks/chains/allChains"; import { cn } from "@/lib/utils"; import { getSDKTheme } from "@/utils/sdk-component-theme"; @@ -65,11 +66,7 @@ export const NebulaConnectWallet = (props: { const { customDetailsButton } = props; return ( - +