Merge remote-tracking branch 'Dashboard/main' into Joe-ChainPageUpdates

Author: Joe-Thirdweb

.changeset/curly-cycles-hammer.md

@@ -0,0 +1,14 @@
+name: Auto Author Assign
+
+on:
+  pull_request:
+    types: [ opened, reopened ]
+
+permissions:
+  pull-requests: write
+
+jobs:
+  assign-author:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: toshimaru/auto-author-assign@v2.1.1

.changeset/dirty-goats-invent.md

@@ -25,8 +25,8 @@
     "@chakra-ui/react": "^2.8.2",
     "@chakra-ui/styled-system": "^2.9.2",
     "@chakra-ui/theme-tools": "^2.1.2",
-    "@emotion/react": "11.13.5",
-    "@emotion/styled": "11.13.5",
+    "@emotion/react": "11.14.0",
+    "@emotion/styled": "11.14.0",
     "@hookform/resolvers": "^3.9.1",
     "@marsidev/react-turnstile": "^1.1.0",
     "@n8tb1t/use-scroll-position": "^2.0.3",
@@ -61,7 +61,7 @@
     "compare-versions": "^6.1.0",
     "date-fns": "4.1.0",
     "flat": "^6.0.1",
-    "framer-motion": "11.13.1",
+    "framer-motion": "11.13.3",
     "fuse.js": "7.0.0",
     "input-otp": "^1.4.1",
     "ioredis": "^5.4.1",
@@ -88,8 +88,8 @@
     "recharts": "^2.13.3",
     "remark-gfm": "^4.0.0",
     "server-only": "^0.0.1",
-    "shiki": "1.24.0",
-    "sonner": "^1.7.0",
+    "shiki": "1.24.1",
+    "sonner": "^1.7.1",
     "spdx-correct": "^3.2.0",
     "swagger-ui-react": "^5.18.2",
     "tailwind-merge": "^2.5.5",
@@ -104,7 +104,7 @@
     "@chromatic-com/storybook": "3.2.2",
     "@next/bundle-analyzer": "15.0.4",
     "@next/eslint-plugin-next": "15.0.4",
-    "@playwright/test": "1.49.0",
+    "@playwright/test": "1.49.1",
     "@storybook/addon-essentials": "8.4.7",
     "@storybook/addon-interactions": "8.4.7",
     "@storybook/addon-links": "8.4.7",
@@ -120,7 +120,7 @@
     "@types/pluralize": "^0.0.33",
     "@types/qrcode": "^1.5.5",
     "@types/react": "19.0.1",
-    "@types/react-dom": "19.0.1",
+    "@types/react-dom": "19.0.2",
     "@types/react-table": "^7.7.20",
     "@types/spdx-correct": "^3.1.3",
     "@types/swagger-ui-react": "^4.18.3",

.changeset/fair-plants-pretend.md

@@ -17,14 +17,14 @@ export function DeployedContractsPageHeader() {
           setImportModalOpen(false);
         }}
       />
-      <div className="flex flex-col gap-4 md:pb-4 lg:flex-row lg:justify-between">
+      <div className="flex flex-col gap-4 lg:flex-row lg:justify-between">
         <div>
-          <h1 className="mb-1.5 font-semibold text-3xl tracking-tight lg:text-4xl">
-            Your contracts
+          <h1 className="mb-1 font-semibold text-2xl tracking-tight lg:text-3xl">
+            Deployed contracts
           </h1>
           <p className="text-muted-foreground text-sm">
-            The list of contract instances that you have deployed or imported
-            with thirdweb across all networks
+            The list of contracts that you have deployed or imported with
+            thirdweb across all networks
           </p>
         </div>
         <div className="flex gap-2 [&>*]:grow">

.changeset/serious-bananas-boil.md

@@ -8,12 +8,11 @@ import { getSortedDeployedContracts } from "./getSortedDeployedContracts";
 
 export function DeployedContractsPage(props: {
   address: string;
-  className?: string;
 }) {
   return (
-    <div className={props.className}>
+    <div className="flex grow flex-col">
       <DeployedContractsPageHeader />
-      <div className="h-6" />
+      <div className="h-8" />
       <Suspense fallback={<Loading />}>
         <DeployedContractsPageAsync {...props} />
       </Suspense>

.changeset/strong-meals-remain.md

@@ -1,5 +1,26 @@
+import { SidebarLayout } from "@/components/blocks/SidebarLayout";
+
 export default function Layout(props: {
   children: React.ReactNode;
 }) {
-  return <div className="container flex grow flex-col">{props.children}</div>;
+  const layoutPath = "/account/contracts";
+
+  return (
+    <SidebarLayout
+      sidebarLinks={[
+        {
+          href: layoutPath,
+          label: "Deployed contracts",
+          exactMatch: true,
+        },
+        {
+          href: `${layoutPath}/published`,
+          label: "Published contracts",
+          exactMatch: true,
+        },
+      ]}
+    >
+      {props.children}
+    </SidebarLayout>
+  );
 }

.github/workflows/auto-assign.yml

@@ -9,10 +9,5 @@ export default async function Page() {
     return redirect(`/login?next=${encodeURIComponent("/account/contracts")}`);
   }
 
-  return (
-    <DeployedContractsPage
-      address={accountAddress}
-      className="flex grow flex-col pt-10 pb-10"
-    />
-  );
+  return <DeployedContractsPage address={accountAddress} />;
 }

apps/dashboard/package.json

@@ -0,0 +1,81 @@
+import { GenericLoadingPage } from "@/components/blocks/skeletons/GenericLoadingPage";
+import { Button } from "@/components/ui/button";
+import { PlusIcon } from "lucide-react";
+import Link from "next/link";
+import { Suspense } from "react";
+import { PublishedContracts } from "../../../(dashboard)/profile/[addressOrEns]/components/published-contracts";
+import { resolveAddressAndEns } from "../../../(dashboard)/profile/[addressOrEns]/resolveAddressAndEns";
+import { fetchPublishedContracts } from "../../../../components/contract-components/fetchPublishedContracts";
+
+export async function PublishedContractsPage(props: {
+  publisherAddress: string;
+}) {
+  const resolvedInfo = await resolveAddressAndEns(props.publisherAddress);
+
+  return (
+    <div className="flex grow flex-col">
+      <div className="flex flex-col justify-between gap-4 md:flex-row md:items-start">
+        <div>
+          <h2 className="mb-1 font-semibold text-2xl tracking-tight lg:text-3xl">
+            Published contracts
+          </h2>
+
+          <p className="text-muted-foreground text-sm">
+            The list of contracts published to thirdweb across all networks.{" "}
+            <Link
+              href="https://portal.thirdweb.com/contracts/publish/overview"
+              className="text-link-foreground hover:text-foreground"
+              target="_blank"
+            >
+              Learn more about publishing contracts
+            </Link>
+          </p>
+        </div>
+
+        <Button asChild>
+          <Link
+            href="https://portal.thirdweb.com/contracts/publish/publish-contract"
+            target="_blank"
+            className="gap-2"
+          >
+            <PlusIcon className="size-4" />
+            Publish Contract
+          </Link>
+        </Button>
+      </div>
+
+      <div className="h-8" />
+
+      <Suspense fallback={<GenericLoadingPage />}>
+        <AsyncPublishedContractsTable
+          publisherAddress={props.publisherAddress}
+          publisherEnsName={resolvedInfo?.ensName}
+        />
+      </Suspense>
+    </div>
+  );
+}
+
+async function AsyncPublishedContractsTable(props: {
+  publisherAddress: string;
+  publisherEnsName: string | undefined;
+}) {
+  const publishedContracts = await fetchPublishedContracts(
+    props.publisherAddress,
+  );
+
+  if (publishedContracts.length === 0) {
+    return (
+      <div className="flex min-h-[300px] grow items-center justify-center rounded-lg border border-border">
+        No published contracts found
+      </div>
+    );
+  }
+
+  return (
+    <PublishedContracts
+      publishedContracts={publishedContracts}
+      publisherEnsName={props.publisherEnsName}
+    />
+  );
+}

apps/dashboard/src/app/account/contracts/DeployedContractsPageHeader.tsx

@@ -0,0 +1,13 @@
+import { getAuthTokenWalletAddress } from "../../../api/lib/getAuthToken";
+import { loginRedirect } from "../../../login/loginRedirect";
+import { PublishedContractsPage } from "./PublishedContractsPage";
+
+export default async function Page() {
+  const accountAddress = await getAuthTokenWalletAddress();
+
+  if (!accountAddress) {
+    loginRedirect("/account/contracts");
+  }
+
+  return <PublishedContractsPage publisherAddress={accountAddress} />;
+}

apps/dashboard/src/app/account/contracts/_components/DeployedContractsPage.tsx

@@ -51,7 +51,6 @@ async function HeaderAndNav(props: {
           {
             path: "/account/contracts",
             name: "Contracts",
-            exactMatch: true,
           },
           {
             path: "/account/settings",

apps/dashboard/src/app/account/contracts/layout.tsx

@@ -0,0 +1,28 @@
+import { SidebarLayout } from "@/components/blocks/SidebarLayout";
+
+export default async function Layout(props: {
+  children: React.ReactNode;
+  params: Promise<{ team_slug: string }>;
+}) {
+  const params = await props.params;
+  const layoutPath = `/team/${params.team_slug}/~/contracts`;
+
+  return (
+    <SidebarLayout
+      sidebarLinks={[
+        {
+          href: layoutPath,
+          label: "Deployed contracts",
+          exactMatch: true,
+        },
+        {
+          href: `${layoutPath}/published`,
+          label: "Published contracts",
+          exactMatch: true,
+        },
+      ]}
+    >
+      {props.children}
+    </SidebarLayout>
+  );
+}

apps/dashboard/src/app/account/contracts/page.tsx

@@ -14,12 +14,5 @@ export default async function Page(props: {
     );
   }
 
-  return (
-    <div className="container flex grow flex-col">
-      <DeployedContractsPage
-        address={accountAddress}
-        className="flex grow flex-col pt-10 pb-10"
-      />
-    </div>
-  );
+  return <DeployedContractsPage address={accountAddress} />;
 }