[TOOL-3378] Dashboard: Add Contract to Project UI updates

Author: MananTank

apps/dashboard/src/@/components/ui/UnderlineLink.tsx

@@ -0,0 +1,16 @@
+import Link from "next/link";
+import { cn } from "../../lib/utils";
+
+type LinkProps = React.ComponentProps<typeof Link>;
+
+export function UnderlineLink(props: LinkProps) {
+  return (
+    <Link
+      {...props}
+      className={cn(
+        "underline decoration-muted-foreground/50 decoration-dotted underline-offset-[5px] hover:text-foreground hover:decoration-foreground hover:decoration-solid",
+        props.className,
+      )}
+    />
+  );
+}

apps/dashboard/src/@3rdweb-sdk/react/hooks/useRegistry.ts

@@ -1,8 +1,9 @@
 "use client";
 
 import { useQuery } from "@tanstack/react-query";
-import type { ThirdwebContract } from "thirdweb";
+import type { ThirdwebClient, ThirdwebContract } from "thirdweb";
 import type { ChainMetadata } from "thirdweb/chains";
+import type { MinimalTeamsAndProjects } from "../../../../../../components/contract-components/contract-deploy-form/add-to-project-card";
 import { ErrorPage, LoadingPage } from "../_components/page-skeletons";
 import { useContractPageMetadata } from "../_hooks/useContractPageMetadata";
 import { getContractPageSidebarLinks } from "../_utils/getContractPageSidebarLinks";
@@ -13,6 +14,8 @@ export function ContractPageLayoutClient(props: {
   chainMetadata: ChainMetadata;
   contract: ThirdwebContract;
   children: React.ReactNode;
+  teamsAndProjects: MinimalTeamsAndProjects | undefined;
+  client: ThirdwebClient;
 }) {
   const metadataQuery = useContractPageMetadata(props.contract);
   const headerMetadataQuery = useQuery({

apps/dashboard/src/app/(dashboard)/(chain)/[chain_id]/[contractAddress]/_layout/contract-page-layout.client.tsx

@@ -3,8 +3,9 @@ import type { SidebarLink } from "@/components/blocks/Sidebar";
 import { SidebarLayout } from "@/components/blocks/SidebarLayout";
 import type { DashboardContractMetadata } from "@3rdweb-sdk/react/hooks/useDashboardContractMetadata";
 import { DeprecatedAlert } from "components/shared/DeprecatedAlert";
-import type { ThirdwebContract } from "thirdweb";
+import type { ThirdwebClient, ThirdwebContract } from "thirdweb";
 import type { ChainMetadata } from "thirdweb/chains";
+import type { MinimalTeamsAndProjects } from "../../../../../../components/contract-components/contract-deploy-form/add-to-project-card";
 import { ContractMetadata } from "./contract-metadata";
 import { PrimaryDashboardButton } from "./primary-dashboard-button";
 
@@ -14,6 +15,8 @@ export function ContractPageLayout(props: {
   children: React.ReactNode;
   sidebarLinks: SidebarLink[];
   dashboardContractMetadata: DashboardContractMetadata | undefined;
+  client: ThirdwebClient;
+  teamsAndProjects: MinimalTeamsAndProjects | undefined;
   externalLinks:
     | {
         name: string;
@@ -27,6 +30,8 @@ export function ContractPageLayout(props: {
     sidebarLinks,
     dashboardContractMetadata,
     externalLinks,
+    teamsAndProjects,
+    client,
   } = props;
 
   return (
@@ -49,6 +54,8 @@ export function ContractPageLayout(props: {
                   chainSlug: chainMetadata.slug,
                   contractAddress: contract.address,
                 }}
+                teamsAndProjects={teamsAndProjects}
+                client={client}
               />
             </div>
             <DeprecatedAlert chain={chainMetadata} />