Give the shell one header, a skip link, and a cookie-aware first paint.
Breakpoint clones were still in the tab order, marketing always painted Log in, and at 430px the logo overlay covered Use cases and Learn. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -107,7 +107,7 @@ Inventory aligns with [**CR-104**](https://linear.app/community-rule/issue/CR-10
|
||||
| **Link** matrix | **`Link/`** | Next.js **`Link`** wrapper + Figma “Link, CTA” styling; used in nav and content (e.g. **`Rule`**). |
|
||||
| Create-flow top chrome (often **Utility** in Figma) | **`CreateFlowTopNav/`** | Wizard header; **`CreateFlowLayoutClient`**. |
|
||||
| Create-flow bottom chrome (often **Utility** in Figma) | **`CreateFlowFooter/`** | Wizard footer + **`ProportionBar`**; **`CreateFlowLayoutClient`**. |
|
||||
| App shell (not a DS atom) | **`ConditionalNavigation.tsx`**, **`ConditionalNavigationClient.tsx`** | Server: session for first paint. Client: hide global **`Top`** on **`/create/*`** and **`/login`**; else **`TopWithPathname`**. **Tolerated `usePathname()`** — no new pathname-conditional chrome (**`routes.mdc`**). |
|
||||
| App shell (not a DS atom) | **`ConditionalNavigation.tsx`**, **`ConditionalNavigationClient.tsx`**, **`SkipToContent.tsx`** | Server: session for first paint. Client: hide global **`Top`** on **`/create/*`** and **`/login`**; else **`TopWithPathname`**. Skip link in group layouts targets **`#main-content`**. **Tolerated `usePathname()`** — no new pathname-conditional chrome (**`routes.mdc`**). |
|
||||
|
||||
**Also under Utility in Figma:** **`CreateFlowTopNav`** / **`CreateFlowFooter`** are filed under Utility but **canonical code** is here with **`Top`** / **`Footer`** (see **Utility conventions**).
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@ as follow-up work (see "Outcome" sections below).
|
||||
|
||||
| Flag | Recommendation | Status |
|
||||
| --- | --- | --- |
|
||||
| `cacheComponents` (PPR successor) | **Ship** | **Shipped.** `force-dynamic` removed from `(app)` and `(admin)` layouts; `<ConditionalNavigation />` (and `<MarketingNavigation />`) wrapped in `<Suspense fallback={null}>`. `(app)`/`(admin)` routes are now `◐ Partial Prerender` instead of `ƒ Dynamic`. `/` static shell dropped from 45 KB → 11.7 KB gzipped. |
|
||||
| `cacheComponents` (PPR successor) | **Ship** | **Shipped.** `force-dynamic` removed from `(app)` and `(admin)` layouts; `<ConditionalNavigation />` wrapped in `<Suspense fallback={null}>` in `(marketing)`, `(app)`, and `(admin)`. `(app)`/`(admin)` routes are now `◐ Partial Prerender` instead of `ƒ Dynamic`. `/` static shell dropped from 45 KB → 11.7 KB gzipped. |
|
||||
| React Compiler | **Ship (annotation mode)** | **Shipped (plumbing only).** `babel-plugin-react-compiler` + `eslint-plugin-react-compiler` installed. `reactCompiler: { compilationMode: "annotation" }` enabled in `next.config.mjs`. ESLint rule wired in at "warn" — found 31 latent warnings across 8 files (none introduced by this change). Migrating containers to `"use memo"` is a future task. |
|
||||
|
||||
Both flags now ship in `main`. The findings below describe what changed in
|
||||
@@ -76,9 +76,9 @@ requires expressing that dynamism via `<Suspense>` boundaries plus
|
||||
2. Wrapped `<ConditionalNavigation />` (server component reading
|
||||
`getNavAuthSignedIn()` → `cookies()`) in `<Suspense fallback={null}>` in
|
||||
both layouts.
|
||||
3. Same change for `<MarketingNavigation />` in
|
||||
3. Same Suspense wrap for `<ConditionalNavigation />` in
|
||||
[app/(marketing)/layout.tsx](../../app/(marketing)/layout.tsx) — the
|
||||
marketing nav reads `usePathname()` (uncached per request) and would
|
||||
nav reads `usePathname()` (uncached per request) and would
|
||||
otherwise block the static shell at routes like `/rules/[id]`.
|
||||
4. Enabled `experimental.cacheComponents: true` in
|
||||
[next.config.mjs](../../next.config.mjs).
|
||||
|
||||
Reference in New Issue
Block a user