From ffb7b6487b04f12ae07c334897e7ff7cf18dc19e Mon Sep 17 00:00:00 2001
From: joaquim-verges <joaquim.verges@gmail.com>
Date: Thu, 10 Jul 2025 23:09:34 +0000
Subject: [PATCH] [Dashboard] use BuyWidget on /bridge (#7590)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixes TOOL-5023

<!--

## 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.

-->

<!-- start pr-codex -->

---

## PR-Codex overview
This PR updates the `UniversalBridgeEmbed` component to replace the `PayEmbed` with `BuyWidget` from the `thirdweb` library, modifying how payment options are handled and improving the integration with the `thirdweb` SDK.

### Detailed summary
- Replaced `PayEmbed` component with `BuyWidget`.
- Removed `payOptions` prop and its nested properties.
- Added `amount`, `chain`, and `tokenAddress` props to `BuyWidget`.
- Updated the theme handling to use `getSDKTheme`.

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

<!-- end pr-codex -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

* **New Features**
  * Updated the embedded widget in the dashboard to use a new buy widget, offering a simplified and more direct interface for purchasing tokens.

* **Refactor**
  * Streamlined the widget’s input options for a more straightforward user experience.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../client/UniversalBridgeEmbed.tsx           | 19 ++++++-------------
 1 file changed, 6 insertions(+), 13 deletions(-)

diff --git a/apps/dashboard/src/app/bridge/components/client/UniversalBridgeEmbed.tsx b/apps/dashboard/src/app/bridge/components/client/UniversalBridgeEmbed.tsx
index 34dcd8db65f..366b4d400d4 100644
--- a/apps/dashboard/src/app/bridge/components/client/UniversalBridgeEmbed.tsx
+++ b/apps/dashboard/src/app/bridge/components/client/UniversalBridgeEmbed.tsx
@@ -1,7 +1,8 @@
 "use client";
 
 import { useTheme } from "next-themes";
-import { PayEmbed, type TokenInfo } from "thirdweb/react";
+import type { Address } from "thirdweb";
+import { BuyWidget, type TokenInfo } from "thirdweb/react";
 import { useV5DashboardChain } from "@/hooks/chains/v5-adapter";
 import { getSDKTheme } from "@/utils/sdk-component-theme";
 import { bridgeAppThirdwebClient } from "../../constants";
@@ -19,19 +20,11 @@ export function UniversalBridgeEmbed({
   const chain = useV5DashboardChain(chainId || 1);
 
   return (
-    <PayEmbed
+    <BuyWidget
       client={bridgeAppThirdwebClient}
-      payOptions={{
-        mode: "fund_wallet",
-        prefillBuy:
-          chainId && token
-            ? {
-                amount,
-                chain,
-                token,
-              }
-            : undefined,
-      }}
+      amount={amount || "0"}
+      chain={chain}
+      tokenAddress={token?.address as Address | undefined}
       theme={getSDKTheme(theme === "light" ? "light" : "dark")}
     />
   );