Dashboard, Portal, Playground: Rename leftover usage of 'Universal Bridge' to 'Payments' in UI (thirdweb-dev#7611)

MananTank · MananTank · commit 216b70475ec9 · 2025-07-16T16:20:48.000Z
&lt;!--

## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes"

If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000):

## Notes for the reviewer

Anything important to call out? Be sure to also clarify these in your comments.

## How to test

Unit tests, playground, etc.

--&gt;

&lt;!-- start pr-codex --&gt;

---

## PR-Codex overview
This PR focuses on renaming references from `Universal Bridge` to `Payments` across various files in the codebase, reflecting a rebranding initiative.

### Detailed summary
- Changed `name` and `title` from `Universal Bridge` to `Payments` in multiple files.
- Updated labels and descriptions in UI components to reflect the new branding.
- Modified sidebar links and metadata to align with the new `Payments` terminology.
- Adjusted documentation references to `Payments` from `Universal Bridge`.

&gt; ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

&lt;!-- end pr-codex --&gt;

&lt;!-- This is an auto-generated comment: release notes by coderabbit.ai --&gt;
## Summary by CodeRabbit

* **Style**
  * Updated all user-facing references of "Universal Bridge" to "Payments" across banners, page titles, headings, navigation links, sidebars, and documentation content for a consistent branding experience.

* **Documentation**
  * Revised documentation text, metadata, and quickstart guides to reflect the new "Payments" terminology and branding.
&lt;!-- end of auto-generated comment: release notes by coderabbit.ai --&gt;
diff --git a/apps/dashboard/src/@/components/misc/AnnouncementBanner.tsx b/apps/dashboard/src/@/components/misc/AnnouncementBanner.tsx
@@ -47,7 +47,7 @@ export function AnnouncementBanner() {
   return (
     <AnnouncementBannerUI
       href="https://blog.thirdweb.com/the-fastest-way-to-build-web3-applications/"
-      label="We have re-branded our Engine, Universal Bridge, and Connect products. Please read the full blog post for details on changes"
+      label="We have re-branded our Engine, Payments, and Connect products. Please read the full blog post for details on changes"
       trackingLabel="product-rebrand"
     />
   );
diff --git a/apps/dashboard/src/app/(app)/(dashboard)/(bridge)/routes/page.tsx b/apps/dashboard/src/app/(app)/(dashboard)/(bridge)/routes/page.tsx
@@ -10,7 +10,7 @@ import {
   type SearchParams,
 } from "./components/server/routes-table";
 
-const title = "Universal Bridge Routes: Swap, Bridge, and Onramp";
+const title = "Payments Routes: Swap, Bridge, and Onramp";
 const description =
   "A list of token routes for swapping, bridging, and on-ramping between EVM chains with thirdweb.";
 
@@ -66,7 +66,7 @@ export default async function RoutesPage(props: {
         <div className="relative flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between">
           <div className="flex flex-col gap-1">
             <h3 className="font-medium text-lg">
-              Get Started with Universal Bridge
+              Get Started with thirdweb Payments
             </h3>
             <p className="text-muted-foreground text-sm">
               Simple, instant, and secure payments across any token and chain.
diff --git a/apps/dashboard/src/app/bridge/page.tsx b/apps/dashboard/src/app/bridge/page.tsx
@@ -7,9 +7,9 @@ import { getCurrencyMetadata } from "thirdweb/extensions/erc20";
 import { UniversalBridgeEmbed } from "./components/client/UniversalBridgeEmbed";
 import { bridgeAppThirdwebClient } from "./constants";
 
-const title = "Universal Bridge: Swap, Bridge, and Onramp";
+const title = "thirdweb Payments: Swap, Bridge, and Onramp";
 const description =
-  "Swap, bridge, and on-ramp to any EVM chain with thirdweb's Universal Bridge.";
+  "Swap, bridge, and on-ramp to any EVM chain with thirdweb's Payments.";
 
 export const metadata: Metadata = {
   description,
@@ -80,7 +80,7 @@ export default async function BridgePage({
             <div className="relative flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between">
               <div className="flex flex-col gap-1">
                 <h3 className="font-medium text-lg">
-                  Get Started with Universal Bridge
+                  Get Started with thirdweb Payments
                 </h3>
                 <p className="text-muted-foreground text-sm">
                   Simple, instant, and secure payments across any token and
diff --git a/apps/playground-web/src/app/connect/pay/backend/layout.tsx b/apps/playground-web/src/app/connect/pay/backend/layout.tsx
@@ -9,7 +9,7 @@ export default function Layout(props: { children: React.ReactNode }) {
           <>HTTP API to bridge, swap and onramp to and from any currency</>
         }
         docsLink="https://portal.thirdweb.com/connect/pay/overview?utm_source=playground"
-        title="Universal Bridge API"
+        title="Payments API"
       />
 
       {props.children}
diff --git a/apps/playground-web/src/app/connect/pay/backend/page.tsx b/apps/playground-web/src/app/connect/pay/backend/page.tsx
@@ -11,11 +11,11 @@ export default async function Page() {
         <div className="flex flex-col justify-between md:flex-row md:gap-8">
           <div>
             <h2 className="mb-1 font-semibold text-2xl tracking-tight">
-              Universal Bridge REST API
+              thirdweb Payments REST API
             </h2>
             <p className="mb-5 text-muted-foreground">
-              Directly interact with the Universal Bridge API from your backend,
-              using standard REST APIs.
+              Directly interact with the thirdweb Payments API from your
+              backend, using standard REST APIs.
             </p>
           </div>
 
diff --git a/apps/playground-web/src/app/connect/pay/backend/reference/page.tsx b/apps/playground-web/src/app/connect/pay/backend/reference/page.tsx
@@ -64,7 +64,7 @@ function Breadcrumbs() {
       <BreadcrumbList>
         <BreadcrumbItem>
           <BreadcrumbLink href="/connect/pay/backend">
-            Universal Bridge API
+            Payments API
           </BreadcrumbLink>
         </BreadcrumbItem>
         <BreadcrumbSeparator />
diff --git a/apps/playground-web/src/app/connect/pay/commerce/page.tsx b/apps/playground-web/src/app/connect/pay/commerce/page.tsx
@@ -9,7 +9,7 @@ export const metadata: Metadata = {
   description:
     "The easiest way for users to transact in your app. Onramp users in clicks and generate revenue for each user transaction. Integrate for free.",
   metadataBase,
-  title: "Integrate Fiat & Cross-Chain Crypto Payments | Universal Bridge",
+  title: "Integrate Fiat & Cross-Chain Crypto Payments | thirdweb Payments",
 };
 
 export default function Page() {
diff --git a/apps/playground-web/src/app/connect/pay/fund-wallet/page.tsx b/apps/playground-web/src/app/connect/pay/fund-wallet/page.tsx
@@ -9,7 +9,7 @@ export const metadata: Metadata = {
   description:
     "The easiest way for users to fund their wallets. Onramp users in clicks and generate revenue for each user transaction. Integrate for free.",
   metadataBase,
-  title: "Buy Crypto | thirdweb Universal Bridge",
+  title: "Buy Crypto | thirdweb Payments",
 };
 
 export default function Page() {
diff --git a/apps/playground-web/src/app/connect/pay/page.tsx b/apps/playground-web/src/app/connect/pay/page.tsx
@@ -8,8 +8,7 @@ export const metadata: Metadata = {
   description:
     "The easiest way for users to transact in your app. Onramp users, pay with any token and generate revenue for each user transaction. Integrate for free.",
   metadataBase,
-  title:
-    "Integrate Fiat & Cross-Chain Crypto Payments | thirdweb Universal Bridge",
+  title: "Integrate Fiat & Cross-Chain Crypto Payments | thirdweb Payments",
 };
 
 export default function Page(props: {
@@ -25,7 +24,7 @@ export default function Page(props: {
           </>
         }
         docsLink="https://portal.thirdweb.com/connect/pay/get-started?utm_source=playground"
-        title="Universal Bridge UI component"
+        title="Payments UI component"
       >
         <PayEmbedPlayground searchParams={props.searchParams} />
       </PageLayout>
diff --git a/apps/playground-web/src/app/navLinks.ts b/apps/playground-web/src/app/navLinks.ts
@@ -109,7 +109,7 @@ const universalBridgeSidebarLinks: SidebarLink = {
       name: "Backend API",
     },
   ],
-  name: "Universal Bridge",
+  name: "Payments",
 };
 
 const engineSidebarLinks: SidebarLink = {
diff --git a/apps/portal/src/app/Header.tsx b/apps/portal/src/app/Header.tsx
@@ -137,7 +137,7 @@ const apisLinks = [
   },
   {
     href: "https://bridge.thirdweb.com/reference",
-    name: "Universal Bridge",
+    name: "Payments",
   },
   {
     href: "/connect/account-abstraction/api",
diff --git a/apps/portal/src/app/account/create-account/page.mdx b/apps/portal/src/app/account/create-account/page.mdx
@@ -16,7 +16,7 @@ export const metadata = createMetadata({
 
 # Create Account
 
-Learn how to get started with thirdweb by creating an account and setting up your first project. 
+Learn how to get started with thirdweb by creating an account and setting up your first project.
 
 <Steps>
 
@@ -41,21 +41,21 @@ Sign-in and connect to thirdweb using any of the following wallet options:
 
 <Step title="Setup Team">
 
-Upon signing up, you will be prompted to create your team by entering a team name and avatar. These will be used to identify your team in the dashboard and appear on shared projects. 
+Upon signing up, you will be prompted to create your team by entering a team name and avatar. These will be used to identify your team in the dashboard and appear on shared projects.
 
 <DocImage src={SetupTeam} alt="Setup Team" />
 
 </Step>
 
 <Step title="Invite Team Members">
-Invite team members to collaborate on projects by entering their email addresses. This step does require you to provide billing information so you may opt to do this later. 
+Invite team members to collaborate on projects by entering their email addresses. This step does require you to provide billing information so you may opt to do this later.
 
 <DocImage src={InviteTeam} alt="Invite Team Members" />
 </Step>
 
 <Step title="Create Project">
 
-Create your first thirdweb project by selecting the "Create Project" button. You will be prompted to enter a project name and allowed domains. 
+Create your first thirdweb project by selecting the "Create Project" button. You will be prompted to enter a project name and allowed domains.
 
 <Callout variant="info" title="Allowed Domains">
 Allowed domains restrict which websites can access your project's API Key and is highly recommended to set up for security purposes.
@@ -77,7 +77,7 @@ Keep your Secret Key confidential—never share it or leave it exposed. It authe
 </Step>
 
 <Step title="Begin Building">
-Your API Key is now ready to begin accessing thirdweb services such as RPC, Account Abstraction, In-App Wallets, Universal Bridge, Storage, and more. 
+Your API Key is now ready to begin accessing thirdweb services such as RPC, Account Abstraction, In-App Wallets, Payments, Storage, and more.
 
 You can access the API documentation and other get started resources in the [thirdweb developer portal](https://portal.thirdweb.com).
 </Step>
diff --git a/apps/portal/src/app/dotnet/sidebar.tsx b/apps/portal/src/app/dotnet/sidebar.tsx
@@ -308,10 +308,10 @@ export const sidebar: SideBar = {
         },
         {
           href: "https://thirdweb-dev.github.io/dotnet/docs/Thirdweb.Bridge.ThirdwebBridge.html",
-          name: "Universal Bridge Full Reference",
+          name: "Full Reference",
         },
       ],
-      name: "Bridge",
+      name: "Payments",
     },
     {
       separator: true,
diff --git a/apps/portal/src/app/dotnet/universal-bridge/quickstart/page.mdx b/apps/portal/src/app/dotnet/universal-bridge/quickstart/page.mdx
@@ -1,15 +1,16 @@
 import { Details, createMetadata } from "@doc";
 
 export const metadata = createMetadata({
-	title: "ThirdwebBridge | Thirdweb .NET SDK",
+	title: "Payments | Thirdweb .NET SDK",
 	description:
-		"Instantiate Universal Bridge to use any asset on any chain.",
+		"Enable your users to trade assets across any supported chain using any token.",
 });
 
-# Universal Bridge .NET Integration
-We've built Universal Bridge to allow your users to use any asset on any chain, and it's ready for you to try.
+# Payments .NET Integration
 
-This integration simplifies onchain asset trading, and we've added extensions in .NET to integrate with any `IThirdwebWallet` nicely.
+Payments enables your users to trade assets across any supported chain using any token.
+
+To streamline onchain asset trading, we've added .NET extensions that work seamlessly with any `IThirdwebWallet` nicely.
 
 ## Core APIs
 
diff --git a/apps/portal/src/app/page.tsx b/apps/portal/src/app/page.tsx
@@ -133,7 +133,7 @@ function ReferenceSection() {
           icon={BridgeIcon}
           iconClassName="text-muted-foreground"
           isExternal
-          title="Universal Bridge"
+          title="Payments"
         />
         <SDKCard
           href="/connect/wallet/get-users"
diff --git a/apps/portal/src/app/references/components/TDoc/utils/getSidebarLinkgroups.ts b/apps/portal/src/app/references/components/TDoc/utils/getSidebarLinkgroups.ts
@@ -12,7 +12,7 @@ const tagsToGroup = {
   "@account": "Account",
   "@appURI": "App URI",
   "@auth": "Auth",
-  "@bridge": "Universal Bridge",
+  "@bridge": "Payments",
   "@chain": "Chain",
   "@claimConditions": "Claim Conditions",
   "@client": "Client",
@@ -303,13 +303,13 @@ export function getSidebarLinkGroups(doc: TransformedDoc, path: string) {
         linkGroups.push({
           href: getLink(`${path}/${key}`),
           isCollapsible: false,
-          links: [{ links: bridgeLinkGroups, name: "Universal Bridge" }],
+          links: [{ links: bridgeLinkGroups, name: "Payments" }],
           name: name,
         });
       } else {
         linkGroups
           .find((group) => group.name === name)
-          ?.links.push({ links: bridgeLinkGroups, name: "Universal Bridge" });
+          ?.links.push({ links: bridgeLinkGroups, name: "Payments" });
       }
     }
 
diff --git a/apps/portal/src/app/unity/v5/sidebar.tsx b/apps/portal/src/app/unity/v5/sidebar.tsx
@@ -108,7 +108,7 @@ export const sidebar: SideBar = {
         {
           href: "/dotnet/universal-bridge/quickstart",
           icon: <ExternalLinkIcon />,
-          name: "Universal Bridge",
+          name: "Payments",
         },
       ],
       name: "Advanced Functionality",
diff --git a/packages/service-utils/src/core/services.ts b/packages/service-utils/src/core/services.ts
@@ -50,7 +50,7 @@ export const SERVICE_DEFINITIONS = {
     description:
       "Bridge, swap, and purchase cryptocurrencies and execute transactions with any fiat or tokens via cross-chain routing",
     name: "pay",
-    title: "Universal Bridge",
+    title: "Payments",
   },
   relayer: {
     // all actions allowed

Original file line number	Diff line number	Diff line change
`@@ -9,7 +9,7 @@ export default function Layout(props: { children: React.ReactNode }) {`
`9`	`9`	`<>HTTP API to bridge, swap and onramp to and from any currency</>`
`10`	`10`	`}`
`11`	`11`	`docsLink="https://portal.thirdweb.com/connect/pay/overview?utm_source=playground"`
`12`		`- title="Universal Bridge API"`
	`12`	`+ title="Payments API"`
`13`	`13`	`/>`
`14`	`14`
`15`	`15`	`{props.children}`