diff --git a/.changeset/free-pandas-reply.md b/.changeset/free-pandas-reply.md new file mode 100644 index 00000000000..1f8fb51d827 --- /dev/null +++ b/.changeset/free-pandas-reply.md @@ -0,0 +1,5 @@ +--- +"thirdweb": patch +--- + +Add thirdweb branding to PayEmbed diff --git a/packages/thirdweb/src/exports/react.ts b/packages/thirdweb/src/exports/react.ts index dd58207579a..3df57b00c98 100644 --- a/packages/thirdweb/src/exports/react.ts +++ b/packages/thirdweb/src/exports/react.ts @@ -136,7 +136,7 @@ export type { PaymentInfo, DirectPaymentOptions, FundWalletOptions, - TranasctionOptions, + TransactionOptions, } from "../react/core/hooks/connection/ConnectButtonProps.js"; export { diff --git a/packages/thirdweb/src/insight/get-nfts.ts b/packages/thirdweb/src/insight/get-nfts.ts index e6579b69aaa..6592991dc97 100644 --- a/packages/thirdweb/src/insight/get-nfts.ts +++ b/packages/thirdweb/src/insight/get-nfts.ts @@ -292,7 +292,7 @@ async function transformNFTModel( client: client, }), id: BigInt(token_id), - }); + }).catch(() => 0n); parsedNft = parseNFT(metadata, { tokenId: BigInt(token_id), diff --git a/packages/thirdweb/src/react/core/hooks/connection/ConnectButtonProps.ts b/packages/thirdweb/src/react/core/hooks/connection/ConnectButtonProps.ts index 7bc56c90e2d..33df86e34ce 100644 --- a/packages/thirdweb/src/react/core/hooks/connection/ConnectButtonProps.ts +++ b/packages/thirdweb/src/react/core/hooks/connection/ConnectButtonProps.ts @@ -134,7 +134,14 @@ export type PayUIOptions = Prettify< name?: string; image?: string; }; - } & (FundWalletOptions | DirectPaymentOptions | TranasctionOptions) + + /** + * Show the "Powered by Thirdweb" branding at the bottom of the PayEmbed UI. + * + * By default it is `true`. + */ + showThirdwebBranding?: boolean; + } & (FundWalletOptions | DirectPaymentOptions | TransactionOptions) >; export type FundWalletOptions = { @@ -168,7 +175,7 @@ export type DirectPaymentOptions = { paymentInfo: PaymentInfo; }; -export type TranasctionOptions = { +export type TransactionOptions = { mode: "transaction"; /** * The transaction to be executed. diff --git a/packages/thirdweb/src/react/core/hooks/transaction/useSendTransaction.ts b/packages/thirdweb/src/react/core/hooks/transaction/useSendTransaction.ts index 45ccd92e258..fe9a7baf627 100644 --- a/packages/thirdweb/src/react/core/hooks/transaction/useSendTransaction.ts +++ b/packages/thirdweb/src/react/core/hooks/transaction/useSendTransaction.ts @@ -83,6 +83,7 @@ export type SendTransactionPayModalConfig = transactionHash: Hex; }, ) => void; + showThirdwebBranding?: boolean; } | false; diff --git a/packages/thirdweb/src/react/web/hooks/transaction/useSendTransaction.tsx b/packages/thirdweb/src/react/web/hooks/transaction/useSendTransaction.tsx index 629bcd6eb4b..d7b2f74c270 100644 --- a/packages/thirdweb/src/react/web/hooks/transaction/useSendTransaction.tsx +++ b/packages/thirdweb/src/react/web/hooks/transaction/useSendTransaction.tsx @@ -127,6 +127,7 @@ export function useSendTransaction(config: SendTransactionConfig = {}) { transaction: data.tx, metadata: payModal?.metadata, onPurchaseSuccess: payModal?.onPurchaseSuccess, + showThirdwebBranding: payModal?.showThirdwebBranding, }} />, ); diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/PoweredByTW.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/PoweredByTW.tsx index 1d469cb4336..27633931e30 100644 --- a/packages/thirdweb/src/react/web/ui/ConnectWallet/PoweredByTW.tsx +++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/PoweredByTW.tsx @@ -6,13 +6,18 @@ import { ThirdwebTextIcon } from "./icons/ThirdwebTextIcon.js"; /** * @internal */ -export function PoweredByThirdweb() { +export function PoweredByThirdweb(props: { + link?: string; +}) { + const link = + props.link || + "https://playground.thirdweb.com/connect/sign-in/button?utm_source=cw_text"; return ( Powered by - + ); diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.tsx index bf6047a70ff..d9f234f2e18 100644 --- a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.tsx +++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.tsx @@ -32,6 +32,7 @@ import { Input } from "../../../components/formElements.js"; import { TokenSymbol } from "../../../components/token/TokenSymbol.js"; import { ConnectButton } from "../../ConnectButton.js"; import { ChainButton, NetworkSelectorContent } from "../../NetworkSelector.js"; +import { PoweredByThirdweb } from "../../PoweredByTW.js"; import type { ConnectLocale } from "../../locale/types.js"; import { TokenSelector } from "../TokenSelector.js"; import { WalletSwitcherConnectionScreen } from "../WalletSwitcherConnectionScreen.js"; @@ -833,7 +834,8 @@ function MainScreen(props: { } default: { return ( - + + @@ -899,6 +901,13 @@ function MainScreen(props: { )} + + {payOptions.showThirdwebBranding !== false && ( + <> + + + + )} ); } diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/DirectPaymentModeScreen.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/DirectPaymentModeScreen.tsx index 4d1948ad28b..a701a1c2ad5 100644 --- a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/DirectPaymentModeScreen.tsx +++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/DirectPaymentModeScreen.tsx @@ -27,6 +27,7 @@ import { Container, Line, ModalHeader } from "../../../components/basic.js"; import { Button } from "../../../components/buttons.js"; import { Text } from "../../../components/text.js"; import { ConnectButton } from "../../ConnectButton.js"; +import { PoweredByThirdweb } from "../../PoweredByTW.js"; import { type ERC20OrNativeToken, isNativeToken } from "../nativeToken.js"; import type { SupportedChainAndTokens } from "./swap/useSwapSupportedChains.js"; @@ -108,7 +109,8 @@ export function DirectPaymentModeScreen(props: { }; return ( - + + @@ -268,6 +270,13 @@ export function DirectPaymentModeScreen(props: { /> )} + + {payUiOptions.showThirdwebBranding !== false && ( + <> + + + + )} ); } diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/TransactionModeScreen.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/TransactionModeScreen.tsx index 74924c3cb58..e40bbb1d696 100644 --- a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/TransactionModeScreen.tsx +++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/TransactionModeScreen.tsx @@ -30,6 +30,7 @@ import { Button } from "../../../components/buttons.js"; import { Text } from "../../../components/text.js"; import { TokenSymbol } from "../../../components/token/TokenSymbol.js"; import { ConnectButton } from "../../ConnectButton.js"; +import { PoweredByThirdweb } from "../../PoweredByTW.js"; import { OutlineWalletIcon } from "../../icons/OutlineWalletIcon.js"; import { formatTokenBalance } from "../formatTokenBalance.js"; import { @@ -167,7 +168,8 @@ export function TransactionModeScreen(props: { balanceQuery.data.value < transactionCostAndData.transactionValueWei; return ( - + + @@ -378,6 +380,13 @@ export function TransactionModeScreen(props: { /> )} + + {payUiOptions.showThirdwebBranding !== false && ( + <> + + + + )} ); }