Merge branch 'main' into greg/new-ub-components

Author: gregfromstl

.changeset/red-cooks-juggle.md

@@ -0,0 +1,5 @@
+---
+"thirdweb": patch
+---
+
+Fix `NFTMetadata` type

apps/dashboard/.storybook/main.ts

@@ -13,9 +13,8 @@ const config: StorybookConfig = {
   addons: [
     getAbsolutePath("@storybook/addon-onboarding"),
     getAbsolutePath("@storybook/addon-links"),
-    getAbsolutePath("@storybook/addon-essentials"),
     getAbsolutePath("@chromatic-com/storybook"),
-    getAbsolutePath("@storybook/addon-interactions"),
+    getAbsolutePath("@storybook/addon-docs"),
   ],
   framework: {
     name: getAbsolutePath("@storybook/nextjs"),

apps/dashboard/.storybook/preview.tsx

@@ -1,4 +1,4 @@
-import type { Preview } from "@storybook/react";
+import type { Preview } from "@storybook/nextjs";
 import "../src/global.css";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { MoonIcon, SunIcon } from "lucide-react";

apps/dashboard/knip.json

@@ -10,7 +10,6 @@
   "project": ["src/**"],
   "ignoreBinaries": ["only-allow", "biome"],
   "ignoreDependencies": [
-    "@storybook/blocks",
     "@thirdweb-dev/service-utils",
     "@thirdweb-dev/vault-sdk",
     "@types/color",

apps/dashboard/next.config.ts

@@ -12,7 +12,7 @@ const ContentSecurityPolicy = `
   style-src 'self' 'unsafe-inline' vercel.live;
   font-src 'self' vercel.live assets.vercel.com framerusercontent.com fonts.gstatic.com;
   frame-src * data:;
-  script-src 'self' 'unsafe-eval' 'unsafe-inline' 'wasm-unsafe-eval' 'inline-speculation-rules' *.thirdweb.com *.thirdweb-dev.com vercel.live js.stripe.com framerusercontent.com events.framer.com challenges.cloudflare.com;
+  script-src 'self' 'unsafe-eval' 'unsafe-inline' 'wasm-unsafe-eval' 'inline-speculation-rules' *.thirdweb.com *.thirdweb-dev.com vercel.live js.stripe.com framerusercontent.com events.framer.com challenges.cloudflare.com googletagmanager.com us-assets.i.posthog.com edit.framer.com;
   connect-src * data: blob:;
   worker-src 'self' blob:;
   block-all-mixed-content;

apps/dashboard/package.json

@@ -29,30 +29,30 @@
     "@emotion/styled": "11.14.0",
     "@hookform/resolvers": "^3.9.1",
     "@marsidev/react-turnstile": "^1.1.0",
-    "@radix-ui/react-accordion": "^1.2.7",
-    "@radix-ui/react-alert-dialog": "^1.1.10",
-    "@radix-ui/react-avatar": "^1.1.6",
-    "@radix-ui/react-checkbox": "^1.2.2",
-    "@radix-ui/react-dialog": "1.1.10",
-    "@radix-ui/react-dropdown-menu": "^2.1.11",
-    "@radix-ui/react-hover-card": "^1.1.10",
-    "@radix-ui/react-label": "^2.1.4",
-    "@radix-ui/react-popover": "^1.1.10",
-    "@radix-ui/react-progress": "^1.1.4",
-    "@radix-ui/react-radio-group": "^1.3.3",
+    "@radix-ui/react-accordion": "^1.2.11",
+    "@radix-ui/react-alert-dialog": "^1.1.14",
+    "@radix-ui/react-avatar": "^1.1.10",
+    "@radix-ui/react-checkbox": "^1.3.2",
+    "@radix-ui/react-dialog": "1.1.14",
+    "@radix-ui/react-dropdown-menu": "^2.1.15",
+    "@radix-ui/react-hover-card": "^1.1.14",
+    "@radix-ui/react-label": "^2.1.7",
+    "@radix-ui/react-popover": "^1.1.14",
+    "@radix-ui/react-progress": "^1.1.7",
+    "@radix-ui/react-radio-group": "^1.3.7",
     "@radix-ui/react-select": "^2.2.5",
     "@radix-ui/react-separator": "^1.1.7",
-    "@radix-ui/react-slot": "^1.2.0",
-    "@radix-ui/react-switch": "^1.2.2",
-    "@radix-ui/react-tooltip": "1.2.3",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-switch": "^1.2.5",
+    "@radix-ui/react-tooltip": "1.2.7",
     "@scalar/api-reference-react": "^0.6.19",
-    "@sentry/nextjs": "9.13.0",
-    "@shazow/whatsabi": "0.21.0",
-    "@tanstack/react-query": "5.74.4",
+    "@sentry/nextjs": "9.28.1",
+    "@shazow/whatsabi": "0.22.2",
+    "@tanstack/react-query": "5.80.7",
     "@tanstack/react-table": "^8.21.3",
     "@thirdweb-dev/service-utils": "workspace:*",
     "@thirdweb-dev/vault-sdk": "workspace:*",
-    "@vercel/functions": "2.0.0",
+    "@vercel/functions": "2.1.0",
     "@vercel/og": "^0.6.8",
     "abitype": "1.0.8",
     "chakra-react-select": "^4.7.6",
@@ -61,16 +61,16 @@
     "color": "5.0.0",
     "compare-versions": "^6.1.0",
     "date-fns": "4.1.0",
-    "fast-xml-parser": "^5.2.1",
+    "fast-xml-parser": "^5.2.5",
     "fetch-event-stream": "0.1.5",
     "flat": "^6.0.1",
-    "framer-motion": "12.9.2",
+    "framer-motion": "12.17.0",
     "fuse.js": "7.1.0",
     "input-otp": "^1.4.1",
     "ioredis": "^5.6.1",
     "ipaddr.js": "^2.2.0",
-    "lucide-react": "0.503.0",
-    "next": "15.3.2",
+    "lucide-react": "0.514.0",
+    "next": "15.3.3",
     "next-plausible": "^3.12.4",
     "next-themes": "^0.4.6",
     "nextjs-toploader": "^1.6.12",
@@ -95,55 +95,50 @@
     "responsive-rsc": "0.0.7",
     "server-only": "^0.0.1",
     "shiki": "1.27.0",
-    "sonner": "2.0.3",
+    "sonner": "2.0.5",
     "spdx-correct": "^3.2.0",
     "stripe": "17.7.0",
-    "swagger-ui-react": "^5.21.0",
+    "swagger-ui-react": "^5.24.1",
     "tailwind-merge": "^2.6.0",
     "tailwindcss-animate": "^1.0.7",
     "thirdweb": "workspace:*",
     "tiny-invariant": "^1.3.3",
-    "use-debounce": "^10.0.4",
+    "use-debounce": "^10.0.5",
     "vaul": "^1.1.2",
-    "zod": "3.25.24"
+    "zod": "3.25.62"
   },
   "devDependencies": {
     "@chakra-ui/cli": "^2.4.1",
-    "@chromatic-com/storybook": "3.2.6",
-    "@next/bundle-analyzer": "15.3.2",
-    "@next/eslint-plugin-next": "15.3.2",
-    "@playwright/test": "1.52.0",
-    "@storybook/addon-essentials": "8.6.14",
-    "@storybook/addon-interactions": "8.6.14",
-    "@storybook/addon-links": "8.6.14",
-    "@storybook/addon-onboarding": "8.6.14",
-    "@storybook/addon-viewport": "8.6.14",
-    "@storybook/blocks": "8.6.14",
-    "@storybook/nextjs": "8.6.14",
-    "@storybook/react": "8.6.14",
-    "@storybook/test": "8.6.14",
+    "@chromatic-com/storybook": "4.0.0",
+    "@next/bundle-analyzer": "15.3.3",
+    "@next/eslint-plugin-next": "15.3.3",
+    "@playwright/test": "1.53.0",
+    "@storybook/addon-docs": "9.0.8",
+    "@storybook/addon-links": "9.0.8",
+    "@storybook/addon-onboarding": "9.0.8",
+    "@storybook/nextjs": "9.0.8",
     "@types/color": "4.2.0",
     "@types/node": "22.14.1",
     "@types/papaparse": "^5.3.16",
     "@types/pluralize": "^0.0.33",
     "@types/qrcode": "^1.5.5",
-    "@types/react": "19.1.4",
-    "@types/react-dom": "19.1.5",
+    "@types/react": "19.1.8",
+    "@types/react-dom": "19.1.6",
     "@types/react-table": "^7.7.20",
     "@types/spdx-correct": "^3.1.3",
     "@types/swagger-ui-react": "^5.18.0",
     "@typescript-eslint/eslint-plugin": "7.14.1",
     "@typescript-eslint/parser": "7.14.1",
     "autoprefixer": "^10.4.21",
-    "checkly": "5.2.0",
+    "checkly": "5.6.0",
     "eslint": "8.57.0",
     "eslint-config-biome": "1.9.4",
-    "eslint-plugin-react-compiler": "19.0.0-beta-e993439-20250405",
-    "eslint-plugin-storybook": "0.12.0",
-    "knip": "5.56.0",
+    "eslint-plugin-react-compiler": "19.1.0-rc.2",
+    "eslint-plugin-storybook": "9.0.8",
+    "knip": "5.60.2",
     "next-sitemap": "^4.2.3",
-    "postcss": "8.5.3",
-    "storybook": "8.6.14",
+    "postcss": "8.5.5",
+    "storybook": "9.0.8",
     "tailwindcss": "3.4.17",
     "typescript": "5.8.3"
   }

apps/dashboard/src/@/actions/createTeam.ts

@@ -1,7 +1,8 @@
 "use server";
 import "server-only";
 
-import { randomBytes } from "node:crypto";
+// biome-ignore lint/style/useNodejsImportProtocol: breaks storybook if it's `node:` prefixed
+import { randomBytes } from "crypto";
 import type { Team } from "@/api/team";
 import { format } from "date-fns";
 import { getAuthToken } from "../../app/(app)/api/lib/getAuthToken";

apps/dashboard/src/@/api/team-members.ts

@@ -33,7 +33,7 @@ export async function getMembers(teamSlug: string) {
   }
 
   const teamsRes = await fetch(
-    `${NEXT_PUBLIC_THIRDWEB_API_HOST}/v1/teams/${teamSlug}/members`,
+    new URL(`/v1/teams/${teamSlug}/members`, NEXT_PUBLIC_THIRDWEB_API_HOST),
     {
       headers: {
         Authorization: `Bearer ${token}`,
@@ -48,15 +48,21 @@ export async function getMembers(teamSlug: string) {
   return undefined;
 }
 
-export async function getMemberById(teamSlug: string, memberId: string) {
+export async function getMemberByAccountId(
+  teamSlug: string,
+  accountId: string,
+) {
   const token = await getAuthToken();
 
   if (!token) {
     return undefined;
   }
 
   const res = await fetch(
-    `${NEXT_PUBLIC_THIRDWEB_API_HOST}/v1/teams/${teamSlug}/members/${memberId}`,
+    new URL(
+      `/v1/teams/${teamSlug}/members/${accountId}`,
+      NEXT_PUBLIC_THIRDWEB_API_HOST,
+    ),
     {
       headers: {
         Authorization: `Bearer ${token}`,

apps/dashboard/src/@/api/team.ts

@@ -3,8 +3,10 @@ import { NEXT_PUBLIC_THIRDWEB_API_HOST } from "@/constants/public-envs";
 import { API_SERVER_SECRET } from "@/constants/server-envs";
 import type { TeamResponse } from "@thirdweb-dev/service-utils";
 import { cookies } from "next/headers";
+import { getValidAccount } from "../../app/(app)/account/settings/getAccount";
 import { getAuthToken } from "../../app/(app)/api/lib/getAuthToken";
 import { LAST_USED_TEAM_ID } from "../../constants/cookies";
+import { getMemberByAccountId } from "./team-members";
 
 export type Team = TeamResponse & { stripeCustomerId: string | null };
 
@@ -103,3 +105,23 @@ export async function getLastVisitedTeam() {
 
   return null;
 }
+
+export async function hasToCompleteTeamOnboarding(
+  team: Team,
+  pagePath: string,
+) {
+  // if the team is already onboarded, we don't need to check anything else here
+  if (team.isOnboarded) {
+    return false;
+  }
+  const account = await getValidAccount(pagePath);
+  const teamMember = await getMemberByAccountId(team.slug, account.id);
+
+  // if the team member is not an owner (or we cannot find them), they cannot complete onboarding anyways
+  if (teamMember?.role !== "OWNER") {
+    return false;
+  }
+
+  // if we get here the team is not onboarded and the team member is an owner, so we need to show the onboarding page
+  return true;
+}

apps/dashboard/src/@/components/Responsive.tsx

@@ -0,0 +1,25 @@
+"use client";
+import { Suspense } from "react";
+import { ClientOnly } from "../../components/ClientOnly/ClientOnly";
+import { useIsMobile } from "../hooks/use-mobile";
+
+export function ResponsiveLayout(props: {
+  desktop: React.ReactNode;
+  mobile: React.ReactNode;
+  fallback: React.ReactNode;
+  debugMode?: boolean;
+}) {
+  const isMobile = useIsMobile();
+
+  if (props.debugMode) {
+    return props.fallback;
+  }
+
+  return (
+    <Suspense fallback={props.fallback}>
+      <ClientOnly ssr={props.fallback}>
+        {isMobile ? props.mobile : props.desktop}
+      </ClientOnly>
+    </Suspense>
+  );
+}