CommunityRule/community-rule
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Backend / staging cleanup, performance substrate, and create-flow polish #60

Merged
an.di merged 16 commits from adilallo/Backend/StagingCleanup into main 2026-05-26 15:11:47 +00:00
Conversation 0 Commits 16 Files Changed 123
+2523 -611
an.di commented 2026-05-26 15:10:52 +00:00
Owner
Copy Link
Copy Source

Overview

This PR bundles staging-readiness work, Next.js 16 performance substrate changes, marketing/create-flow UX fixes, and operator documentation updates on branch adilallo/Backend/StagingCleanup.

The main goals:

  • Ship Next 16 Cache Components (PPR) so marketing pages prerender a static shell while session-aware nav streams in, reducing first-load JS on / (~45 KB → ~11.7 KB gzipped static shell per docs/perf/next16-eval.md).
  • Enable React Compiler plumbing in annotation mode (no behavior change until components opt in with "use memo").
  • Fix create-flow recommendation flash — method cards no longer render in authoring order then jump to facet-ranked “Recommended” order after the API returns.
  • Stop noisy guest draft cleanup — skip DELETE /api/drafts/me when the user is not signed in.
  • Cross-browser / mobile polish — favicons, SVGR ID collisions, iPhone input zoom and button states, footer and modal fixes.
  • Operator docs — new steady-state runbook and updated deploy guides for MEDLab Cloudron staging/production.

Changes

Performance & Next 16 substrate

  • Enable experimental.cacheComponents in next.config.mjs; remove force-dynamic from (app) / (admin) layouts and wrap session-aware nav in <Suspense fallback={null}>.
  • Add route-level loading.tsx for marketing and create-flow groups.
  • Enable React Compiler (compilationMode: "annotation") + ESLint plugin wiring.
  • Marketing page optimizations: move inline copy to messages/en/marketing.ts, lazy-load heavy sections, trim LogoWall/QuoteBlock client work, extend image minimumCacheTTL.
  • Add docs/perf/next16-eval.md documenting evaluation, blockers resolved, and outcomes.

Create flow — facet recommendations

  • Add shared cache + deduped fetch in lib/create/facetRecommendationsLoad.ts.
  • Prefetch all four method-deck scores from CreateFlowLayoutClient once community facets are selected.
  • Gate CardStack rendering on recommendationsReady in Communication, Membership, Conflict Management, and Decision Approaches screens.
  • Refactor useFacetRecommendations to read cache synchronously on mount.

Create flow — draft cleanup

  • prepareFreshCreateFlowEntrySync / prepareFreshCreateFlowEntry accept { signedIn?: boolean }.
  • Server draft DELETE and create:fresh-entry-pending sentinel only run when signedIn: true and backend sync is on.
  • Top nav passes loggedIn; profile passes signedIn: true; marketing entry points default to guest behavior.

UI / accessibility fixes

  • Generate and wire cross-browser favicons (public/favicon*, apple-touch-icon.png, scripts/generate-favicons.mjs).
  • Fix SVGR loading: preserve viewBox, prefix SVG clip/mask IDs to avoid collisions when multiple icons share a page.
  • iPhone: reduce unwanted input zoom (TextInput), improve button active/focus states.
  • Footer button layout/behavior fixes; Ask Organizer modal fixes; About page TripleTextBlock layout fix; remove erroneous focus ring on Feature Grid section.

Docs & ops

  • New docs/guides/ops-runbook.md — steady-state deploy, rollback, recovery on Cloudron.
  • Updates to ops-backend-deploy.md, backend roadmap/Linear tickets, static assets guide, relaunch brief.
  • Gitea issue templates (bug report + feedback/suggestion).

Tests

  • tests/unit/facetRecommendationsLoad.test.ts — cache + in-flight dedupe.
  • tests/unit/prepareFreshCreateFlowEntry.test.ts — guest vs signed-in draft cleanup.
  • Updates across component, page, e2e, and layout tests for nav/marketing/create-flow changes.

How to Test

  1. Setup

    npm install
npx tsc --noEmit
npx vitest run
npx next build
npm run dev

  2. Create flow — recommended cards (signed-in or guest with facets)

    • Start a new rule from the homepage; complete community facet steps (size, structure, context, etc.).
    • Navigate to Communication methods (and repeat for Membership, Decision Approaches, Conflict Management).
    • Verify cards appear once in facet-ranked order with “Recommended” badges — no flash from authoring order to ranked order.
    • On a slow connection, card area may be briefly empty (aria-busy) rather than showing wrong order.

  3. Create flow — guest draft cleanup

    • While logged out, click Create rule from the top nav.
    • Open DevTools → Network.
    • Confirm no DELETE /api/drafts/me request (no 401).
    • Confirm local draft keys are still cleared and wizard starts fresh.

  4. Create flow — signed-in draft cleanup

    • Sign in with a saved server draft.
    • Click Create rule or Start new custom rule from profile.
    • Confirm DELETE /api/drafts/me fires once and wizard starts clean.

  5. Performance / PPR

    • Run npx next build and confirm marketing routes show partial prerender (◐) where expected.
    • Load / and verify nav streams in without layout shift; compare static shell size to pre-change baseline if using bundle analyzer.

  6. Cross-browser / mobile

    • Check favicons in Chrome, Safari, and Firefox (tab icon + iOS home-screen icon).
    • On iPhone Safari: tap inputs in create flow modals — text should not zoom unexpectedly; buttons should have sensible pressed states.
    • Pages with multiple SVG icons (footer social logos, icon grids) — no missing/clipped icons from ID collisions.

  7. Marketing fixes

    • Footer links/buttons work on mobile and desktop.
    • Ask Organizer modal opens, submits, and dismisses correctly.
    • /about triple-step block renders correctly at md+ breakpoints.

  8. Regression

    npm run e2e   # if environment supports it
npm run storybook   # Footer, FeatureGrid, TripleTextBlock stories
## Overview This PR bundles staging-readiness work, Next.js 16 performance substrate changes, marketing/create-flow UX fixes, and operator documentation updates on branch `adilallo/Backend/StagingCleanup`. The main goals: - **Ship Next 16 Cache Components (PPR)** so marketing pages prerender a static shell while session-aware nav streams in, reducing first-load JS on `/` (~45 KB → ~11.7 KB gzipped static shell per `docs/perf/next16-eval.md`). - **Enable React Compiler plumbing** in annotation mode (no behavior change until components opt in with `"use memo"`). - **Fix create-flow recommendation flash** — method cards no longer render in authoring order then jump to facet-ranked “Recommended” order after the API returns. - **Stop noisy guest draft cleanup** — skip `DELETE /api/drafts/me` when the user is not signed in. - **Cross-browser / mobile polish** — favicons, SVGR ID collisions, iPhone input zoom and button states, footer and modal fixes. - **Operator docs** — new steady-state runbook and updated deploy guides for MEDLab Cloudron staging/production. ## Changes ### Performance & Next 16 substrate - Enable `experimental.cacheComponents` in `next.config.mjs`; remove `force-dynamic` from `(app)` / `(admin)` layouts and wrap session-aware nav in `<Suspense fallback={null}>`. - Add route-level `loading.tsx` for marketing and create-flow groups. - Enable React Compiler (`compilationMode: "annotation"`) + ESLint plugin wiring. - Marketing page optimizations: move inline copy to `messages/en/marketing.ts`, lazy-load heavy sections, trim LogoWall/QuoteBlock client work, extend image `minimumCacheTTL`. - Add `docs/perf/next16-eval.md` documenting evaluation, blockers resolved, and outcomes. ### Create flow — facet recommendations - Add shared cache + deduped fetch in `lib/create/facetRecommendationsLoad.ts`. - Prefetch all four method-deck scores from `CreateFlowLayoutClient` once community facets are selected. - Gate `CardStack` rendering on `recommendationsReady` in Communication, Membership, Conflict Management, and Decision Approaches screens. - Refactor `useFacetRecommendations` to read cache synchronously on mount. ### Create flow — draft cleanup - `prepareFreshCreateFlowEntrySync` / `prepareFreshCreateFlowEntry` accept `{ signedIn?: boolean }`. - Server draft `DELETE` and `create:fresh-entry-pending` sentinel only run when `signedIn: true` and backend sync is on. - Top nav passes `loggedIn`; profile passes `signedIn: true`; marketing entry points default to guest behavior. ### UI / accessibility fixes - Generate and wire cross-browser favicons (`public/favicon*`, `apple-touch-icon.png`, `scripts/generate-favicons.mjs`). - Fix SVGR loading: preserve `viewBox`, prefix SVG clip/mask IDs to avoid collisions when multiple icons share a page. - iPhone: reduce unwanted input zoom (`TextInput`), improve button active/focus states. - Footer button layout/behavior fixes; Ask Organizer modal fixes; About page `TripleTextBlock` layout fix; remove erroneous focus ring on Feature Grid section. ### Docs & ops - New `docs/guides/ops-runbook.md` — steady-state deploy, rollback, recovery on Cloudron. - Updates to `ops-backend-deploy.md`, backend roadmap/Linear tickets, static assets guide, relaunch brief. - Gitea issue templates (bug report + feedback/suggestion). ### Tests - `tests/unit/facetRecommendationsLoad.test.ts` — cache + in-flight dedupe. - `tests/unit/prepareFreshCreateFlowEntry.test.ts` — guest vs signed-in draft cleanup. - Updates across component, page, e2e, and layout tests for nav/marketing/create-flow changes. ## How to Test 1. **Setup** ```bash npm install npx tsc --noEmit npx vitest run npx next build npm run dev ``` 2. **Create flow — recommended cards (signed-in or guest with facets)** - Start a new rule from the homepage; complete community facet steps (size, structure, context, etc.). - Navigate to **Communication methods** (and repeat for Membership, Decision Approaches, Conflict Management). - Verify cards appear once in facet-ranked order with “Recommended” badges — **no flash** from authoring order to ranked order. - On a slow connection, card area may be briefly empty (`aria-busy`) rather than showing wrong order. 3. **Create flow — guest draft cleanup** - While **logged out**, click **Create rule** from the top nav. - Open DevTools → Network. - Confirm **no** `DELETE /api/drafts/me` request (no `401`). - Confirm local draft keys are still cleared and wizard starts fresh. 4. **Create flow — signed-in draft cleanup** - Sign in with a saved server draft. - Click **Create rule** or **Start new custom rule** from profile. - Confirm `DELETE /api/drafts/me` fires once and wizard starts clean. 5. **Performance / PPR** - Run `npx next build` and confirm marketing routes show partial prerender (`◐`) where expected. - Load `/` and verify nav streams in without layout shift; compare static shell size to pre-change baseline if using bundle analyzer. 6. **Cross-browser / mobile** - Check favicons in Chrome, Safari, and Firefox (tab icon + iOS home-screen icon). - On iPhone Safari: tap inputs in create flow modals — text should not zoom unexpectedly; buttons should have sensible pressed states. - Pages with multiple SVG icons (footer social logos, icon grids) — no missing/clipped icons from ID collisions. 7. **Marketing fixes** - Footer links/buttons work on mobile and desktop. - Ask Organizer modal opens, submits, and dismisses correctly. - `/about` triple-step block renders correctly at md+ breakpoints. 8. **Regression** ```bash npm run e2e # if environment supports it npm run storybook # Footer, FeatureGrid, TripleTextBlock stories ```
an.di added 16 commits 2026-05-26 15:10:53 +00:00
Update Docs d5d0bed88a
Issue template daba38f96f
Fix about page triple step block 30a7dd1c2f
Fix ask organizer modal d8e0b87bb3
Fix footer buttons b1ad3c6203
Remove focus on feature grid section 59999b8211
Attempt to fix iphone button states daa5e533d6
Fix cross-browser favicons e7c17b8651
Attempt to fix iphone input text zoom bd536a407f
Issue #59 fixes 6b45a2e5d0
Improve page load times and rendering 3be188a3cc
Performance follow-ups eded97559d
Cache components and react compiler edda28f95b
Fix svg loading issues 2871df27b2
Fix loading of recommended methods 8420ce42e3
Fix draft error when logged out 62efb6a0cc
an.di changed title from ackend / staging cleanup, performance substrate, and create-flow polish to Backend / staging cleanup, performance substrate, and create-flow polish 2026-05-26 15:10:59 +00:00
an.di self-assigned this 2026-05-26 15:11:07 +00:00
an.di merged commit 3de8ffc4ef into main 2026-05-26 15:11:47 +00:00
an.di deleted branch adilallo/Backend/StagingCleanup 2026-05-26 15:11:47 +00:00
Sign in to join this conversation.
Reviewers
No Reviewers
Labels
No items
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
an.di (Andy DiLallo) ntnsndr (Nathan Schneider)
No Assignees an.di
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: CommunityRule/community-rule#60
Delete Branch "adilallo/Backend/StagingCleanup"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?