-
Notifications
You must be signed in to change notification settings - Fork 559
Dashboard: Update team layout #7464
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Dashboard: Update team layout #7464
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
## Walkthrough
This update refactors and restructures sidebar and layout components, introducing new sidebar abstractions and simplifying or removing previous sidebar logic. Several components and layouts are restyled with updated container widths and spacing. New sidebar-related components are added, and dependencies are updated to include Radix UI's collapsible primitives. Numerous billing-related URLs are updated to remove the `/settings` segment. Several settings and credits-related components and pages are removed. A new `StaffModeNotice` component is introduced and used in place of inline staff mode banners. Ecosystem navigation switches from sidebar to tab-based navigation with removal of ecosystem selection dropdown. Redirects for legacy team settings URLs to billing URLs are added.
## Changes
| File(s) | Change Summary |
|-----------------------------------------------------------------------------------------------------------|---------------|
| `apps/dashboard/package.json` | Added `@radix-ui/react-collapsible` dependency. |
| `apps/dashboard/src/@/components/analytics/date-range-selector.tsx` | Added optional `className` prop; uses `cn` utility for class merging. |
| `apps/dashboard/src/@/components/analytics/range-selector.tsx` | Updated layout and styling classes for responsive flex layout and rounded elements. |
| `apps/dashboard/src/@/components/blocks/MobileSidebar.tsx` | Changed `useActiveSidebarLink` from exported to internal function. |
| `apps/dashboard/src/@/components/blocks/SidebarLayout.tsx` | Replaced detailed sidebar logic with a simplified layout using `CustomSidebar` and `MobileSidebar`. Removed helper components and the `FullWidthSidebarLayout` export. |
| `apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx` | Added new comprehensive sidebar layout component with collapsible submenus and active state logic. |
| `apps/dashboard/src/@/components/ui/collapsible.tsx` | New file: Re-exports Radix UI collapsible primitives as local components. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx` | New file: Implements a team dashboard sidebar layout using `FullWidthSidebarLayout` with structured navigation links. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/layout.tsx` | Refactored to use `SidebarProvider` and `TeamSidebarLayout`; restyled "Staff Mode" banner; removed tab navigation and footer. Added ecosystem data fetching. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/analytics/page.tsx` | Added `md:max-w-7xl` class to container for max width constraint. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/layout.tsx` | Added `max-w-5xl` to containers; wrapped children in new flex column div. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/page.tsx` | Removed `container` class from outer div. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx` | Switched from sidebar to tab-based navigation; updated link structure and container classes. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/ecosystem-header.client.tsx` | Changed padding and added max width to container; removed ecosystem select dropdown. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/SettingsLayout.tsx` | Removed entire settings layout component and related mobile nav/sidebar logic. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/sidebar/TeamsMobileNav.tsx` | Added `text-sm` class for smaller text size in mobile nav. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/layout.tsx` | Removed sidebar, updated container and button styling. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/rpc/page.tsx` | Reduced header gap and font size/weight; reorganized summary cards with added status dot and percentages. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx` | Updated heading and added description for files section. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx` | Changed import path for `FullWidthSidebarLayout`. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/layout.tsx` | Replaced custom staff mode banner with `StaffModeNotice` component; updated imports. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/abiUtils.ts` | Added lint ignore comments for explicit `any` usage. |
| `apps/dashboard/src/app/(app)/team/components/Analytics/AnalyticsHeader.tsx` | Added `max-w-7xl` class to container; wrapped `RangeSelector` in responsive div. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/_components/StaffModeNotice.tsx` | New file: Added `StaffModeNotice` component displaying a styled staff mode banner with leave button. |
| `apps/dashboard/redirects.js` | Added `teamPageRedirects` array to redirect legacy team settings billing URLs to new billing URLs; appended to redirects list. |
| Multiple billing-related components and files (`billing.tsx`, `CancelPlanModal.tsx`, `TeamPlanBadge.tsx`, `UpsellWrapper.tsx`, `BillingAlertBannersUI.tsx`, `FreePlanUpsellBannerUI.tsx`, `PlanInfoCard.tsx`) | Updated billing-related URLs to remove `/settings` segment. |
| Deleted settings credits-related components and pages (`SettingsCreditsPage.tsx`, `ApplyForOpCreditsForm.tsx`, `ApplyForOpCreditsModal.tsx`, `PlanCard.tsx`, `applyOpSponsorship.ts`, `SettingsCreditsPage.tsx`) | Removed gas credits settings and application components. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/layout.tsx` | New billing layout component added with authentication and team validation, rendering billing tabs and children. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/page.tsx` | Updated billing page path to remove `/settings` segment; minor styling adjustment. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/layout.tsx` | Refactored settings layout to remove client and account fetching; simplified to render tabs and children. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/members/InviteSection.tsx` | Updated upgrade link URL to remove `/settings` segment. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/account-abstraction/Alerts.tsx` | Updated billing link URL to remove `/settings` segment. |
| `apps/dashboard/src/app/(app)/team/components/TeamHeader/TeamAndProjectSelectorPopoverButton.tsx` | Updated upgrade billing link URL to remove `/settings` segment. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/create/EcosystemCreatePage.tsx` | Added header section with title and description with external link; restyled layout container. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/create/components/client/create-ecosystem-form.client.tsx` | Removed static header section from form UI; replaced ecosystem permissions link with `UnderlineLink`. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/create/loading.tsx` | Changed default export to wrapper component adding `border-none` class. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/hooks/use-ecosystem-list.ts` | Deleted hook for fetching ecosystem list. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/page.tsx` | Removed ecosystem landing page component; replaced with immediate redirect to ecosystem creation page. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/layout.tsx` | Changed import of `getAuthToken` to absolute path. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/page.tsx` | Consolidated imports; wrapped `RangeSelector` in responsive div. |
| `apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/wallets/analytics/chart/index.tsx` | Updated import path for `InAppWalletStats` type to absolute alias. |
| `apps/dashboard/src/@/components/blocks/pagination-buttons.tsx` | Added responsive minimum width style to pagination buttons. |
| `apps/dashboard/src/@/components/ui/pagination.tsx` | Updated `PaginationLink` to always have visible border when inactive. |
| `apps/dashboard/src/@/hooks/useApi.ts` | Removed exported constant `accountPlan`. |
## Sequence Diagram(s)
```mermaid
sequenceDiagram
participant User
participant TeamSidebarLayout
participant FullWidthSidebarLayout
participant SidebarProvider
User->>SidebarProvider: Render Team Page Layout
SidebarProvider->>TeamSidebarLayout: Render with layoutPath, children
TeamSidebarLayout->>FullWidthSidebarLayout: Pass structured sidebar links and children
FullWidthSidebarLayout->>User: Render sidebar navigation and page content Possibly related PRs
Suggested reviewers
|
How to use the Graphite Merge QueueAdd either label to this PR to merge it via the merge queue:
You must have a Graphite account in order to use the merge queue. Sign up using this link. An organization admin has enabled the Graphite Merge Queue in this repository. Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue. This stack of pull requests is managed by Graphite. Learn more about stacking. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (3)
apps/dashboard/src/@/components/ui/collapsible.tsx (1)
1-12
: Add a Storybook entry for the new UI primitivePer our guidelines, every new reusable UI component under
@/components/ui/*
should have an accompanying*.stories.tsx
for quick visual regression testing and documentation. Consider adding a minimal story that showcases a basic open/close interaction.apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/abiUtils.ts (1)
32-32
: LGTM! Consider tracking the FIXME comments.The lint suppressions appropriately acknowledge the use of
any
types. Since input validation occurs upstream viaisAbiInput
(per retrieved learnings), this technical debt is acceptable.Would you like me to create tracking issues for the FIXME comments to ensure they're addressed in future iterations?
Also applies to: 97-97, 180-180
apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx (1)
1-1
: Consider renaming file to follow coding guidelines.According to the coding guidelines, interactive component files should be named in PascalCase with a
.client.tsx
suffix. Consider renaming this file toFullWidthSidebarLayout.client.tsx
.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yaml
is excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (23)
apps/dashboard/package.json
(1 hunks)apps/dashboard/src/@/components/analytics/date-range-selector.tsx
(2 hunks)apps/dashboard/src/@/components/analytics/range-selector.tsx
(2 hunks)apps/dashboard/src/@/components/blocks/MobileSidebar.tsx
(1 hunks)apps/dashboard/src/@/components/blocks/SidebarLayout.tsx
(1 hunks)apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx
(1 hunks)apps/dashboard/src/@/components/ui/collapsible.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/layout.tsx
(2 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/analytics/page.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/layout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/page.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx
(2 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/ecosystem-header.client.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/SettingsLayout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/sidebar/TeamsMobileNav.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/layout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/rpc/page.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/layout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/abiUtils.ts
(3 hunks)apps/dashboard/src/app/(app)/team/components/Analytics/AnalyticsHeader.tsx
(1 hunks)
🧰 Additional context used
📓 Path-based instructions (5)
`**/*.@(ts|tsx)`: Accept a typed 'props' object and export a named function (e.g...
**/*.@(ts|tsx)
: Accept a typed 'props' object and export a named function (e.g., export function MyComponent()).
Combine class names via 'cn', expose 'className' prop if useful.
Reuse core UI primitives; avoid re-implementing buttons, cards, modals.
Local state or effects live inside; data fetching happens in hooks.
Merge class names with 'cn' from '@/lib/utils' to keep conditional logic readable.
Stick to design-tokens: background ('bg-card'), borders ('border-border'), muted text ('text-muted-foreground') etc.
Use the 'container' class with a 'max-w-7xl' cap for page width consistency.
Spacing utilities ('px-', 'py-', 'gap-*') are preferred over custom margins.
Responsive helpers follow mobile-first ('max-sm', 'md', 'lg', 'xl').
Never hard-code colors – always go through Tailwind variables.
Tailwind CSS is the styling system – avoid inline styles or CSS modules.
Prefix files with 'import "server-only";' so they never end up in the client bundle (for server-only code).
📄 Source: CodeRabbit Inference Engine (.cursor/rules/dashboard.mdc)
List of files the instruction was applied to:
apps/dashboard/src/app/(app)/team/components/Analytics/AnalyticsHeader.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/layout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/layout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/page.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/abiUtils.ts
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/rpc/page.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/sidebar/TeamsMobileNav.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/ecosystem-header.client.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/analytics/page.tsx
apps/dashboard/src/@/components/ui/collapsible.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx
apps/dashboard/src/@/components/analytics/date-range-selector.tsx
apps/dashboard/src/@/components/analytics/range-selector.tsx
apps/dashboard/src/@/components/blocks/MobileSidebar.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/layout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/SettingsLayout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/layout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx
apps/dashboard/src/@/components/blocks/SidebarLayout.tsx
apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx
`**/components/*`: Add 'className' to the root element of every component for external overrides. Place the file close to its feature: 'feature/components/MyComponent.tsx'.
**/components/*
: Add 'className' to the root element of every component for external overrides.
Place the file close to its feature: 'feature/components/MyComponent.tsx'.
📄 Source: CodeRabbit Inference Engine (.cursor/rules/dashboard.mdc)
List of files the instruction was applied to:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/ecosystem-header.client.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx
`**/components/@([A-Z][A-Za-z0-9]*)@(\.tsx|\.client\.tsx)`: Name files after the component in PascalCase; append '.client.tsx' when interactive.
**/components/@([A-Z][A-Za-z0-9]*)@(\.tsx|\.client\.tsx)
: Name files after the component in PascalCase; append '.client.tsx' when interactive.
📄 Source: CodeRabbit Inference Engine (.cursor/rules/dashboard.mdc)
List of files the instruction was applied to:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx
`apps/dashboard/*`: The dashboard app is a web-based developer console built wit...
apps/dashboard/*
: The dashboard app is a web-based developer console built with Next.js and Chakra UI.
Use Tailwind CSS only for styling; no inline styles or CSS modules.
Use cn() from @/lib/utils for conditional class merging.
Use design system tokens for backgrounds (bg-card), borders (border-border), and muted text (text-muted-foreground).
Expose className prop on the root element of components for overrides.
Use NavLink for internal navigation with automatic active states.
Server components should start files with import "server-only"; client components should begin files with 'use client';.
Never import posthog-js in server components; analytics events are client-side only.
📄 Source: CodeRabbit Inference Engine (CLAUDE.md)
List of files the instruction was applied to:
apps/dashboard/package.json
`**/components/*.client.tsx`: Client components must start with 'use client'; before imports.
**/components/*.client.tsx
: Client components must start with 'use client'; before imports.
📄 Source: CodeRabbit Inference Engine (.cursor/rules/dashboard.mdc)
List of files the instruction was applied to:
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/ecosystem-header.client.tsx
🧠 Learnings (24)
📓 Common learnings
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Keep documentation focused on developer experience and practical usage, and surface breaking changes prominently in PR descriptions.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
Learnt from: MananTank
PR: thirdweb-dev/js#7177
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/settings/shared-settings-page.tsx:29-39
Timestamp: 2025-05-27T20:10:47.245Z
Learning: MananTank prefers adding error handling (try-catch) directly inside utility functions like `shouldRenderNewPublicPage` rather than requiring callers to wrap the function calls in try-catch blocks. This centralizes error handling and benefits all callers automatically.
apps/dashboard/src/app/(app)/team/components/Analytics/AnalyticsHeader.tsx (2)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Analytics events should be added intentionally, with human-readable names, and reported via helpers in 'src/@/analytics/report.ts'.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx (8)
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7434
File: apps/dashboard/src/app/(app)/team/~/~/contract/[chain]/[contractAddress]/components/project-selector.tsx:62-76
Timestamp: 2025-06-24T21:38:03.155Z
Learning: In the project-selector.tsx component for contract imports, the addToProject.mutate() call is intentionally not awaited (fire-and-forget pattern) to allow immediate navigation to the contract page while the import happens in the background. This is a deliberate design choice to prioritize user experience.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: UI primitives should be imported from @/components/ui/*.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Always import reusable UI components from a central library (e.g., '@/components/ui/*') to ensure consistency and avoid duplication.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
apps/dashboard/package.json (2)
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: UI primitives should be imported from @/components/ui/*.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/layout.tsx (10)
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: MananTank
PR: thirdweb-dev/js#7434
File: apps/dashboard/src/app/(app)/team/~/~/contract/[chain]/[contractAddress]/components/project-selector.tsx:62-76
Timestamp: 2025-06-24T21:38:03.155Z
Learning: In the project-selector.tsx component for contract imports, the addToProject.mutate() call is intentionally not awaited (fire-and-forget pattern) to allow immediate navigation to the contract page while the import happens in the background. This is a deliberate design choice to prioritize user experience.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Always import reusable UI components from a central library (e.g., '@/components/ui/*') to ensure consistency and avoid duplication.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: UI primitives should be imported from @/components/ui/*.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Client components should begin files with 'use client' and use React hooks for interactivity.
Learnt from: MananTank
PR: thirdweb-dev/js#7356
File: apps/nebula/src/app/not-found.tsx:1-1
Timestamp: 2025-06-17T18:30:52.976Z
Learning: In the thirdweb/js project, the React namespace is available for type annotations (like React.FC) without needing to explicitly import React. This is project-specific configuration that differs from typical TypeScript/React setups.
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/layout.tsx (2)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/page.tsx (1)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/abiUtils.ts (5)
Learnt from: AmineAfia
PR: thirdweb-dev/js#7415
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/abiUtils.ts:31-42
Timestamp: 2025-06-23T13:33:05.770Z
Learning: In the thirdweb webhooks ABI utilities, validation of ABI inputs is performed upstream using the `isAbiInput` function before calling `getCanonicalType`. The `getCanonicalType` function only receives pre-validated inputs, so additional runtime validation within the function would be redundant.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Comment only ambiguous logic; avoid restating TypeScript in prose.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Write idiomatic TypeScript with explicit function declarations and return types.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/rpc/page.tsx (1)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/sidebar/TeamsMobileNav.tsx (2)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/ecosystem-header.client.tsx (1)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/analytics/page.tsx (4)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Analytics events should be added intentionally, with human-readable names, and reported via helpers in 'src/@/analytics/report.ts'.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
apps/dashboard/src/@/components/ui/collapsible.tsx (12)
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: UI primitives should be imported from @/components/ui/*.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Always import reusable UI components from a central library (e.g., '@/components/ui/*') to ensure consistency and avoid duplication.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: For new UI components, add Storybook stories (*.stories.tsx) alongside the code.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Group feature-specific components under feature/components/* with a barrel index.ts.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Files for components should be named in PascalCase and use the '.client.tsx' suffix if interactive.
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Client components should begin files with 'use client' and use React hooks for interactivity.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Reuse core UI primitives and avoid re-implementing common elements like buttons, cards, or modals.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Use client components for interactive UI, components that rely on hooks, browser APIs, or require fast transitions.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx (1)
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Files for components should be named in PascalCase and use the '.client.tsx' suffix if interactive.
apps/dashboard/src/@/components/analytics/date-range-selector.tsx (8)
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Add a 'className' prop to the root element of every component to allow for external style overrides.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Analytics events should be added intentionally, with human-readable names, and reported via helpers in 'src/@/analytics/report.ts'.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Merge class names using the 'cn' utility from '@/lib/utils' to keep conditional logic readable.
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Files for components should be named in PascalCase and use the '.client.tsx' suffix if interactive.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Use cn() from @/lib/utils for conditional class merging.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Expose className prop on the root element of components for overrides.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: UI primitives should be imported from @/components/ui/*.
apps/dashboard/src/@/components/analytics/range-selector.tsx (2)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Analytics events should be added intentionally, with human-readable names, and reported via helpers in 'src/@/analytics/report.ts'.
apps/dashboard/src/@/components/blocks/MobileSidebar.tsx (3)
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Use NavLink for internal navigation to automatically handle active states.
Learnt from: jnsdls
PR: thirdweb-dev/js#7365
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectFTUX/ProjectFTUX.tsx:16-17
Timestamp: 2025-06-18T04:27:16.172Z
Learning: Next.js Link component supports external URLs without throwing errors. When used with absolute URLs (like https://...), it behaves like a regular anchor tag without client-side routing, but does not cause runtime crashes or errors as previously believed.
Learnt from: jnsdls
PR: thirdweb-dev/js#7365
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectFTUX/ProjectFTUX.tsx:16-17
Timestamp: 2025-06-18T04:30:04.326Z
Learning: Next.js Link component fully supports both internal and external URLs and works appropriately with all standard anchor attributes including target="_blank", rel="noopener noreferrer", etc. Using Link for external URLs is completely appropriate and recommended.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/layout.tsx (10)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: jnsdls
PR: thirdweb-dev/js#7364
File: apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx:36-41
Timestamp: 2025-06-18T02:13:34.500Z
Learning: In the logout flow in apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx, when `doLogout()` fails, the cleanup steps (resetAnalytics(), wallet disconnect, router refresh) should NOT execute. This is intentional to maintain consistency - if server-side logout fails, client-side cleanup should not occur.
Learnt from: jnsdls
PR: thirdweb-dev/js#7365
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectFTUX/ProjectFTUX.tsx:16-17
Timestamp: 2025-06-18T04:27:16.172Z
Learning: Next.js Link component supports external URLs without throwing errors. When used with absolute URLs (like https://...), it behaves like a regular anchor tag without client-side routing, but does not cause runtime crashes or errors as previously believed.
Learnt from: jnsdls
PR: thirdweb-dev/js#7365
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectFTUX/ProjectFTUX.tsx:16-17
Timestamp: 2025-06-18T04:30:04.326Z
Learning: Next.js Link component fully supports both internal and external URLs and works appropriately with all standard anchor attributes including target="_blank", rel="noopener noreferrer", etc. Using Link for external URLs is completely appropriate and recommended.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Use NavLink for internal navigation to automatically handle active states.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/SettingsLayout.tsx (7)
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: jnsdls
PR: thirdweb-dev/js#7364
File: apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx:36-41
Timestamp: 2025-06-18T02:13:34.500Z
Learning: In the logout flow in apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx, when `doLogout()` fails, the cleanup steps (resetAnalytics(), wallet disconnect, router refresh) should NOT execute. This is intentional to maintain consistency - if server-side logout fails, client-side cleanup should not occur.
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Client components should begin files with 'use client' and use React hooks for interactivity.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/layout.tsx (14)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/nfts/page.tsx:20-20
Timestamp: 2025-05-26T16:26:58.068Z
Learning: In team/project contract pages under routes like `/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/*`, users are always logged in by design. The hardcoded `isLoggedIn={true}` prop in these pages is intentional and correct, not a bug to be fixed.
Learnt from: jnsdls
PR: thirdweb-dev/js#7364
File: apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx:36-41
Timestamp: 2025-06-18T02:13:34.500Z
Learning: In the logout flow in apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx, when `doLogout()` fails, the cleanup steps (resetAnalytics(), wallet disconnect, router refresh) should NOT execute. This is intentional to maintain consistency - if server-side logout fails, client-side cleanup should not occur.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Client components should begin files with 'use client' and use React hooks for interactivity.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
Learnt from: jnsdls
PR: thirdweb-dev/js#7365
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectFTUX/ProjectFTUX.tsx:16-17
Timestamp: 2025-06-18T04:27:16.172Z
Learning: Next.js Link component supports external URLs without throwing errors. When used with absolute URLs (like https://...), it behaves like a regular anchor tag without client-side routing, but does not cause runtime crashes or errors as previously believed.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Use NavLink for internal navigation to automatically handle active states.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Always import reusable UI components from a central library (e.g., '@/components/ui/*') to ensure consistency and avoid duplication.
Learnt from: MananTank
PR: thirdweb-dev/js#7285
File: apps/dashboard/src/app/(app)/(dashboard)/published-contract/components/uri-based-deploy.tsx:57-57
Timestamp: 2025-06-05T13:59:49.886Z
Learning: In the thirdweb dashboard Next.js app, when using loginRedirect() in server components, ensure to add a return statement after the redirect call to prevent further code execution and potential security issues.
Learnt from: jnsdls
PR: thirdweb-dev/js#7365
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectFTUX/ProjectFTUX.tsx:16-17
Timestamp: 2025-06-18T04:30:04.326Z
Learning: Next.js Link component fully supports both internal and external URLs and works appropriately with all standard anchor attributes including target="_blank", rel="noopener noreferrer", etc. Using Link for external URLs is completely appropriate and recommended.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx (13)
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7285
File: apps/dashboard/src/app/(app)/(dashboard)/published-contract/components/uri-based-deploy.tsx:57-57
Timestamp: 2025-06-05T13:59:49.886Z
Learning: In the thirdweb dashboard Next.js app, when using loginRedirect() in server components, ensure to add a return statement after the redirect call to prevent further code execution and potential security issues.
Learnt from: MananTank
PR: thirdweb-dev/js#7228
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/in-app-wallets/settings/page.tsx:23-25
Timestamp: 2025-05-30T18:14:57.074Z
Learning: In the dashboard codebase, the `loginRedirect` function performs an actual page redirect that automatically stops execution, similar to Next.js `redirect()`. No return statement is needed after calling `loginRedirect` as it handles flow control internally.
Learnt from: MananTank
PR: thirdweb-dev/js#7434
File: apps/dashboard/src/app/(app)/team/~/~/contract/[chain]/[contractAddress]/page.tsx:40-42
Timestamp: 2025-06-24T21:37:26.869Z
Learning: MananTank confirmed that loginRedirect function calls Next.js redirect internally, so no return statement is needed after calling loginRedirect() as it handles flow control internally by throwing an exception.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/claim-conditions/shared-claim-conditions-page.tsx:43-49
Timestamp: 2025-05-26T16:31:02.480Z
Learning: In the thirdweb dashboard codebase, when `redirectToContractLandingPage()` is called, an explicit return statement is not required afterward because the function internally calls Next.js's `redirect()` which throws an error to halt execution.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Use NavLink for internal navigation to automatically handle active states.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/analytics/shared-analytics-page.tsx:33-39
Timestamp: 2025-05-26T16:30:24.965Z
Learning: In the thirdweb dashboard codebase, redirectToContractLandingPage function already handles execution termination internally (likely using Next.js redirect() which throws an exception), so no explicit return statement is needed after calling it.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Client components should begin files with 'use client' and use React hooks for interactivity.
Learnt from: jnsdls
PR: thirdweb-dev/js#7365
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectFTUX/ProjectFTUX.tsx:16-17
Timestamp: 2025-06-18T04:27:16.172Z
Learning: Next.js Link component supports external URLs without throwing errors. When used with absolute URLs (like https://...), it behaves like a regular anchor tag without client-side routing, but does not cause runtime crashes or errors as previously believed.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx (10)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: For new UI components, add Storybook stories (*.stories.tsx) alongside the code.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Client components should begin files with 'use client' and use React hooks for interactivity.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Files for components should be named in PascalCase and use the '.client.tsx' suffix if interactive.
apps/dashboard/src/@/components/blocks/SidebarLayout.tsx (10)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Client components should begin files with 'use client' and use React hooks for interactivity.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Always import reusable UI components from a central library (e.g., '@/components/ui/*') to ensure consistency and avoid duplication.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: UI primitives should be imported from @/components/ui/*.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Use client components for interactive UI, components that rely on hooks, browser APIs, or require fast transitions.
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Use NavLink for internal navigation to automatically handle active states.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Files for components should be named in PascalCase and use the '.client.tsx' suffix if interactive.
apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx (5)
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: For new UI components, add Storybook stories (*.stories.tsx) alongside the code.
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Files for components should be named in PascalCase and use the '.client.tsx' suffix if interactive.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Use NavLink for internal navigation to automatically handle active states.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
🧬 Code Graph Analysis (5)
apps/dashboard/src/@/components/blocks/MobileSidebar.tsx (1)
apps/dashboard/src/@/components/blocks/Sidebar.tsx (1)
SidebarLink
(15-23)
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/layout.tsx (3)
apps/dashboard/src/@/components/ui/sidebar.tsx (1)
SidebarProvider
(769-769)apps/dashboard/src/app/(app)/team/components/TeamHeader/team-header-logged-in.client.tsx (1)
TeamHeaderLoggedIn
(24-130)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx (1)
TeamSidebarLayout
(12-107)
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx (1)
apps/dashboard/src/@/components/ui/tabs.tsx (1)
TabPathLinks
(213-244)
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx (1)
apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx (1)
FullWidthSidebarLayout
(56-98)
apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx (3)
apps/dashboard/src/@/components/ui/sidebar.tsx (14)
SidebarContent
(751-751)SidebarFooter
(752-752)SidebarRail
(770-770)SidebarTrigger
(772-772)SidebarGroup
(753-753)SidebarMenuItem
(764-764)SidebarGroupLabel
(756-756)SidebarGroupContent
(755-755)useSidebar
(773-773)SidebarMenu
(760-760)SidebarMenuButton
(763-763)SidebarMenuSub
(766-766)SidebarMenuSubItem
(768-768)SidebarSeparator
(771-771)apps/portal/src/components/Document/index.ts (1)
Separator
(29-29)apps/dashboard/src/@/components/ui/collapsible.tsx (3)
Collapsible
(11-11)CollapsibleTrigger
(11-11)CollapsibleContent
(11-11)
⏰ Context from checks skipped due to timeout of 90000ms (8)
- GitHub Check: Unit Tests
- GitHub Check: E2E Tests (pnpm, esbuild)
- GitHub Check: E2E Tests (pnpm, webpack)
- GitHub Check: Size
- GitHub Check: E2E Tests (pnpm, vite)
- GitHub Check: Lint Packages
- GitHub Check: Build Packages
- GitHub Check: Analyze (javascript)
🔇 Additional comments (35)
apps/dashboard/package.json (1)
14-14
: Dependency addition LGTM
@radix-ui/react-collapsible
is correctly added underdependencies
, matching its runtime use as a UI primitive.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/page.tsx (1)
50-50
: Verify layout width after droppingcontainer
Removing the
container
class will let this page stretch to the full viewport width. If the parent layout already restricts width (e.g., withmax-w-*
), this is fine; otherwise the audit-log table may appear unusually wide.apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx (1)
13-13
: Import path update looks correctThe layout now points to the new
full-width-sidebar-layout
module; no further action required.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/sidebar/TeamsMobileNav.tsx (1)
16-16
: Minor typography tweak approvedAdding
text-sm
aligns this bar’s font size with other mobile nav elements.apps/dashboard/src/app/(app)/team/components/Analytics/AnalyticsHeader.tsx (1)
13-13
: LGTM! Consistent width constraint applied.The addition of
max-w-7xl
aligns with the coding guidelines for page width consistency and follows the established pattern seen across other team components.apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/layout.tsx (1)
7-7
: LGTM! Import path cleanup improves maintainability.The change from a deep relative import path to an absolute import path enhances code readability and reduces the risk of broken imports when files are moved.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/rpc/page.tsx (1)
85-86
: LGTM! Typography and spacing refinements improve visual hierarchy.The reduction in gap spacing and the adjustment from bold 3xl to semibold 2xl creates a more balanced header section that aligns with the broader UI consistency improvements across the dashboard.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/analytics/page.tsx (1)
76-76
: LGTM! Consistent responsive width constraint applied.The addition of
md:max-w-7xl
follows the mobile-first responsive approach and maintains consistency with the maximum width constraints applied across other team dashboard components.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/layout.tsx (2)
27-27
: LGTM! Consistent width constraint applied to header.The addition of
max-w-5xl
maintains layout consistency with other team components while providing appropriate content width constraints.
33-35
: LGTM! Improved layout structure with proper spacing.The addition of
max-w-5xl
and the new wrapper div with flex column layout, gap spacing, and padding follows the coding guidelines preference for spacing utilities over custom margins and creates a more structured layout.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/ecosystem-header.client.tsx (1)
239-240
: LGTM! Consistent styling improvements.The padding adjustment and
max-w-7xl
constraint align with the coding guidelines for consistent page width and improved visual hierarchy.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx (1)
154-161
: LGTM! Improved heading hierarchy and user guidance.The larger heading size, descriptive text, and increased spacing enhance the user experience by providing clearer visual hierarchy and helpful context about IPFS file storage.
apps/dashboard/src/@/components/analytics/date-range-selector.tsx (1)
11-11
: Perfect implementation of className extensibility.This change follows the coding guidelines exactly by exposing a
className
prop on the root element and using thecn
utility for proper class merging.Also applies to: 17-17, 31-31
apps/dashboard/src/@/components/blocks/MobileSidebar.tsx (1)
56-56
: LGTM! Good API surface reduction.Making
useActiveSidebarLink
internal is appropriate since it's only used within this module. This reduces the public API surface and prevents external coupling to implementation details.apps/dashboard/src/@/components/analytics/range-selector.tsx (3)
79-79
: LGTM! Responsive layout improvement.The responsive flex layout changes provide better mobile-first design with
flex-col
by default andlg:flex-row
for larger screens. Thew-full
and reduced gap spacing enhance the component's adaptability.
81-81
: LGTM! Consistent design system styling.Adding
rounded-full
class aligns with the design system updates and provides visual consistency across the component.
93-93
: LGTM! Consistent styling with design tokens.The
bg-card rounded-full
classes follow the design system guidelines for using design tokens and provide visual consistency with the DateRangeSelector component.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/SettingsLayout.tsx (2)
15-21
: LGTM! Clean header structure.The header section properly uses container classes with
max-w-6xl
and maintains consistent border and padding styling.
23-25
: LGTM! Simplified content layout.The content container uses appropriate flexbox classes and maintains the
max-w-6xl
constraint for consistent page width. The simplification by removing sidebar navigation aligns with the broader refactoring effort.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/layout.tsx (3)
15-16
: LGTM! Consistent container styling.The container uses
max-w-7xl
for appropriate page width constraint and maintains proper flex layout for the header section.
17-18
: LGTM! Enhanced button styling with design tokens.The buttons now use
rounded-full bg-card
classes alongside the existingoutline
variant, following design system guidelines for consistent styling and proper use of design tokens.Also applies to: 23-23
32-34
: LGTM! Clean content container structure.The content container properly uses
max-w-7xl
constraint and appropriate flexbox classes for layout consistency.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx (4)
1-11
: LGTM! Proper client component setup.The component correctly uses the
"use client"
directive and imports appropriate icons from lucide-react. The FullWidthSidebarLayout import follows the established pattern.
12-19
: LGTM! Clean component interface and path construction.The component properly accepts
layoutPath
andchildren
props with appropriate TypeScript typing. The path construction for usage and settings sections is clean and maintainable.
20-102
: LGTM! Comprehensive sidebar navigation structure.The sidebar configuration is well-organized with:
- Proper use of icons for visual consistency
- Nested submenus for Usage and Team Settings
- Appropriate
exactMatch
flags for overview pages- Clean separation of concerns between top-level and nested navigation
The structure follows the composable UI primitive principles and provides a comprehensive navigation experience.
103-107
: LGTM! Clean render implementation.The component properly delegates rendering to FullWidthSidebarLayout and passes through the children prop, maintaining a clean separation of concerns.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx (3)
2-4
: LGTM! Proper import updates for tab navigation.The imports correctly add
getAuthToken
andTabPathLinks
to support the refactored navigation approach.
57-74
: LGTM! Well-structured tab navigation implementation.The
TabPathLinks
component usage is correct with:
- Proper link structure using
name
andpath
properties- Consistent container styling with
max-w-7xl
- Appropriate padding classes
- Future-ready placeholder for "Design (coming soon)" functionality
The transition from sidebar to tab navigation is well-executed and maintains design consistency.
75-77
: LGTM! Consistent content container styling.The content container maintains the
max-w-7xl
constraint and proper flexbox layout classes, ensuring consistency with other layout components.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/layout.tsx (3)
1-15
: LGTM! Import changes align with the new sidebar layout approach.The addition of sidebar-related imports and the move to use
TeamSidebarLayout
is consistent with the PR objectives.
47-74
: Staff mode implementation looks good with improved UI.The staff mode detection logic is correct, and the new banner design with orange tones and the action button with icon provides better visual hierarchy.
87-89
: ```shell
#!/bin/bashDescription: Properly verify that TeamSidebarLayout leverages FullWidthSidebarLayout
Search for FullWidthSidebarLayout usage anywhere under the team directory
rg -A 5 "FullWidthSidebarLayout" "apps/dashboard/src/app/(app)/team"
</details> <details> <summary>apps/dashboard/src/@/components/blocks/SidebarLayout.tsx (1)</summary> `1-36`: **Clean refactor that properly delegates sidebar complexity.** The simplification of this component is well-executed, moving complex sidebar logic to the new `FullWidthSidebarLayout` while keeping this as a simple wrapper. The component correctly uses the "use client" directive and follows the coding guidelines for styling with Tailwind classes. </details> <details> <summary>apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx (2)</summary> `56-98`: **Well-structured sidebar layout with proper responsive design.** The component correctly implements a full-width sidebar layout with: - Proper use of Tailwind classes following the coding guidelines - AppFooter included (which was removed from the team layout) - Mobile-responsive trigger - Clean separation between sidebar and content areas --- `171-297`: **Excellent implementation of recursive sidebar rendering.** The render functions are well-structured with: - Proper handling of all link types (links, groups, separators, submenus) - Correct use of Collapsible components for submenus - Good UX with mobile sidebar closing on link click - Appropriate use of array index for separator keys (with biome-ignore comment) </details> </blockquote></details> </details> <!-- This is an auto-generated comment by CodeRabbit for review status -->
size-limit report 📦
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #7464 +/- ##
=======================================
Coverage 51.91% 51.91%
=======================================
Files 949 949
Lines 64149 64149
Branches 4226 4226
=======================================
Hits 33306 33306
Misses 30737 30737
Partials 106 106
🚀 New features to boost your workflow:
|
13360b1
to
c32f96f
Compare
|
eb81f06
to
449c2a9
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (1)
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/layout.tsx (1)
20-22
: Consider updating loginRedirect URL for consistency.The
loginRedirect
URL points to/settings
but this is a billing layout. Consider updating to redirect to the current billing path for better UX:- loginRedirect(`/team/${params.team_slug}/~/settings`); + loginRedirect(`/team/${params.team_slug}/~/billing`);
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yaml
is excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (54)
apps/dashboard/package.json
(1 hunks)apps/dashboard/redirects.js
(2 hunks)apps/dashboard/src/@/components/analytics/date-range-selector.tsx
(2 hunks)apps/dashboard/src/@/components/analytics/range-selector.tsx
(2 hunks)apps/dashboard/src/@/components/billing/CancelPlanModal/CancelPlanModal.tsx
(1 hunks)apps/dashboard/src/@/components/billing/billing.tsx
(1 hunks)apps/dashboard/src/@/components/blocks/GatedSwitch.tsx
(1 hunks)apps/dashboard/src/@/components/blocks/MobileSidebar.tsx
(1 hunks)apps/dashboard/src/@/components/blocks/SidebarLayout.tsx
(1 hunks)apps/dashboard/src/@/components/blocks/TeamPlanBadge.tsx
(1 hunks)apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx
(1 hunks)apps/dashboard/src/@/components/blocks/pagination-buttons.tsx
(9 hunks)apps/dashboard/src/@/components/blocks/upsell-wrapper.tsx
(1 hunks)apps/dashboard/src/@/components/ui/collapsible.tsx
(1 hunks)apps/dashboard/src/@/components/ui/pagination.tsx
(1 hunks)apps/dashboard/src/@/hooks/useApi.ts
(0 hunks)apps/dashboard/src/app/(app)/components/Header/SecondaryNav/account-button.client.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/_components/BillingAlertBannersUI.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/_components/FreePlanUpsellBannerUI.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/_components/StaffModeNotice.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/layout.tsx
(2 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/analytics/page.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/layout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/page.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/components/PlanInfoCard.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/components/credit-balance-section.client.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/invoices/page.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/layout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/page.tsx
(3 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx
(2 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/ecosystem-header.client.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/SettingsLayout.tsx
(0 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/settings-cards/dedicated-support.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/sidebar/TeamsMobileNav.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/SettingsCreditsPage.tsx
(0 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/components/ApplyForOpCreditsForm.tsx
(0 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/components/ApplyForOpCreditsModal.tsx
(0 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/components/PlanCard.tsx
(0 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/components/applyOpSponsorship.ts
(0 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/page.tsx
(0 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/layout.tsx
(3 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/members/InviteSection.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/layout.tsx
(2 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/rpc/page.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/account-abstraction/Alerts.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/layout.tsx
(2 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/page.tsx
(2 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/wallets/analytics/chart/index.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/abiUtils.ts
(3 hunks)apps/dashboard/src/app/(app)/team/components/Analytics/AnalyticsHeader.tsx
(1 hunks)apps/dashboard/src/app/(app)/team/components/TeamHeader/TeamAndProjectSelectorPopoverButton.tsx
(1 hunks)
💤 Files with no reviewable changes (8)
- apps/dashboard/src/@/hooks/useApi.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/SettingsCreditsPage.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/components/PlanCard.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/components/ApplyForOpCreditsForm.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/page.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/components/applyOpSponsorship.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/credits/components/ApplyForOpCreditsModal.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/SettingsLayout.tsx
✅ Files skipped from review due to trivial changes (15)
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/_components/BillingAlertBannersUI.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx
- apps/dashboard/src/@/components/blocks/GatedSwitch.tsx
- apps/dashboard/src/app/(app)/components/Header/SecondaryNav/account-button.client.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/components/credit-balance-section.client.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/invoices/page.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/components/PlanInfoCard.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/wallets/analytics/chart/index.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/account-abstraction/Alerts.tsx
- apps/dashboard/src/@/components/billing/CancelPlanModal/CancelPlanModal.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/page.tsx
- apps/dashboard/src/@/components/blocks/upsell-wrapper.tsx
- apps/dashboard/src/@/components/blocks/pagination-buttons.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/_components/FreePlanUpsellBannerUI.tsx
- apps/dashboard/src/@/components/billing/billing.tsx
🚧 Files skipped from review as they are similar to previous changes (22)
- apps/dashboard/package.json
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/layout.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/sidebar/TeamsMobileNav.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/audit-log/page.tsx
- apps/dashboard/src/app/(app)/team/components/Analytics/AnalyticsHeader.tsx
- apps/dashboard/src/@/components/ui/collapsible.tsx
- apps/dashboard/src/@/components/analytics/date-range-selector.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/layout.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/ecosystem-header.client.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/abiUtils.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/rpc/page.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/layout.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/analytics/page.tsx
- apps/dashboard/src/@/components/analytics/range-selector.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/layout.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/_components/StaffModeNotice.tsx
- apps/dashboard/src/@/components/blocks/MobileSidebar.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/ecosystem/[slug]/(active)/components/EcosystemSlugLayout.tsx
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/page.tsx
- apps/dashboard/src/@/components/blocks/SidebarLayout.tsx
- apps/dashboard/src/@/components/blocks/full-width-sidebar-layout.tsx
🧰 Additional context used
📓 Path-based instructions (2)
`**/*.@(ts|tsx)`: Accept a typed 'props' object and export a named function (e.g...
**/*.@(ts|tsx)
: Accept a typed 'props' object and export a named function (e.g., export function MyComponent()).
Combine class names via 'cn', expose 'className' prop if useful.
Reuse core UI primitives; avoid re-implementing buttons, cards, modals.
Local state or effects live inside; data fetching happens in hooks.
Merge class names with 'cn' from '@/lib/utils' to keep conditional logic readable.
Stick to design-tokens: background ('bg-card'), borders ('border-border'), muted text ('text-muted-foreground') etc.
Use the 'container' class with a 'max-w-7xl' cap for page width consistency.
Spacing utilities ('px-', 'py-', 'gap-*') are preferred over custom margins.
Responsive helpers follow mobile-first ('max-sm', 'md', 'lg', 'xl').
Never hard-code colors – always go through Tailwind variables.
Tailwind CSS is the styling system – avoid inline styles or CSS modules.
Prefix files with 'import "server-only";' so they never end up in the client bundle (for server-only code).
📄 Source: CodeRabbit Inference Engine (.cursor/rules/dashboard.mdc)
List of files the instruction was applied to:
apps/dashboard/src/@/components/blocks/TeamPlanBadge.tsx
apps/dashboard/src/@/components/ui/pagination.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/settings-cards/dedicated-support.tsx
apps/dashboard/src/app/(app)/team/components/TeamHeader/TeamAndProjectSelectorPopoverButton.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/layout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/layout.tsx
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/members/InviteSection.tsx
`apps/dashboard/*`: The dashboard app is a web-based developer console built wit...
apps/dashboard/*
: The dashboard app is a web-based developer console built with Next.js and Chakra UI.
Use Tailwind CSS only for styling; no inline styles or CSS modules.
Use cn() from @/lib/utils for conditional class merging.
Use design system tokens for backgrounds (bg-card), borders (border-border), and muted text (text-muted-foreground).
Expose className prop on the root element of components for overrides.
Use NavLink for internal navigation with automatic active states.
Server components should start files with import "server-only"; client components should begin files with 'use client';.
Never import posthog-js in server components; analytics events are client-side only.
📄 Source: CodeRabbit Inference Engine (CLAUDE.md)
List of files the instruction was applied to:
apps/dashboard/redirects.js
🧠 Learnings (10)
📓 Common learnings
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
Learnt from: MananTank
PR: thirdweb-dev/js#7177
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/settings/shared-settings-page.tsx:29-39
Timestamp: 2025-05-27T20:10:47.245Z
Learning: MananTank prefers adding error handling (try-catch) directly inside utility functions like `shouldRenderNewPublicPage` rather than requiring callers to wrap the function calls in try-catch blocks. This centralizes error handling and benefits all callers automatically.
apps/dashboard/src/@/components/blocks/TeamPlanBadge.tsx (5)
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/nfts/page.tsx:20-20
Timestamp: 2025-05-26T16:26:58.068Z
Learning: In team/project contract pages under routes like `/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/*`, users are always logged in by design. The hardcoded `isLoggedIn={true}` prop in these pages is intentional and correct, not a bug to be fixed.
Learnt from: jnsdls
PR: thirdweb-dev/js#7364
File: apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx:36-41
Timestamp: 2025-06-18T02:13:34.500Z
Learning: In the logout flow in apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx, when `doLogout()` fails, the cleanup steps (resetAnalytics(), wallet disconnect, router refresh) should NOT execute. This is intentional to maintain consistency - if server-side logout fails, client-side cleanup should not occur.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
apps/dashboard/src/@/components/ui/pagination.tsx (1)
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Use NavLink for internal navigation to automatically handle active states.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/settings-cards/dedicated-support.tsx (1)
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
apps/dashboard/src/app/(app)/team/components/TeamHeader/TeamAndProjectSelectorPopoverButton.tsx (5)
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/nfts/page.tsx:20-20
Timestamp: 2025-05-26T16:26:58.068Z
Learning: In team/project contract pages under routes like `/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/*`, users are always logged in by design. The hardcoded `isLoggedIn={true}` prop in these pages is intentional and correct, not a bug to be fixed.
Learnt from: MananTank
PR: thirdweb-dev/js#7434
File: apps/dashboard/src/app/(app)/team/~/~/contract/[chain]/[contractAddress]/components/project-selector.tsx:62-76
Timestamp: 2025-06-24T21:38:03.155Z
Learning: In the project-selector.tsx component for contract imports, the addToProject.mutate() call is intentionally not awaited (fire-and-forget pattern) to allow immediate navigation to the contract page while the import happens in the background. This is a deliberate design choice to prioritize user experience.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
apps/dashboard/redirects.js (10)
Learnt from: MananTank
PR: thirdweb-dev/js#7228
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/in-app-wallets/settings/page.tsx:23-25
Timestamp: 2025-05-30T18:14:57.074Z
Learning: In the dashboard codebase, the `loginRedirect` function performs an actual page redirect that automatically stops execution, similar to Next.js `redirect()`. No return statement is needed after calling `loginRedirect` as it handles flow control internally.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/claim-conditions/shared-claim-conditions-page.tsx:43-49
Timestamp: 2025-05-26T16:31:02.480Z
Learning: In the thirdweb dashboard codebase, when `redirectToContractLandingPage()` is called, an explicit return statement is not required afterward because the function internally calls Next.js's `redirect()` which throws an error to halt execution.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7285
File: apps/dashboard/src/app/(app)/(dashboard)/published-contract/components/uri-based-deploy.tsx:57-57
Timestamp: 2025-06-05T13:59:49.886Z
Learning: In the thirdweb dashboard Next.js app, when using loginRedirect() in server components, ensure to add a return statement after the redirect call to prevent further code execution and potential security issues.
Learnt from: jnsdls
PR: thirdweb-dev/js#7363
File: apps/wallet-ui/next.config.mjs:58-73
Timestamp: 2025-06-18T02:02:21.427Z
Learning: User jnsdls prefers to explicitly list specific rewrite rules for clarity/documentation purposes, even when they are functionally redundant due to catch-all patterns. In PostHog rewrite configurations, they intentionally keep specific endpoint rules like "/_ph/decide" listed after catch-all rules like "/_ph/:path*" for documentation clarity, accepting the functional redundancy.
Learnt from: jnsdls
PR: thirdweb-dev/js#7363
File: apps/playground-web/next.config.mjs:61-76
Timestamp: 2025-06-18T02:01:37.865Z
Learning: In PostHog migration rewrites, the team prefers to explicitly list the `/_ph/decide` rewrite rule even when it may be covered by a catch-all pattern, for configuration clarity and documentation purposes.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/nfts/page.tsx:20-20
Timestamp: 2025-05-26T16:26:58.068Z
Learning: In team/project contract pages under routes like `/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/*`, users are always logged in by design. The hardcoded `isLoggedIn={true}` prop in these pages is intentional and correct, not a bug to be fixed.
Learnt from: MananTank
PR: thirdweb-dev/js#7434
File: apps/dashboard/src/app/(app)/team/~/~/contract/[chain]/[contractAddress]/page.tsx:40-42
Timestamp: 2025-06-24T21:37:26.869Z
Learning: MananTank confirmed that loginRedirect function calls Next.js redirect internally, so no return statement is needed after calling loginRedirect() as it handles flow control internally by throwing an exception.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/analytics/shared-analytics-page.tsx:33-39
Timestamp: 2025-05-26T16:30:24.965Z
Learning: In the thirdweb dashboard codebase, redirectToContractLandingPage function already handles execution termination internally (likely using Next.js redirect() which throws an exception), so no explicit return statement is needed after calling it.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx (11)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: For new UI components, add Storybook stories (*.stories.tsx) alongside the code.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-25T02:13:08.257Z
Learning: Client components should begin files with 'use client' and use React hooks for interactivity.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Prefer composable UI primitives (Button, Input, Select, Tabs, Card, Sidebar, Separator, Badge) over custom markup for maintainability and design consistency.
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Always import reusable UI components from a central library (e.g., '@/components/ui/*') to ensure consistency and avoid duplication.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Files for components should be named in PascalCase and use the '.client.tsx' suffix if interactive.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/layout.tsx (13)
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: jnsdls
PR: thirdweb-dev/js#7364
File: apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx:36-41
Timestamp: 2025-06-18T02:13:34.500Z
Learning: In the logout flow in apps/dashboard/src/app/(app)/account/components/AccountHeader.tsx, when `doLogout()` fails, the cleanup steps (resetAnalytics(), wallet disconnect, router refresh) should NOT execute. This is intentional to maintain consistency - if server-side logout fails, client-side cleanup should not occur.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/nfts/page.tsx:20-20
Timestamp: 2025-05-26T16:26:58.068Z
Learning: In team/project contract pages under routes like `/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/*`, users are always logged in by design. The hardcoded `isLoggedIn={true}` prop in these pages is intentional and correct, not a bug to be fixed.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7285
File: apps/dashboard/src/app/(app)/(dashboard)/published-contract/components/uri-based-deploy.tsx:57-57
Timestamp: 2025-06-05T13:59:49.886Z
Learning: In the thirdweb dashboard Next.js app, when using loginRedirect() in server components, ensure to add a return statement after the redirect call to prevent further code execution and potential security issues.
Learnt from: MananTank
PR: thirdweb-dev/js#7434
File: apps/dashboard/src/app/(app)/team/~/~/contract/[chain]/[contractAddress]/page.tsx:40-42
Timestamp: 2025-06-24T21:37:26.869Z
Learning: MananTank confirmed that loginRedirect function calls Next.js redirect internally, so no return statement is needed after calling loginRedirect() as it handles flow control internally by throwing an exception.
Learnt from: MananTank
PR: thirdweb-dev/js#7228
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/in-app-wallets/settings/page.tsx:23-25
Timestamp: 2025-05-30T18:14:57.074Z
Learning: In the dashboard codebase, the `loginRedirect` function performs an actual page redirect that automatically stops execution, similar to Next.js `redirect()`. No return statement is needed after calling `loginRedirect` as it handles flow control internally.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-23T13:49:58.951Z
Learning: Client components must begin with 'use client'; before imports to ensure correct rendering behavior in Next.js.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/claim-conditions/shared-claim-conditions-page.tsx:43-49
Timestamp: 2025-05-26T16:31:02.480Z
Learning: In the thirdweb dashboard codebase, when `redirectToContractLandingPage()` is called, an explicit return statement is not required afterward because the function internally calls Next.js's `redirect()` which throws an error to halt execution.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/analytics/shared-analytics-page.tsx:33-39
Timestamp: 2025-05-26T16:30:24.965Z
Learning: In the thirdweb dashboard codebase, redirectToContractLandingPage function already handles execution termination internally (likely using Next.js redirect() which throws an exception), so no explicit return statement is needed after calling it.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/page.tsx:2-10
Timestamp: 2025-05-26T16:28:10.079Z
Learning: In Next.js 14+, the `params` object in page components is always a Promise that needs to be awaited, so the correct typing is `params: Promise<ParamsType>` rather than `params: ParamsType`.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/layout.tsx (10)
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: jnsdls
PR: thirdweb-dev/js#7188
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx:15-15
Timestamp: 2025-05-29T00:46:09.063Z
Learning: In the accounts component at apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/components/accounts-count.tsx, the 3-column grid layout (md:grid-cols-3) is intentionally maintained even when rendering only one StatCard, as part of the design structure for this component.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/accounts/page.tsx:2-10
Timestamp: 2025-05-26T16:28:10.079Z
Learning: In Next.js 14+, the `params` object in page components is always a Promise that needs to be awaited, so the correct typing is `params: Promise<ParamsType>` rather than `params: ParamsType`.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: MananTank
PR: thirdweb-dev/js#7434
File: apps/dashboard/src/app/(app)/team/~/~/contract/[chain]/[contractAddress]/components/project-selector.tsx:62-76
Timestamp: 2025-06-24T21:38:03.155Z
Learning: In the project-selector.tsx component for contract imports, the addToProject.mutate() call is intentionally not awaited (fire-and-forget pattern) to allow immediate navigation to the contract page while the import happens in the background. This is a deliberate design choice to prioritize user experience.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/nfts/page.tsx:20-20
Timestamp: 2025-05-26T16:26:58.068Z
Learning: In team/project contract pages under routes like `/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/*`, users are always logged in by design. The hardcoded `isLoggedIn={true}` prop in these pages is intentional and correct, not a bug to be fixed.
Learnt from: MananTank
PR: thirdweb-dev/js#7228
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/in-app-wallets/settings/page.tsx:23-25
Timestamp: 2025-05-30T18:14:57.074Z
Learning: In the dashboard codebase, the `loginRedirect` function performs an actual page redirect that automatically stops execution, similar to Next.js `redirect()`. No return statement is needed after calling `loginRedirect` as it handles flow control internally.
Learnt from: MananTank
PR: thirdweb-dev/js#7285
File: apps/dashboard/src/app/(app)/(dashboard)/published-contract/components/uri-based-deploy.tsx:57-57
Timestamp: 2025-06-05T13:59:49.886Z
Learning: In the thirdweb dashboard Next.js app, when using loginRedirect() in server components, ensure to add a return statement after the redirect call to prevent further code execution and potential security issues.
Learnt from: MananTank
PR: thirdweb-dev/js#7434
File: apps/dashboard/src/app/(app)/team/~/~/contract/[chain]/[contractAddress]/page.tsx:40-42
Timestamp: 2025-06-24T21:37:26.869Z
Learning: MananTank confirmed that loginRedirect function calls Next.js redirect internally, so no return statement is needed after calling loginRedirect() as it handles flow control internally by throwing an exception.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/members/InviteSection.tsx (4)
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/nfts/page.tsx:20-20
Timestamp: 2025-05-26T16:26:58.068Z
Learning: In team/project contract pages under routes like `/team/[team_slug]/[project_slug]/contract/[chainIdOrSlug]/[contractAddress]/*`, users are always logged in by design. The hardcoded `isLoggedIn={true}` prop in these pages is intentional and correct, not a bug to be fixed.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
⏰ Context from checks skipped due to timeout of 90000ms (8)
- GitHub Check: E2E Tests (pnpm, esbuild)
- GitHub Check: Size
- GitHub Check: E2E Tests (pnpm, vite)
- GitHub Check: E2E Tests (pnpm, webpack)
- GitHub Check: Unit Tests
- GitHub Check: Build Packages
- GitHub Check: Lint Packages
- GitHub Check: Analyze (javascript)
🔇 Additional comments (13)
apps/dashboard/src/@/components/ui/pagination.tsx (1)
53-56
: LGTM! Border styling improvement enhances visual consistency.The addition of default transparent borders and conditional visible borders for inactive states creates more consistent pagination link sizing and improves visual distinction between active and inactive states. The use of design tokens (
border-border
) and proper className merging follows the established patterns.apps/dashboard/redirects.js (2)
115-131
: LGTM: Well-structured redirects for billing URL migration.The new
teamPageRedirects
array properly handles the migration from legacy/settings/billing/*
URLs to the new/billing/*
structure. The redirects maintain backward compatibility and use appropriate permanent flags.
447-447
: LGTM: Proper integration of team redirects.The
teamPageRedirects
array is correctly spread into the main redirects array alongside existing redirect arrays.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/TeamSidebarLayout.tsx (2)
1-1
: LGTM: Proper client component directive.The 'use client' directive is correctly placed at the top of the file for this interactive sidebar component.
15-83
: Well-structured sidebar layout component.The
TeamSidebarLayout
component follows React best practices with:
- Proper TypeScript typing for props
- Good organization of sidebar links with appropriate icons
- Consistent URL structure using the
layoutPath
prop- Clear separation of content and footer links
The component leverages the
FullWidthSidebarLayout
primitive as recommended in the coding guidelines.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/layout.tsx (3)
2-4
: LGTM: Simplified imports align with layout refactor.The import changes reflect the removal of complex account handling and adoption of tab-based navigation, which simplifies the component structure.
15-18
: Good simplification: Removed unnecessary account fetching.The Promise.all now only fetches essential data (team and authToken), removing the overhead of account validation and client creation that's no longer needed in this simplified layout.
28-61
: Excellent layout simplification using design system components.The new layout structure is much cleaner and follows the coding guidelines by:
- Using
TabPathLinks
component for navigation consistency- Applying proper design tokens (container, max-w-6xl, etc.)
- Maintaining responsive spacing with utility classes
- Creating a more maintainable component structure
This aligns with the move away from complex sidebar navigation to simpler tab-based navigation.
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/layout.tsx (1)
1-56
: Well-implemented billing layout with consistent patterns.The billing layout component follows the same successful pattern established in the settings layout:
- Proper async server component structure
- Concurrent data fetching with Promise.all
- Authentication and team validation
- Clean tab navigation with TabPathLinks
- Consistent styling with design tokens
The component structure promotes maintainability and follows the coding guidelines effectively.
apps/dashboard/src/app/(app)/team/components/TeamHeader/TeamAndProjectSelectorPopoverButton.tsx (1)
104-106
: LGTM: URL update aligns with billing route restructuring.The change from
/settings/billing
to/billing
is consistent with the broader refactor to simplify billing URLs across the dashboard application. This maintains proper navigation behavior with the new routing structure.apps/dashboard/src/@/components/blocks/TeamPlanBadge.tsx (1)
48-48
: ```shell
#!/bin/bashDescription: Verify billing URL patterns in all .ts and .tsx files
Search for any leftover old billing URLs
rg -C2 "/~/settings/billing" -g ".ts" -g ".tsx"
Confirm usage of the new billing URL pattern
rg -C2 "/~/billing?" -g ".ts" -g ".tsx"
</details> <details> <summary>apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/settings-cards/dedicated-support.tsx (1)</summary> `134-134`: **LGTM! Billing URL simplification aligns with the refactor.** The URL change from `/~/settings/billing` to `/~/billing` is consistent with the dashboard-wide billing URL structure simplification. Query parameters are correctly preserved for the upgrade flow. </details> <details> <summary>apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/members/InviteSection.tsx (1)</summary> `135-135`: **LGTM! Billing URL update is consistent with the dashboard refactor.** The URL change removes the `/settings` segment while preserving the query parameters for the growth plan upgrade flow. This aligns with the systematic billing URL structure changes across the dashboard. </details> </blockquote></details> </details> <!-- This is an auto-generated comment by CodeRabbit for review status -->
449c2a9
to
84cab50
Compare
84cab50
to
e4e42f9
Compare
e4e42f9
to
29a59f2
Compare
Merge activity
|
<!-- ## 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 refactoring the billing-related components and routes in the application, streamlining the user experience by updating links and improving layout structures. ### Detailed summary - Deleted several unused files related to billing settings and credits. - Updated link paths from `/settings/billing` to `/billing` across various components. - Refactored `useActiveSidebarLink` to remove export. - Adjusted layout and structure for better responsiveness in billing-related pages. - Introduced a new `StaffModeNotice` component for staff mode indication. - Enhanced visual elements and spacing in multiple components for consistency. > The following files were skipped due to too many changes: `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/rpc/page.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** * Introduced a full-width sidebar layout with collapsible submenus and responsive navigation. * Added a team sidebar layout with structured navigation for team dashboards. * Added collapsible UI components for use in layouts and menus. * Added a reusable StaffModeNotice component for staff mode indication. * **Bug Fixes** * Improved container sizing and maximum width constraints for better layout consistency across analytics, audit log, and ecosystem pages. * **Refactor** * Simplified and reorganized sidebar layouts, removing complex internal logic and mobile navigation from several components. * Updated navigation structures to use new sidebar and tab-based layouts. * Streamlined and restyled headers, banners, and button components for a more cohesive look. * Replaced inline staff mode banners with the StaffModeNotice component. * Removed sidebar navigation from usage and settings layouts for a cleaner interface. * Removed gas credits settings and related components from the settings area. * Refactored ecosystem pages to redirect directly to creation, removing landing page. * Updated billing-related URL paths by removing deprecated `/settings` segments for consistency. * Removed account plan constants and unused hooks for cleaner codebase. * Cleaned up imports and replaced some relative imports with absolute paths. * **Style** * Enhanced visual styling and responsiveness for range selectors, sidebars, and headers. * Adjusted text sizes and spacing in mobile navigation and file sections for improved readability. * Added rounded corners and adjusted spacing in date and interval selectors. * Added responsive minimum widths and consistent borders to pagination buttons and links. * **Chores** * Added a new dependency for collapsible UI support. * Updated import paths and added lint suppression comments for code clarity and maintainability. * Added responsive minimum widths to pagination buttons and consistent border styling to pagination links. * Updated multiple URLs in links and buttons to reflect new billing paths without `/settings` segment. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
29a59f2
to
0ea44cc
Compare
<!-- ## 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 primarily focuses on refactoring and updating the billing and settings-related components in the dashboard application, changing URLs from `/settings` to `/billing`, and enhancing the user interface for better clarity and usability. ### Detailed summary - Deleted several unused files related to settings and credits. - Updated links in various components to redirect from `/settings` to `/billing`. - Refactored `useActiveSidebarLink` to streamline sidebar link management. - Enhanced UI elements for better responsiveness and aesthetics. - Introduced a new `StaffModeNotice` component for staff mode indications. - Adjusted layout components for consistent styling. - Reorganized billing-related components into a unified structure. - Improved pagination button styles for better visibility. > The following files were skipped due to too many changes: `apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/rpc/page.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** * Introduced a full-width sidebar layout with collapsible submenus and responsive navigation. * Added a team sidebar layout with structured navigation for team dashboards. * Added collapsible UI components for use in layouts and menus. * Added a reusable StaffModeNotice component for staff mode indication. * **Bug Fixes** * Improved container sizing and maximum width constraints for better layout consistency across analytics, audit log, and ecosystem pages. * **Refactor** * Simplified and reorganized sidebar layouts, removing complex internal logic and mobile navigation from several components. * Updated navigation structures to use new sidebar and tab-based layouts. * Streamlined and restyled headers, banners, and button components for a more cohesive look. * Replaced inline staff mode banners with the StaffModeNotice component. * Removed sidebar navigation from usage and settings layouts for a cleaner interface. * Removed gas credits settings and related components from the settings area. * Refactored ecosystem pages to redirect directly to creation, removing landing page. * Updated billing-related URL paths by removing deprecated `/settings` segments for consistency. * Removed account plan constants and unused hooks for cleaner codebase. * Cleaned up imports and replaced some relative imports with absolute paths. * **Style** * Enhanced visual styling and responsiveness for range selectors, sidebars, and headers. * Adjusted text sizes and spacing in mobile navigation and file sections for improved readability. * Added rounded corners and adjusted spacing in date and interval selectors. * Added responsive minimum widths and consistent borders to pagination buttons and links. * **Chores** * Added a new dependency for collapsible UI support. * Updated import paths and added lint suppression comments for code clarity and maintainability. * Added responsive minimum widths to pagination buttons and consistent border styling to pagination links. * Updated multiple URLs in links and buttons to reflect new billing paths without `/settings` segment. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
0ea44cc
to
08834f6
Compare
PR-Codex overview
This PR focuses on refactoring the billing and settings structure within the application, consolidating routes, and updating UI components to improve navigation and user experience.
Detailed summary
/settings/billing
to/billing
across various components.useActiveSidebarLink
to simplify sidebar link management.StaffModeNotice
component for staff mode indication.Summary by CodeRabbit
New Features
Bug Fixes
Refactor
/settings
segments for consistency.Style
Chores
/settings
segment.