[MNY-256] SDK: Update onSuccess prop of BuyWidget, CheckoutWidget, BridgeWidget components

Author: MananTank

.changeset/strong-buses-love.md

@@ -0,0 +1,14 @@
+---
+"thirdweb": patch
+---
+
+Update `onSuccess` prop on `BuyWidget`, `CheckoutWidget`, `SwapWidget`, and `BridgeWidget` components to include `statuses` and `quote` objects instead of just `quote`.
+
+```tsx
+<BuyWidget
+  onSuccess={(data) => {
+    console.log(data.statuses);
+    console.log(data.quote);
+  }}
+/>
+```

apps/dashboard/src/@/components/blocks/BuyAndSwapEmbed.tsx

@@ -147,7 +147,7 @@ export function BuyAndSwapEmbed(props: {
               });
             }
           }}
-          onSuccess={(quote) => {
+          onSuccess={({ quote }) => {
             reportTokenBuySuccessful({
               buyTokenChainId:
                 quote.type === "buy"
@@ -208,7 +208,7 @@ export function BuyAndSwapEmbed(props: {
               pageType: props.pageType,
             });
           }}
-          onSuccess={(quote) => {
+          onSuccess={({ quote }) => {
             reportTokenSwapSuccessful({
               buyTokenChainId: quote.intent.destinationChainId,
               buyTokenAddress: quote.intent.destinationTokenAddress,

apps/portal/src/app/bridge/bridge-widget-script/page.mdx

@@ -104,7 +104,10 @@ type Options = {
   swap?: {
     className?: string;
     style?: React.CSSProperties;
-    onSuccess?: (quote: SwapPreparedQuote) => void;
+    onSuccess?: (data: {
+      quote: SwapPreparedQuote;
+      statuses: CompletedStatusResult[];
+    }) => void;
     onError?: (error: Error, quote: SwapPreparedQuote) => void;
     onCancel?: (quote: SwapPreparedQuote) => void;
     onDisconnect?: () => void;
@@ -132,7 +135,10 @@ type Options = {
       error: Error,
       quote: BuyOrOnrampPrepareResult | undefined,
     ) => void;
-    onSuccess?: (quote: BuyOrOnrampPrepareResult) => void;
+    onSuccess?: (data: {
+      quote: BuyOrOnrampPrepareResult;
+      statuses: CompletedStatusResult[];
+    }) => void;
     className?: string;
     country?: string;
     presetOptions?: [number, number, number];

packages/thirdweb/src/exports/react.ts

@@ -73,10 +73,12 @@ export type {
   SendTransactionPayModalConfig,
 } from "../react/core/hooks/transaction/useSendTransaction.js";
 export { useSimulateTransaction } from "../react/core/hooks/transaction/useSimulateTransaction.js";
+export type { BridgePrepareResult } from "../react/core/hooks/useBridgePrepare.js";
 export {
   type UseBridgeRoutesParams,
   useBridgeRoutes,
 } from "../react/core/hooks/useBridgeRoutes.js";
+export type { CompletedStatusResult } from "../react/core/hooks/useStepExecutor.js";
 export { useActiveAccount } from "../react/core/hooks/wallets/useActiveAccount.js";
 // wallet hooks
 export { useActiveWallet } from "../react/core/hooks/wallets/useActiveWallet.js";
@@ -133,7 +135,7 @@ export { useProfiles } from "../react/web/hooks/wallets/useProfiles.js";
 export { useUnlinkProfile } from "../react/web/hooks/wallets/useUnlinkProfile.js";
 export { ThirdwebProvider } from "../react/web/providers/thirdweb-provider.js";
 export { AutoConnect } from "../react/web/ui/AutoConnect/AutoConnect.js";
-
+export type { BuyOrOnrampPrepareResult } from "../react/web/ui/Bridge/BuyWidget.js";
 export {
   BuyWidget,
   type BuyWidgetProps,
@@ -276,7 +278,6 @@ export { SiteEmbed } from "../react/web/ui/SiteEmbed.js";
 export { SiteLink } from "../react/web/ui/SiteLink.js";
 export { TransactionButton } from "../react/web/ui/TransactionButton/index.js";
 export type { LocaleId } from "../react/web/ui/types.js";
-
 // Utils
 export { getLastAuthProvider } from "../react/web/utils/storage.js";
 export type {

packages/thirdweb/src/react/web/ui/Bridge/BuyWidget.tsx

@@ -158,7 +158,10 @@ export type BuyWidgetProps = {
   /**
    * Callback triggered when the purchase is successful.
    */
-  onSuccess?: (quote: BuyOrOnrampPrepareResult) => void;
+  onSuccess?: (data: {
+    quote: BuyOrOnrampPrepareResult;
+    statuses: CompletedStatusResult[];
+  }) => void;
 
   /**
    * Callback triggered when the purchase encounters an error.
@@ -616,7 +619,10 @@ function BridgeWidgetContent(
             screen.preparedQuote.type === "buy" ||
             screen.preparedQuote.type === "onramp"
           ) {
-            props.onSuccess?.(screen.preparedQuote);
+            props.onSuccess?.({
+              quote: screen.preparedQuote,
+              statuses: completedStatuses,
+            });
           }
           setScreen({
             id: "6:success",

packages/thirdweb/src/react/web/ui/Bridge/CheckoutWidget.tsx

@@ -170,7 +170,10 @@ export type CheckoutWidgetProps = {
   /**
    * Callback triggered when the purchase is successful.
    */
-  onSuccess?: (quote: BridgePrepareResult) => void;
+  onSuccess?: (data: {
+    quote: BridgePrepareResult;
+    statuses: CompletedStatusResult[];
+  }) => void;
 
   /**
    * Callback triggered when the purchase encounters an error.
@@ -660,7 +663,10 @@ function CheckoutWidgetContent(
           handleCancel(screen.preparedQuote);
         }}
         onComplete={(completedStatuses) => {
-          props.onSuccess?.(screen.preparedQuote);
+          props.onSuccess?.({
+            quote: screen.preparedQuote,
+            statuses: completedStatuses,
+          });
           setScreen({
             id: "6:success",
             preparedQuote: screen.preparedQuote,

packages/thirdweb/src/react/web/ui/Bridge/bridge-widget/bridge-widget.tsx

@@ -13,6 +13,7 @@ import {
   spacing,
   type Theme,
 } from "../../../../core/design-system/index.js";
+import type { CompletedStatusResult } from "../../../../core/hooks/useStepExecutor.js";
 import { EmbedContainer } from "../../ConnectWallet/Modal/ConnectEmbed.js";
 import { Container } from "../../components/basic.js";
 import { Button } from "../../components/buttons.js";
@@ -82,7 +83,10 @@ export type BridgeWidgetProps = {
     /** Optional style overrides applied to the Swap tab content container. */
     style?: React.CSSProperties;
     /** Callback invoked when a swap is successful. */
-    onSuccess?: (quote: SwapPreparedQuote) => void;
+    onSuccess?: (data: {
+      quote: SwapPreparedQuote;
+      statuses: CompletedStatusResult[];
+    }) => void;
     /** Callback invoked when an error occurs during swapping. */
     onError?: (error: Error, quote: SwapPreparedQuote) => void;
     /** Callback invoked when the user cancels the swap. */
@@ -172,7 +176,10 @@ export type BridgeWidgetProps = {
       quote: BuyOrOnrampPrepareResult | undefined,
     ) => void;
     /** Callback triggered when the purchase is successful. */
-    onSuccess?: (quote: BuyOrOnrampPrepareResult) => void;
+    onSuccess?: (data: {
+      quote: BuyOrOnrampPrepareResult;
+      statuses: CompletedStatusResult[];
+    }) => void;
     /** Optional class name applied to the Buy tab content container. */
     className?: string;
     /** The user's ISO 3166 alpha-2 country code. Used to determine onramp provider support. */

packages/thirdweb/src/react/web/ui/Bridge/swap-widget/SwapWidget.tsx

@@ -145,7 +145,10 @@ export type SwapWidgetProps = {
   /**
    * Callback to be called when the swap is successful.
    */
-  onSuccess?: (quote: SwapPreparedQuote) => void;
+  onSuccess?: (data: {
+    quote: SwapPreparedQuote;
+    statuses: CompletedStatusResult[];
+  }) => void;
   /**
    * Callback to be called when user encounters an error when swapping.
    */
@@ -465,7 +468,10 @@ function SwapWidgetContent(
         }}
         onCancel={() => props.onCancel?.(screen.preparedQuote)}
         onComplete={(completedStatuses) => {
-          props.onSuccess?.(screen.preparedQuote);
+          props.onSuccess?.({
+            quote: screen.preparedQuote,
+            statuses: completedStatuses,
+          });
           setScreen({
             ...screen,
             id: "4:success",

packages/thirdweb/src/script-exports/bridge-widget-script.tsx

@@ -7,6 +7,7 @@ import {
   type Theme,
   type ThemeOverrides,
 } from "../react/core/design-system/index.js";
+import type { CompletedStatusResult } from "../react/core/hooks/useStepExecutor.js";
 import type { BuyOrOnrampPrepareResult } from "../react/web/ui/Bridge/BuyWidget.js";
 import { BridgeWidget } from "../react/web/ui/Bridge/bridge-widget/bridge-widget.js";
 import type { SwapPreparedQuote } from "../react/web/ui/Bridge/swap-widget/types.js";
@@ -23,7 +24,10 @@ export type BridgeWidgetScriptProps = {
   swap?: {
     className?: string;
     style?: React.CSSProperties;
-    onSuccess?: (quote: SwapPreparedQuote) => void;
+    onSuccess?: (data: {
+      quote: SwapPreparedQuote;
+      statuses: CompletedStatusResult[];
+    }) => void;
     onError?: (error: Error, quote: SwapPreparedQuote) => void;
     onCancel?: (quote: SwapPreparedQuote) => void;
     onDisconnect?: () => void;
@@ -51,7 +55,10 @@ export type BridgeWidgetScriptProps = {
       error: Error,
       quote: BuyOrOnrampPrepareResult | undefined,
     ) => void;
-    onSuccess?: (quote: BuyOrOnrampPrepareResult) => void;
+    onSuccess?: (data: {
+      quote: BuyOrOnrampPrepareResult;
+      statuses: CompletedStatusResult[];
+    }) => void;
     className?: string;
     country?: string;
     presetOptions?: [number, number, number];