feat(dashboard): refine project workspace

[duyet]

Summary\n- Restyle the dashboard shell with an inset sidebar, stronger active navigation states, and a sticky top bar.\n- Redesign the project detail header, stat cards, segmented tabs, and conversation empty state for a denser workspace feel.\n- Keep project data, auth, routes, and API behavior unchanged.\n\n## Verification\n- bunx biome check packages/dashboard/src/\n- cd packages/dashboard && bunx tsc --noEmit\n- bun run build\n\n## Notes\n- Local signed-in browser QA is blocked by the production Clerk key domain restriction on localhost; the unauthenticated production route still shows the expected sign-in screen.\n

[sourcery-ai]

Sorry @duyet, you have reached your weekly rate limit of 500000 diff characters.

Please try again later or upgrade to continue using Sourcery

[gemini-code-assist]

Code Review

This pull request implements a comprehensive UI/UX overhaul of the dashboard, focusing on layout refinements, component restyling, and improved visual consistency. Key updates include adding sticky headers with backdrop filters, redesigning the project page header with new metadata badges, and standardizing the appearance of cards, sidebars, and navigation elements. Review feedback identifies a hardcoded API endpoint that should be made dynamic via environment variables and notes a potential issue where the "data-active:" Tailwind variant may not correctly target Radix UI's state attributes.

[gemini-code-assist]

The API URL is hardcoded to the production domain. This should ideally be dynamic (e.g., using an environment variable like NEXT_PUBLIC_API_ENDPOINT) to ensure the correct endpoint is displayed across different environments such as local development or staging, consistent with how it is handled in the main layout.

Suggested change

	<span className="truncate font-mono">https://agentstate.app/api</span>
	<span className="truncate font-mono">{process.env.NEXT_PUBLIC_API_ENDPOINT || "https://agentstate.app/api"}</span>

[gemini-code-assist]

The TabsTrigger component from Radix UI uses the data-state="active" attribute to indicate the active state. The data-active: Tailwind variant used here might not work as expected unless specifically configured in your Tailwind setup (standard Radix components use data-[state=active]). It is safer to use data-[state=active]: to ensure the styles are applied correctly.

Suggested change

	className="h-10 justify-start rounded-lg px-3 data-active:bg-card data-active:shadow-sm data-active:ring-1 data-active:ring-border"
	className="h-10 justify-start rounded-lg px-3 data-[state=active]:bg-card data-[state=active]:shadow-sm data-[state=active]:ring-1 data-[state=active]:ring-border"