thirdweb 5.53.1-nightly-865c5e3b16af70c3660f30ba8cffc5d6e360a389-20240911000352 → 5.54.0

package/src/extensions/prebuilts/get-required-transactions.test.ts

@@ -0,0 +1,61 @@
+import { describe, expect, it } from "vitest";
+import { CLEAN_ANVIL_CHAIN } from "../../../test/src/chains.js";
+import { TEST_CLIENT } from "../../../test/src/test-clients.js";
+import { fetchPublishedContractMetadata } from "../../contract/deployment/publisher.js";
+import { getRequiredTransactionCount } from "./get-required-transactions.js";
+
+describe.runIf(process.env.TW_SECRET_KEY)(
+  "getRequiredTransactions",
+  {
+    timeout: 120000,
+  },
+  () => {
+    it("should count transactions for a published direct deploy contract", async () => {
+      const metadata = await fetchPublishedContractMetadata({
+        client: TEST_CLIENT,
+        contractId: "AccountFactory",
+      });
+      const results = await getRequiredTransactionCount({
+        client: TEST_CLIENT,
+        chain: CLEAN_ANVIL_CHAIN,
+        metadata,
+      });
+      expect(results.length).toBe(1);
+    });
+
+    it("should count transactions for a published autofactory contract", async () => {
+      const metadata = await fetchPublishedContractMetadata({
+        client: TEST_CLIENT,
+        contractId: "Airdrop",
+      });
+      const results = await getRequiredTransactionCount({
+        client: TEST_CLIENT,
+        chain: CLEAN_ANVIL_CHAIN,
+        metadata,
+      });
+      expect(results.length).toBe(4);
+    });
+
+    it("should count transactions for a modular contract with modules", async () => {
+      const metadata = await fetchPublishedContractMetadata({
+        client: TEST_CLIENT,
+        contractId: "ERC721CoreInitializable",
+      });
+      const results = await getRequiredTransactionCount({
+        client: TEST_CLIENT,
+        chain: CLEAN_ANVIL_CHAIN,
+        metadata,
+        modules: await Promise.all(
+          ["ClaimableERC721", "BatchMetadataERC721", "RoyaltyERC721"].map(
+            (contractId) =>
+              fetchPublishedContractMetadata({
+                client: TEST_CLIENT,
+                contractId,
+              }),
+          ),
+        ),
+      });
+      expect(results.length).toBe(7);
+    });
+  },
+);

package/src/extensions/prebuilts/get-required-transactions.ts

@@ -0,0 +1,110 @@
+import type { Chain } from "../../chains/types.js";
+import type { ThirdwebClient } from "../../client/client.js";
+import { getDeployedCreate2Factory } from "../../contract/deployment/utils/create-2-factory.js";
+import { getDeployedInfraContract } from "../../contract/deployment/utils/infra.js";
+import { getDeployedInfraContractFromMetadata } from "../../contract/deployment/utils/infra.js";
+import { computePublishedContractAddress } from "../../utils/any-evm/compute-published-contract-address.js";
+import type { FetchDeployMetadataResult } from "../../utils/any-evm/deploy-metadata.js";
+
+/**
+ * @internal
+ */
+export type DeployTransactionType =
+  | "infra"
+  | "implementation"
+  | "module"
+  | "proxy";
+
+/**
+ * @internal
+ */
+export type DeployTransactionResult = {
+  type: DeployTransactionType;
+  contractId: string;
+};
+
+/**
+ * @internal
+ */
+export async function getRequiredTransactionCount(options: {
+  chain: Chain;
+  client: ThirdwebClient;
+  metadata: FetchDeployMetadataResult;
+  constructorParams?: Record<string, unknown>;
+  implementationConstructorParams?: Record<string, unknown>;
+  modules?: FetchDeployMetadataResult[];
+}): Promise<DeployTransactionResult[]> {
+  const {
+    chain,
+    client,
+    metadata,
+    implementationConstructorParams,
+    modules = [],
+  } = options;
+
+  if (metadata?.deployType === "autoFactory") {
+    const results: (DeployTransactionResult | null)[] = await Promise.all([
+      getDeployedCreate2Factory({
+        chain,
+        client,
+      }).then((c) =>
+        c ? null : ({ type: "infra", contractId: "Create2Factory" } as const),
+      ),
+      getDeployedInfraContract({
+        chain,
+        client,
+        contractId: "Forwarder",
+      }).then((c) =>
+        c ? null : ({ type: "infra", contractId: "Forwarder" } as const),
+      ),
+      getDeployedInfraContract({
+        chain,
+        client,
+        contractId: "TWCloneFactory",
+        constructorParams: {
+          _trustedForwarder: await computePublishedContractAddress({
+            chain,
+            client,
+            contractId: "Forwarder",
+          }),
+        },
+      }).then((c) =>
+        c ? null : ({ type: "infra", contractId: "TWCloneFactory" } as const),
+      ),
+      // TODO (deploy): add WETH contract check for implementations that need it (check implementation constructor params)
+      getDeployedInfraContract({
+        chain,
+        client,
+        contractId: metadata.name,
+        constructorParams: implementationConstructorParams,
+        publisher: metadata.publisher,
+        version: metadata.version,
+      }).then((c) =>
+        c
+          ? null
+          : ({
+              type: "implementation",
+              contractId: metadata.name,
+            } as const),
+      ),
+      ...modules.map((m) =>
+        getDeployedInfraContractFromMetadata({
+          chain,
+          client,
+          contractMetadata: m,
+        }).then((c) =>
+          c
+            ? null
+            : ({
+                type: "module",
+                contractId: m.name,
+              } as const),
+        ),
+      ),
+    ]);
+    results.push({ type: "proxy", contractId: metadata.name });
+    return results.filter((r) => r !== null);
+  }
+
+  return [{ type: "implementation", contractId: metadata.name }];
+}

package/src/extensions/split/read/getRecipientSplitPercentage.ts

@@ -20,6 +20,19 @@ export interface SplitRecipient {
   splitPercentage: number;
 }
 
+/**
+ * Get the split percentage of a recipient
+ * @param options - The options for the transaction
+ * @param options.recipientAddress - The address of the recipient
+ * @returns The split percentage of the recipient
+ * @extension SPLIT
+ * @example
+ * ```ts
+ * import { getRecipientSplitPercentage } from "thirdweb/extensions/split";
+ *
+ * const percentage = await getRecipientSplitPercentage({ recipientAddress: "0x..." });
+ * ```
+ */
 export async function getRecipientSplitPercentage(
   options: BaseTransactionOptions<{ recipientAddress: string }>,
 ): Promise<SplitRecipient> {

package/src/react/core/hooks/others/useProfiles.ts

@@ -18,7 +18,7 @@ import { useActiveWallet } from "../wallets/useActiveWallet.js";
  * const { data: profiles } = useProfiles();
  *
  * console.log("Type:", profiles[0].type); // "discord"
- * console.log("Email:", profiles[0].email); // "john.doe@example.com"
+ * console.log("Email:", profiles[0].details.email); // "john.doe@example.com"
  * ```
  *
  * @wallet

package/src/react/core/social/useSocialProfiles.ts

@@ -17,6 +17,8 @@ import { getSocialProfiles } from "../../../social/profiles.js";
  *   address: "0x...",
  * });
  * ```
+ *
+ * @social
  * @beta
  */
 export function useSocialProfiles(options: {

package/src/react/core/utils/defaultTokens.ts

@@ -342,6 +342,20 @@ export const defaultTokens = DEFAULT_TOKENS as unknown as SupportedTokens;
 type SupportedSymbol =
   (typeof DEFAULT_TOKENS)[keyof typeof DEFAULT_TOKENS][number]["symbol"];
 
+/**
+ * Get the default token for a given chain and symbol
+ * @param chain - The chain to get the token for
+ * @param symbol - The symbol of the token to get
+ * @returns The default token for the given chain and symbol
+ * @example
+ * ```ts
+ * import { getDefaultToken } from "thirdweb/react";
+ * import { ethereum } from "thirdweb/chains";
+ *
+ * const token = getDefaultToken(ethereum, "USDC");
+ * ```
+ * @utils
+ */
 export function getDefaultToken(chain: Chain, symbol: SupportedSymbol) {
   const tokens = defaultTokens[chain.id];
   return tokens?.find((t) => t.symbol === symbol);

package/src/react/native/ui/components/Address.tsx

@@ -1,6 +1,5 @@
-import Clipboard from "@react-native-clipboard/clipboard";
 import { useState } from "react";
-import { StyleSheet, TouchableOpacity } from "react-native";
+import { Clipboard, StyleSheet, TouchableOpacity } from "react-native";
 import type { Account } from "../../../../wallets/interfaces/wallet.js";
 import type { Theme } from "../../../core/design-system/index.js";
 import { spacing } from "../../design-system/index.js";
@@ -20,7 +19,6 @@ export const Address = ({ account, theme, addressOrENS }: AddressProps) => {
     <TouchableOpacity
       style={styles.addressContainer}
       onPress={() => {
-        // @ts-ignore - missing native types
         Clipboard.setString(account.address);
         setCopySuccess(true);
         setTimeout(() => {

package/src/react/web/ui/ConnectWallet/Details.tsx

@@ -10,6 +10,7 @@ import {
 } from "@radix-ui/react-icons";
 import { useQuery } from "@tanstack/react-query";
 import { useContext, useEffect, useState } from "react";
+import { trackPayEvent } from "../../../../analytics/track.js";
 import type { Chain } from "../../../../chains/types.js";
 import type { ThirdwebClient } from "../../../../client/client.js";
 import { getContract } from "../../../../contract/contract.js";
@@ -568,6 +569,12 @@ function DetailsModal(props: {
                     flex: 1,
                   }}
                   onClick={() => {
+                    trackPayEvent({
+                      event: "details_modal_buy_click",
+                      client: client,
+                      walletAddress: activeAccount?.address,
+                      walletType: activeWallet?.id,
+                    });
                     setScreen("buy");
                   }}
                 >

package/src/react/web/ui/ConnectWallet/screens/Buy/BuyScreen.tsx

@@ -1,5 +1,6 @@
 import { IdCardIcon } from "@radix-ui/react-icons";
 import { useCallback, useMemo, useState } from "react";
+import { trackPayEvent } from "../../../../../../analytics/track.js";
 import type { Chain } from "../../../../../../chains/types.js";
 import type { ThirdwebClient } from "../../../../../../client/client.js";
 import { NATIVE_TOKEN_ADDRESS } from "../../../../../../constants/addresses.js";
@@ -528,7 +529,13 @@ function BuyScreenContent(props: BuyScreenContentProps) {
               }}
             >
               {screen.id === "select-payment-method" && (
-                <PaymentMethodSelection setScreen={(id) => setScreen({ id })} />
+                <PaymentMethodSelection
+                  mode={payOptions.mode}
+                  client={client}
+                  walletAddress={payer.account.address}
+                  walletType={payer.wallet.id}
+                  setScreen={(id) => setScreen({ id })}
+                />
               )}
 
               {screen.id === "select-wallet" && (
@@ -891,7 +898,11 @@ function TokenSelectedLayout(props: {
 }
 
 function PaymentMethodSelection(props: {
+  client: ThirdwebClient;
+  walletAddress: string;
+  walletType: string;
   setScreen: (screenId: "select-wallet" | "buy-with-fiat") => void;
+  mode?: "transaction" | "direct_payment" | "fund_wallet";
 }) {
   return (
     <Container animate="fadein">
@@ -900,7 +911,15 @@ function PaymentMethodSelection(props: {
         <Button
           variant="outline"
           bg="tertiaryBg"
-          onClick={() => props.setScreen("buy-with-fiat")}
+          onClick={() => {
+            trackPayEvent({
+              event: `pay_with_credit_card_${props.mode || "unknown"}_mode`,
+              client: props.client,
+              walletAddress: props.walletAddress,
+              walletType: props.walletType,
+            });
+            props.setScreen("buy-with-fiat");
+          }}
           gap="sm"
           style={{
             justifyContent: "flex-start",
@@ -928,7 +947,16 @@ function PaymentMethodSelection(props: {
         <Button
           variant="outline"
           bg="tertiaryBg"
-          onClick={() => props.setScreen("select-wallet")}
+          onClick={() => {
+            trackPayEvent({
+              event: `pay_with_crypto_${props.mode || "unknown"}_mode`,
+              client: props.client,
+              walletAddress: props.walletAddress,
+              walletType: props.walletType,
+            });
+
+            props.setScreen("select-wallet");
+          }}
           style={{
             justifyContent: "flex-start",
           }}

package/src/react/web/ui/ConnectWallet/screens/Buy/DirectPaymentModeScreen.tsx

@@ -1,4 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
+import { trackPayEvent } from "../../../../../../analytics/track.js";
 import type { Chain } from "../../../../../../chains/types.js";
 import type { ThirdwebClient } from "../../../../../../client/client.js";
 import { NATIVE_TOKEN_ADDRESS } from "../../../../../../constants/addresses.js";
@@ -242,6 +243,12 @@ export function DirectPaymentModeScreen(props: {
           variant="accent"
           fullWidth
           onClick={() => {
+            trackPayEvent({
+              event: "choose_payment_method_direct_payment_mode",
+              client,
+              walletAddress: payerAccount.address,
+              walletType: activeWallet?.id,
+            });
             onContinue(totalCost, paymentInfo.chain, token);
           }}
         >

package/src/react/web/ui/ConnectWallet/screens/Buy/TransactionModeScreen.tsx

@@ -1,3 +1,4 @@
+import { trackPayEvent } from "../../../../../../analytics/track.js";
 import type { Chain } from "../../../../../../chains/types.js";
 import type { ThirdwebClient } from "../../../../../../client/client.js";
 import { NATIVE_TOKEN_ADDRESS } from "../../../../../../constants/addresses.js";
@@ -225,6 +226,12 @@ export function TransactionModeScreen(props: {
             ) {
               totalCostWei += transactionCostAndData.gasCostWei;
             }
+            trackPayEvent({
+              event: "choose_payment_method_transaction_mode",
+              client,
+              walletAddress: payerAccount.address,
+              walletType: activeWallet?.id,
+            });
             onContinue(
               toTokens(totalCostWei, transactionCostAndData.decimals),
               payUiOptions.transaction.chain,

package/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatFlow.tsx

@@ -1,4 +1,5 @@
 import { useCallback, useState } from "react";
+import { trackPayEvent } from "../../../../../../../analytics/track.js";
 import type { ThirdwebClient } from "../../../../../../../client/client.js";
 import type { BuyWithFiatQuote } from "../../../../../../../pay/buyWithFiat/getQuote.js";
 import {
@@ -88,6 +89,12 @@ export function FiatFlow(props: {
         step={1}
         onContinue={() => {
           const popup = openOnrampPopup(props.quote.onRampLink, props.theme);
+          trackPayEvent({
+            event: "open_onramp_popup",
+            client: props.client,
+            walletAddress: props.payer.account.address,
+            walletType: props.payer.wallet.id,
+          });
           addPendingTx({
             type: "fiat",
             intentId: props.quote.intentId,

package/src/react/web/ui/ConnectWallet/screens/Buy/swap/ConfirmationScreen.tsx

@@ -1,5 +1,6 @@
 import { CrossCircledIcon } from "@radix-ui/react-icons";
 import { useState } from "react";
+import { trackPayEvent } from "../../../../../../../analytics/track.js";
 import type { Chain } from "../../../../../../../chains/types.js";
 import type { ThirdwebClient } from "../../../../../../../client/client.js";
 import type { BuyWithCryptoQuote } from "../../../../../../../pay/buyWithCrypto/getQuote.js";
@@ -190,6 +191,19 @@ export function SwapConfirmationScreen(props: {
               try {
                 setStatus("pending");
 
+                trackPayEvent({
+                  event: "prompt_swap_approval",
+                  client: props.client,
+                  walletAddress: props.payer.account.address,
+                  walletType: props.payer.wallet.id,
+                  fromToken: props.quote.swapDetails.fromToken.tokenAddress,
+                  fromAmount: props.quote.swapDetails.fromAmountWei,
+                  toToken: props.quote.swapDetails.toToken.tokenAddress,
+                  toAmount: props.quote.swapDetails.toAmountWei,
+                  chainId: props.quote.swapDetails.fromToken.chainId,
+                  dstChainId: props.quote.swapDetails.toToken.chainId,
+                });
+
                 const tx = await sendTransaction({
                   account: props.payer.account,
                   transaction: props.quote.approval,
@@ -198,6 +212,19 @@ export function SwapConfirmationScreen(props: {
                 await waitForReceipt({ ...tx, maxBlocksWaitTime: 50 });
                 // props.onQuoteFinalized(props.quote);
 
+                trackPayEvent({
+                  event: "swap_approval_success",
+                  client: props.client,
+                  walletAddress: props.payer.account.address,
+                  walletType: props.payer.wallet.id,
+                  fromToken: props.quote.swapDetails.fromToken.tokenAddress,
+                  fromAmount: props.quote.swapDetails.fromAmountWei,
+                  toToken: props.quote.swapDetails.toToken.tokenAddress,
+                  toAmount: props.quote.swapDetails.toAmountWei,
+                  chainId: props.quote.swapDetails.fromToken.chainId,
+                  dstChainId: props.quote.swapDetails.toToken.chainId,
+                });
+
                 setStep("swap");
                 setStatus("idle");
               } catch (e) {
@@ -223,6 +250,19 @@ export function SwapConfirmationScreen(props: {
                   };
                 }
 
+                trackPayEvent({
+                  event: "prompt_swap_execution",
+                  client: props.client,
+                  walletAddress: props.payer.account.address,
+                  walletType: props.payer.wallet.id,
+                  fromToken: props.quote.swapDetails.fromToken.tokenAddress,
+                  fromAmount: props.quote.swapDetails.fromAmountWei,
+                  toToken: props.quote.swapDetails.toToken.tokenAddress,
+                  toAmount: props.quote.swapDetails.toAmountWei,
+                  chainId: props.quote.swapDetails.fromToken.chainId,
+                  dstChainId: props.quote.swapDetails.toToken.chainId,
+                });
+
                 const _swapTx = await sendTransaction({
                   account: props.payer.account,
                   transaction: tx,
@@ -230,6 +270,19 @@ export function SwapConfirmationScreen(props: {
 
                 await waitForReceipt({ ..._swapTx, maxBlocksWaitTime: 50 });
 
+                trackPayEvent({
+                  event: "swap_execution_success",
+                  client: props.client,
+                  walletAddress: props.payer.account.address,
+                  walletType: props.payer.wallet.id,
+                  fromToken: props.quote.swapDetails.fromToken.tokenAddress,
+                  fromAmount: props.quote.swapDetails.fromAmountWei,
+                  toToken: props.quote.swapDetails.toToken.tokenAddress,
+                  toAmount: props.quote.swapDetails.toAmountWei,
+                  chainId: props.quote.swapDetails.toToken.chainId,
+                  dstChainId: props.quote.swapDetails.toToken.chainId,
+                });
+
                 // do not add pending tx if the swap is part of fiat flow
                 if (!props.isFiatFlow) {
                   addPendingTx({

package/src/react/web/ui/ConnectWallet/screens/LinkedProfilesScreen.tsx

@@ -4,6 +4,7 @@ import { shortenAddress } from "../../../../../utils/address.js";
 import type { Profile } from "../../../../../wallets/in-app/core/authentication/types.js";
 import { fontSize, iconSize } from "../../../../core/design-system/index.js";
 import { useProfiles } from "../../../../core/hooks/others/useProfiles.js";
+import { useSocialProfiles } from "../../../../core/social/useSocialProfiles.js";
 import { getWalletIcon } from "../../../../core/utils/walletIcon.js";
 import { LoadingScreen } from "../../../wallets/shared/LoadingScreen.js";
 import { Img } from "../../components/Img.js";
@@ -88,41 +89,11 @@ export function LinkedProfilesScreen(props: {
             </MenuButton>
             <Spacer y="xs" />
             {connectedProfiles?.map((profile) => (
-              <MenuButton
+              <LinkedProfile
                 key={`${profile.type}-${getProfileDisplayName(profile)}`}
-                onClick={() => {
-                  props.setScreen("linked-profiles");
-                }}
-                style={{
-                  fontSize: fontSize.sm,
-                  cursor: "default",
-                }}
-                disabled // disabled until we have more data to show on a dedicated profile screen
-              >
-                {profile.type === "wallet" && profile.details.address ? (
-                  <Container
-                    style={{
-                      width: "24px",
-                      height: "24px",
-                      borderRadius: "100%",
-                      overflow: "hidden",
-                    }}
-                  >
-                    <Blobbie address={profile.details.address} size={24} />
-                  </Container>
-                ) : (
-                  <Img
-                    src={getWalletIcon(profile.type)}
-                    width={iconSize.md}
-                    height={iconSize.md}
-                    loading="eager"
-                    client={props.client}
-                  />
-                )}
-                <Text color="primaryText">
-                  {getProfileDisplayName(profile)}
-                </Text>
-              </MenuButton>
+                profile={profile}
+                client={props.client}
+              />
             ))}
           </Container>
           <Spacer y="md" />
@@ -131,3 +102,75 @@ export function LinkedProfilesScreen(props: {
     </Container>
   );
 }
+
+function LinkedProfile({
+  profile,
+  client,
+}: { profile: Profile; client: ThirdwebClient }) {
+  const { data: socialProfiles } = useSocialProfiles({
+    client,
+    address: profile.details.address,
+  });
+
+  return (
+    <MenuButton
+      style={{
+        fontSize: fontSize.sm,
+        cursor: "default",
+      }}
+      disabled // disabled until we have more data to show on a dedicated profile screen
+    >
+      {socialProfiles?.some((p) => p.avatar) ? (
+        <Img
+          src={socialProfiles?.find((p) => p.avatar)?.avatar}
+          width={iconSize.lg}
+          height={iconSize.lg}
+          loading="eager"
+          client={client}
+          style={{
+            borderRadius: "100%",
+          }}
+        />
+      ) : profile.details.address !== undefined ? (
+        <Container
+          style={{
+            width: "32px",
+            height: "32px",
+            borderRadius: "100%",
+            overflow: "hidden",
+          }}
+        >
+          <Blobbie address={profile.details.address} size={32} />
+        </Container>
+      ) : (
+        <Img
+          src={getWalletIcon(profile.type)}
+          width={iconSize.lg}
+          height={iconSize.lg}
+          loading="eager"
+          client={client}
+        />
+      )}
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "row",
+          justifyContent: "space-between",
+          alignItems: "center",
+          flexGrow: 1,
+        }}
+      >
+        <Text color="primaryText">
+          {socialProfiles?.find((p) => p.avatar)?.name ||
+            getProfileDisplayName(profile)}
+        </Text>
+        {socialProfiles?.find((p) => p.avatar)?.name &&
+          profile.details.address && (
+            <Text color="secondaryText" size="sm">
+              {shortenAddress(profile.details.address, 4)}
+            </Text>
+          )}
+      </div>
+    </MenuButton>
+  );
+}

package/src/react/web/ui/TransactionButton/TransactionModal.tsx

@@ -1,10 +1,14 @@
+import { useQuery } from "@tanstack/react-query";
 import { useState } from "react";
+import { trackPayEvent } from "../../../../analytics/track.js";
 import type { ThirdwebClient } from "../../../../client/client.js";
 import type { WaitForReceiptOptions } from "../../../../transaction/actions/wait-for-tx-receipt.js";
 import type { PreparedTransaction } from "../../../../transaction/prepare-transaction.js";
 import { CustomThemeProvider } from "../../../core/design-system/CustomThemeProvider.js";
 import type { Theme } from "../../../core/design-system/index.js";
 import type { PayUIOptions } from "../../../core/hooks/connection/ConnectButtonProps.js";
+import { useActiveAccount } from "../../../core/hooks/wallets/useActiveAccount.js";
+import { useActiveWallet } from "../../../core/hooks/wallets/useActiveWallet.js";
 import type { SupportedTokens } from "../../../core/utils/defaultTokens.js";
 import { LoadingScreen } from "../../wallets/shared/LoadingScreen.js";
 import { useConnectLocale } from "../ConnectWallet/locale/getConnectLocale.js";
@@ -27,6 +31,23 @@ export type ModalProps = {
 };
 
 export function TransactionModal(props: ModalProps) {
+  const account = useActiveAccount();
+  const wallet = useActiveWallet();
+
+  useQuery({
+    queryKey: ["transaction-modal-event"],
+    queryFn: () => {
+      if (!account || !wallet) return;
+      trackPayEvent({
+        client: props.client,
+        walletAddress: account.address,
+        walletType: wallet.id,
+        event: "open_pay_transaction_modal",
+      });
+    },
+    enabled: !!wallet,
+  });
+
   return (
     <CustomThemeProvider theme={props.theme}>
       <Modal

package/src/social/profiles.ts

@@ -8,7 +8,7 @@ import type { SocialProfile } from "./types.js";
  * @param args - The arguments to use when fetching the social profiles.
  * @param args.address - The wallet address to fetch the social profiles for.
  * @param args.client - The Thirdweb client.
- * @returns A promise resolving to the retrieved social profiles for different protocols. If a profile is not available for a protocol, the value will be `null`.
+ * @returns A promise resolving to the array of social profiles for the given address.
  *
  * @example
  * ```ts
@@ -18,6 +18,7 @@ import type { SocialProfile } from "./types.js";
  *   client,
  * });
  * ```
+ * @social
  * @beta
  */
 export async function getSocialProfiles(args: {