From a9dd26cd5703cb19f3e223ca23c7db81a0b6793d Mon Sep 17 00:00:00 2001 From: kien-ngo Date: Wed, 11 Dec 2024 00:29:03 +0000 Subject: [PATCH] [SDK] Add missing use-client directives to some components (#5676) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Problem solved Short description of the bug fixed or feature added --- ## PR-Codex overview This PR focuses on updating various components in the `thirdweb` package, specifically related to `Account`, `NFT`, `Chain`, and `Token` functionalities. It introduces new imports and ensures that the components are utilizing the necessary contexts and types. ### Detailed summary - In `Account/provider.tsx`: Added import for `Address`. - In `NFT/provider.tsx`: Added import for `ThirdwebContract`. - In `Account/blobbie.tsx`: Imported `Blobbie` and `useAccountContext`. - In `Chain/icon.tsx`, `Token/icon.tsx`, `NFT/name.tsx`, and `NFT/media.tsx`: Imported `UseQueryOptions`, `useQuery`, and `getChainMetadata`. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` --- packages/thirdweb/src/react/web/ui/prebuilt/Account/blobbie.tsx | 2 ++ .../thirdweb/src/react/web/ui/prebuilt/Account/provider.tsx | 1 + packages/thirdweb/src/react/web/ui/prebuilt/Chain/icon.tsx | 2 ++ packages/thirdweb/src/react/web/ui/prebuilt/NFT/media.tsx | 2 ++ packages/thirdweb/src/react/web/ui/prebuilt/NFT/name.tsx | 2 ++ packages/thirdweb/src/react/web/ui/prebuilt/NFT/provider.tsx | 2 ++ packages/thirdweb/src/react/web/ui/prebuilt/Token/icon.tsx | 2 ++ 7 files changed, 13 insertions(+) diff --git a/packages/thirdweb/src/react/web/ui/prebuilt/Account/blobbie.tsx b/packages/thirdweb/src/react/web/ui/prebuilt/Account/blobbie.tsx index 1b1fe304068..f36e257b4d8 100644 --- a/packages/thirdweb/src/react/web/ui/prebuilt/Account/blobbie.tsx +++ b/packages/thirdweb/src/react/web/ui/prebuilt/Account/blobbie.tsx @@ -1,3 +1,5 @@ +"use client"; + import { Blobbie, type BlobbieProps } from "../../ConnectWallet/Blobbie.js"; import { useAccountContext } from "./provider.js"; diff --git a/packages/thirdweb/src/react/web/ui/prebuilt/Account/provider.tsx b/packages/thirdweb/src/react/web/ui/prebuilt/Account/provider.tsx index ed1d0d3a6ec..2d2714cd022 100644 --- a/packages/thirdweb/src/react/web/ui/prebuilt/Account/provider.tsx +++ b/packages/thirdweb/src/react/web/ui/prebuilt/Account/provider.tsx @@ -1,4 +1,5 @@ "use client"; + import type { Address } from "abitype"; import type React from "react"; import { createContext, useContext } from "react"; diff --git a/packages/thirdweb/src/react/web/ui/prebuilt/Chain/icon.tsx b/packages/thirdweb/src/react/web/ui/prebuilt/Chain/icon.tsx index 356fe69b58b..21dc1f54515 100644 --- a/packages/thirdweb/src/react/web/ui/prebuilt/Chain/icon.tsx +++ b/packages/thirdweb/src/react/web/ui/prebuilt/Chain/icon.tsx @@ -1,3 +1,5 @@ +"use client"; + import { type UseQueryOptions, useQuery } from "@tanstack/react-query"; import type { JSX } from "react"; import { getChainMetadata } from "../../../../../chains/utils.js"; diff --git a/packages/thirdweb/src/react/web/ui/prebuilt/NFT/media.tsx b/packages/thirdweb/src/react/web/ui/prebuilt/NFT/media.tsx index 814de3b124c..c650307e374 100644 --- a/packages/thirdweb/src/react/web/ui/prebuilt/NFT/media.tsx +++ b/packages/thirdweb/src/react/web/ui/prebuilt/NFT/media.tsx @@ -1,3 +1,5 @@ +"use client"; + import { type UseQueryOptions, useQuery } from "@tanstack/react-query"; import type { JSX } from "react"; import type { ThirdwebContract } from "../../../../../contract/contract.js"; diff --git a/packages/thirdweb/src/react/web/ui/prebuilt/NFT/name.tsx b/packages/thirdweb/src/react/web/ui/prebuilt/NFT/name.tsx index 8d5da597a20..5f7402db9e8 100644 --- a/packages/thirdweb/src/react/web/ui/prebuilt/NFT/name.tsx +++ b/packages/thirdweb/src/react/web/ui/prebuilt/NFT/name.tsx @@ -1,3 +1,5 @@ +"use client"; + import { type UseQueryOptions, useQuery } from "@tanstack/react-query"; import type { JSX } from "react"; import type { ThirdwebContract } from "../../../../../contract/contract.js"; diff --git a/packages/thirdweb/src/react/web/ui/prebuilt/NFT/provider.tsx b/packages/thirdweb/src/react/web/ui/prebuilt/NFT/provider.tsx index 5eb85ff93e2..d8657f77343 100644 --- a/packages/thirdweb/src/react/web/ui/prebuilt/NFT/provider.tsx +++ b/packages/thirdweb/src/react/web/ui/prebuilt/NFT/provider.tsx @@ -1,3 +1,5 @@ +"use client"; + import { createContext, useContext } from "react"; import type { ThirdwebContract } from "../../../../../contract/contract.js"; diff --git a/packages/thirdweb/src/react/web/ui/prebuilt/Token/icon.tsx b/packages/thirdweb/src/react/web/ui/prebuilt/Token/icon.tsx index 4c9bb4cff6a..65bdf4b481e 100644 --- a/packages/thirdweb/src/react/web/ui/prebuilt/Token/icon.tsx +++ b/packages/thirdweb/src/react/web/ui/prebuilt/Token/icon.tsx @@ -1,3 +1,5 @@ +"use client"; + import { type UseQueryOptions, useQuery } from "@tanstack/react-query"; import type { JSX } from "react"; import { getChainMetadata } from "../../../../../chains/utils.js";