feat(designs): implement empty state with CTA for new projects and up…

[Kushaal-k]

Fixes #2978

Why

I hit the empty Projects state while checking the current branch and found that it only showed the no-projects copy, even though the existing New Project modal flow was already available from EntryShell. This is a small UI gap, not a data/API issue, and it leaves users at a dead end when they land on an empty Projects tab.

What users will see

When Projects has no items, the empty state now includes a simple primary “New project” CTA that opens the existing New Project modal. The empty state is also visually simplified so it reads as a clean call to action instead of a decorative card.

Surface area

• UI — empty state in apps/web
• Keyboard shortcut — new or changed
• CLI / env var — new od subcommand or flag, new tools-dev / tools-pack / tools-pr flag, or new OD_* env var
• API / contract — new /api/* endpoint, new SSE event, or changed shape in packages/contracts
• Extension point — new entry under skills/, design-systems/, design-templates/, or craft/, or change to the skills protocol
• i18n keys — added new translation keys
• New top-level dependency — adding any new entry to the root package.json
• Default behavior change — changes what existing users experience without opting in
• None — internal refactor, docs, tests, or translation update only

Screenshots

Not included.

Bug fix verification

• Red spec: apps/web/tests/components/DesignsTab.empty.test.tsx
• The test was added for this branch and passed here; I did not run it on main, so the red-on-main / green-on-branch check is not available.
• Verification used instead: focused component test plus pnpm --filter @open-design/web typecheck.

Validation

• pnpm --filter @open-design/web test -- tests/components/DesignsTab.empty.test.tsx
• pnpm --filter @open-design/web typecheck

[lefarcen]

Hey @Kushaal-k, thanks for picking this up and for tying it back to #2978.

Heads-up: #3043 is already open against the same empty-state path — both PRs touch apps/web/src/components/DesignsTab.tsx and apps/web/src/components/EntryShell.tsx, and both wire a New project CTA into the existing modal flow. You and @leno23 may want to compare approaches; the maintainer team will pick which lands so neither effort gets wasted.

Since this is a visible empty-state change, before I add @Eli-tangerine as reviewer could you also add a quick screenshot or before/after capture of the Projects empty state? That lets product review the UX without needing to spin up the branch locally.

[Kushaal-k]

Before

After