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

Component cleanup #49

Merged
an.di merged 2 commits from adilallo/maintenance/ComponentCleanup into main 2026-04-29 13:25:53 +00:00
Conversation 0 Commits 2 Files Changed 267
+2087 -2196
an.di commented 2026-04-29 13:24:13 +00:00
Owner
Copy Link
Copy Source

Component library reorg, Figma registry updates, and cleanup

Overview

This PR reorganizes app/components into clearer buckets (asset, cards, controls, modals, navigation, sections, type, utility), aligns naming with Figma-oriented conventions, moves admin-only UI (Web Vitals dashboard) next to its route, and refreshes docs and Cursor rules. It also applies a focused ESLint/React fix pass (hook deps, modal composition, next/image for the string-URL icon fallback) and removes stale TODO(figma) placeholders from container docstrings in favor of explicit paths and canonical-code notes.

Changes

  • Structure and naming
    • Cards: IconCard → Icon, MiniCard → Mini, RuleCard → Rule, Card → Selection, NumberCard → Step; NumberedCards → CardSteps (home / marketing step lists).
    • Navigation: MenuBar → Menu, MenuBarItem → MenuItem, TopNav → Top (including pathname-aware wrapper).
    • Asset: Avatar/Icon under asset/; Icon uses next/image with unoptimized when SVG imports resolve to a string URL ( satisfies @next/next/no-img-element).
    • Type / sections: Adds type/CommunityRule, type/Section, type/TextBlock; SectionHeader lives under type/; removes unused CommunityRuleDocument / DecisionMakingSidebar / Separator and Context menu components and their stories/tests.
    • Modals / controls: ModalHeader / ModalFooter under modals/; InfoMessageBox under controls/; CreateFlowFooter / CreateFlowTopNav stay under navigation but paths updated; useCreateModalA11y effect deps include dialogRef for exhaustive-deps.
    • Admin: WebVitalsDashboard colocated under app/(admin)/monitor/_components/.
  • App flows: Create flow, marketing home, profile, monitor, and not-found imports updated for new paths; buildPublishPayload / templateReviewMapping and related guards adjusted; messages updated (cardSteps, menu rename, removal of numberedCards keys where replaced).
  • Assets: Public vector SVGs moved under public/assets/vector/ with normalized filenames.
  • Quality / rules
    • Dialog.container: render children as JSX children of the view (avoid duplicate prop pattern).
    • TemplateReviewCard: useMemo dependency list fixed for compiler / react-hooks rules.
    • .cursor/rules/component-props.mdc: Figma traceability without recommending TODO(figma); other docs/rules (component-structure, routes, create-flow, AGENTS, README, docs/README, create-flow.md, figma-component-registry, backend tickets doc) updated for the new layout.
  • Tests & Storybook: Paths and names updated (CardSteps, Top, Selection, Step, etc.); removed tests for deleted components; added/adjusted coverage for Section, TextBlock, CommunityRule where applicable.

How to Test

  1. Install and run: npm install if needed; npm run dev for the app; npm run storybook for component stories.
  2. Verify flows: Home (step cards / CardSteps), create flow (top nav, footer, final review, template review), profile, /monitor (Web Vitals dashboard), marketing /rules/[id], and not-found if you hit an unknown route.
  3. Checks (per AGENTS.md):
    • npx tsc --noEmit
    • npx vitest run
    • npx eslint app/components --ext .ts,.tsx (expect clean; confirms Icon + a11y hook warnings addressed)
    • npx next build
  4. Spot-check: Icons in UI (including any path that hits the string-URL SVG branch), create-modal focus trap and escape-to-close, template review chips if you touch that screen.

Notes

  • Figma: Container docstrings now favor Figma: "…" (node-id) and short “canonical code under …” notes; filling in real node IDs everywhere can be a follow-up.
  • Linear / CR-104: If issue CR-104 should mirror docs/figma-component-registry.md, update the issue body separately; the repo doc is the source of truth for the Type/registry section.
# Component library reorg, Figma registry updates, and cleanup ## Overview This PR reorganizes `app/components` into clearer buckets (asset, cards, controls, modals, navigation, sections, type, utility), aligns naming with Figma-oriented conventions, moves admin-only UI (Web Vitals dashboard) next to its route, and refreshes docs and Cursor rules. It also applies a focused ESLint/React fix pass (hook deps, modal composition, `next/image` for the string-URL icon fallback) and removes stale `TODO(figma)` placeholders from container docstrings in favor of explicit paths and canonical-code notes. ## Changes - **Structure and naming** - **Cards:** `IconCard` → `Icon`, `MiniCard` → `Mini`, `RuleCard` → `Rule`, `Card` → `Selection`, `NumberCard` → `Step`; **`NumberedCards` → `CardSteps`** (home / marketing step lists). - **Navigation:** `MenuBar` → `Menu`, `MenuBarItem` → `MenuItem`, `TopNav` → `Top` (including pathname-aware wrapper). - **Asset:** Avatar/Icon under `asset/`; **`Icon`** uses **`next/image`** with **`unoptimized`** when SVG imports resolve to a string URL ( satisfies `@next/next/no-img-element`). - **Type / sections:** Adds **`type/CommunityRule`**, **`type/Section`**, **`type/TextBlock`**; **`SectionHeader`** lives under **`type/`**; removes unused **`CommunityRuleDocument`** / **`DecisionMakingSidebar`** / **`Separator`** and **Context menu** components and their stories/tests. - **Modals / controls:** **`ModalHeader`** / **`ModalFooter`** under `modals/`; **`InfoMessageBox`** under `controls/`; **`CreateFlowFooter`** / **`CreateFlowTopNav`** stay under navigation but paths updated; **`useCreateModalA11y`** effect deps include **`dialogRef`** for exhaustive-deps. - **Admin:** **`WebVitalsDashboard`** colocated under **`app/(admin)/monitor/_components/`**. - **App flows:** Create flow, marketing home, profile, monitor, and not-found imports updated for new paths; **`buildPublishPayload`** / **`templateReviewMapping`** and related guards adjusted; **`messages`** updated (`cardSteps`, `menu` rename, removal of `numberedCards` keys where replaced). - **Assets:** Public vector SVGs moved under **`public/assets/vector/`** with normalized filenames. - **Quality / rules** - **`Dialog.container`:** render **`children`** as JSX children of the view (avoid duplicate prop pattern). - **`TemplateReviewCard`:** `useMemo` dependency list fixed for compiler / `react-hooks` rules. - **`.cursor/rules/component-props.mdc`:** Figma traceability without recommending `TODO(figma)`; other docs/rules (`component-structure`, `routes`, `create-flow`, **AGENTS**, **README**, **docs/README**, **create-flow.md**, **figma-component-registry**, backend tickets doc) updated for the new layout. - **Tests & Storybook:** Paths and names updated (`CardSteps`, `Top`, `Selection`, `Step`, etc.); removed tests for deleted components; added/adjusted coverage for **`Section`**, **`TextBlock`**, **`CommunityRule`** where applicable. ## How to Test 1. **Install and run:** `npm install` if needed; `npm run dev` for the app; `npm run storybook` for component stories. 2. **Verify flows:** Home (step cards / CardSteps), create flow (top nav, footer, final review, template review), profile, **`/monitor`** (Web Vitals dashboard), marketing **`/rules/[id]`**, and **`not-found`** if you hit an unknown route. 3. **Checks (per AGENTS.md):** - `npx tsc --noEmit` - `npx vitest run` - `npx eslint app/components --ext .ts,.tsx` (expect clean; confirms Icon + a11y hook warnings addressed) - `npx next build` 4. **Spot-check:** Icons in UI (including any path that hits the string-URL SVG branch), create-modal focus trap and escape-to-close, template review chips if you touch that screen. ## Notes - **Figma:** Container docstrings now favor `Figma: "…" (node-id)` and short “canonical code under …” notes; filling in **real node IDs** everywhere can be a follow-up. - **Linear / CR-104:** If issue **CR-104** should mirror `docs/figma-component-registry.md`, update the issue body separately; the repo doc is the source of truth for the Type/registry section.
an.di added 1 commit 2026-04-29 13:24:14 +00:00
Component cleanup e6127f1a3f
an.di added 1 commit 2026-04-29 13:24:47 +00:00
Merge branch 'main' into adilallo/maintenance/ComponentCleanup 0973b65743
an.di merged commit 048dceced9 into main 2026-04-29 13:25:53 +00:00
an.di deleted branch adilallo/maintenance/ComponentCleanup 2026-04-29 13:25:53 +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
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: CommunityRule/community-rule#49
Delete Branch "adilallo/maintenance/ComponentCleanup"

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?