Dashboard: Remove useThirdwebClient hook (#7228)

<!--

## 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 focuses on updating various components to accept a `client` prop of type `ThirdwebClient`, enhancing the integration and functionality of the client throughout the application.

### Detailed summary
- Added `client` prop to multiple components for better client integration.
- Updated function signatures to accept `client`.
- Modified existing usages to pass the `client` prop.
- Removed redundant client retrievals from components.

> The following files were skipped due to too many changes: `apps/dashboard/src/components/contract-components/hooks.ts`, `apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/account-abstraction/factories/page.tsx`, `apps/dashboard/src/components/embedded-wallets/Configure/index.tsx`, `apps/dashboard/src/components/contract-components/contract-publish-form/index.tsx`, `apps/dashboard/src/components/contract-components/contract-deploy-form/custom-contract.tsx`

> ✨ 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**
  - Many components now accept a client instance as a prop, enabling more explicit and flexible client management throughout the dashboard.
- **Refactor**
  - Shifted from internal client initialization to explicit client prop injection across the app, affecting forms, tables, media components, contract publishing, and wallet settings.
  - Updated hooks and utility functions to require a client parameter instead of relying on internal context.
- **Chores**
  - Removed unused files and internal hooks related to client management.
- **Bug Fixes**
  - Improved consistency and reliability when handling authentication and client context in user flows.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

Author: MananTank

apps/dashboard/src/@/constants/thirdweb.client.ts

@@ -198,6 +198,7 @@ export const CustomConnectWallet = (props: {
         open={isNetworkConfigModalOpen}
         onOpenChange={setIsNetworkConfigModalOpen}
         editChain={editChain}
+        client={client}
       />
     </>
   );

apps/dashboard/src/@3rdweb-sdk/react/components/connect-wallet/index.tsx

@@ -559,6 +559,7 @@ export const CreateListingsForm: React.FC<CreateListingsFormProps> = ({
                           width="140px"
                           height="140px"
                           requireInteraction
+                          client={contract.client}
                         />
                       </Box>
                     </Tooltip>

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/(marketplace)/components/list-form.tsx

@@ -51,6 +51,7 @@ export const ListingDrawer: React.FC<NFTDrawerProps> = ({
         <div className="flex flex-row gap-6">
           <NFTMediaWithEmptyState
             metadata={renderData.asset.metadata}
+            client={contract.client}
             requireInteraction
             width="150px"
             height="150px"

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/(marketplace)/components/listing-drawer.tsx

@@ -99,7 +99,7 @@ export const MarketplaceTable: React.FC<MarketplaceTableProps> = ({
         Header: "Media",
         accessor: (row) => row.asset.metadata,
         // biome-ignore lint/suspicious/noExplicitAny: FIXME
-        Cell: (cell: any) => <MediaCell cell={cell} />,
+        Cell: (cell: any) => <MediaCell cell={cell} client={contract.client} />,
       },
       {
         Header: "Name",

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/(marketplace)/components/marketplace-table.tsx

@@ -1,7 +1,7 @@
 import { SkeletonContainer } from "@/components/ui/skeleton";
 import { TrackedLinkTW } from "@/components/ui/tracked-link";
 import { useMemo } from "react";
-import { type NFT, ZERO_ADDRESS } from "thirdweb";
+import { type NFT, type ThirdwebClient, ZERO_ADDRESS } from "thirdweb";
 import { NFTMediaWithEmptyState } from "tw-components/nft-media";
 import type { ProjectMeta } from "../../../../../team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/types";
 import { buildContractPagePath } from "../_utils/contract-page-path";
@@ -32,6 +32,7 @@ interface NFTCardsProps {
   isPending: boolean;
   allNfts?: boolean;
   projectMeta: ProjectMeta | undefined;
+  client: ThirdwebClient;
 }
 
 export const NFTCards: React.FC<NFTCardsProps> = ({
@@ -40,6 +41,7 @@ export const NFTCards: React.FC<NFTCardsProps> = ({
   isPending,
   allNfts,
   projectMeta,
+  client,
 }) => {
   const dummyData = useMemo(() => {
     return Array.from({
@@ -73,6 +75,7 @@ export const NFTCards: React.FC<NFTCardsProps> = ({
                       requireInteraction
                       width="100%"
                       height="100%"
+                      client={client}
                     />
                   );
                 }}

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_components/NFTCards.tsx

@@ -528,6 +528,7 @@ export const ClaimConditionsForm: React.FC<ClaimConditionsFormProps> = ({
                     form.setValue(`phases.${index}.snapshot`, snapshot)
                   }
                   isDisabled={!canEditForm}
+                  client={contract.client}
                 />
 
                 <ClaimsConditionFormContext.Provider

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_components/claim-conditions/claim-conditions-form/index.tsx

@@ -14,7 +14,7 @@ import { useCsvUpload } from "hooks/useCsvUpload";
 import { CircleAlertIcon, DownloadIcon, UploadIcon } from "lucide-react";
 import { useRef } from "react";
 import type { Column } from "react-table";
-import { ZERO_ADDRESS } from "thirdweb";
+import { type ThirdwebClient, ZERO_ADDRESS } from "thirdweb";
 import { CsvDataTable } from "../csv-data-table";
 
 interface SnapshotAddressInput {
@@ -30,6 +30,7 @@ interface SnapshotUploadProps {
   isDisabled: boolean;
   value?: SnapshotAddressInput[] | undefined;
   onClose: () => void;
+  client: ThirdwebClient;
 }
 
 const csvParser = (items: SnapshotAddressInput[]): SnapshotAddressInput[] => {
@@ -49,6 +50,7 @@ const SnapshotViewerSheetContent: React.FC<SnapshotUploadProps> = ({
   isDisabled,
   value,
   onClose,
+  client,
 }) => {
   const {
     normalizeQuery,
@@ -59,7 +61,11 @@ const SnapshotViewerSheetContent: React.FC<SnapshotUploadProps> = ({
     noCsv,
     reset,
     removeInvalid,
-  } = useCsvUpload<SnapshotAddressInput>({ csvParser, defaultRawData: value });
+  } = useCsvUpload<SnapshotAddressInput>({
+    csvParser,
+    defaultRawData: value,
+    client,
+  });
 
   const paginationPortalRef = useRef<HTMLDivElement>(null);
   const normalizeData = normalizeQuery.data;

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_components/claim-conditions/snapshot-upload.tsx

@@ -6,9 +6,11 @@ import { ConfigureNetworks } from "components/configure-networks/ConfigureNetwor
 import { CheckIcon, CircleAlertIcon, RotateCcwIcon } from "lucide-react";
 import { useState } from "react";
 import { addChainOverrides } from "stores/chainStores";
+import type { ThirdwebClient } from "thirdweb";
 
 export function ConfigureCustomChain(props: {
   chainSlug: string;
+  client: ThirdwebClient;
 }) {
   const { chainSlug } = props;
   const isSlugNumber = Number.isInteger(Number(chainSlug));
@@ -61,6 +63,7 @@ export function ConfigureCustomChain(props: {
             }
           }}
           editChain={undefined}
+          client={props.client}
         />
       </div>
     </div>

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_layout/ConfigureCustomChain.tsx

@@ -43,7 +43,6 @@ export async function getContractMetadataHeaderData(
     fetchDashboardContractMetadata(contract),
     fetchPublishedContractsFromDeploy({
       contract,
-      client: contract.client,
     }),
   ]);