From b05472eb3e6d296b2f50858f9320a40d2f62ba93 Mon Sep 17 00:00:00 2001 From: Jonathan Fuchs Date: Thu, 16 Dec 2021 15:20:25 -0800 Subject: [PATCH] Propose a new file structure (ADR) (#1678) * Proposes a new file structure (ADR) * Update contributor-docs/adrs/adr-XXX-file-structure.md Co-authored-by: Cole Bemis * More questions about the implementation process * Doc updates; removal of open questions * BreadCrumbs -> Breadcrumbs * Remove note about separately exported subcomponents * Update contributor-docs/adrs/adr-XXX-file-structure.md Co-authored-by: Cole Bemis Co-authored-by: Cole Bemis --- .../adrs/adr-XXX-file-structure.md | 41 +++++++++++++++++++ 1 file changed, 41 insertions(+) create mode 100644 contributor-docs/adrs/adr-XXX-file-structure.md diff --git a/contributor-docs/adrs/adr-XXX-file-structure.md b/contributor-docs/adrs/adr-XXX-file-structure.md new file mode 100644 index 00000000000..c23bd973f57 --- /dev/null +++ b/contributor-docs/adrs/adr-XXX-file-structure.md @@ -0,0 +1,41 @@ +# ADR XXX: File structure + +## Status + +Proposed + +## Context + +Components might be more grokable if they were structured consistently. This ADR proposes conventions + +## Decision + +TL;DR: + +``` +primer-react/ +├─ src/ +│ ├─ Breadcrumbs/ +│ │ ├─ index.ts // Just re-exporting? +│ │ ├─ Breadcrumbs.tsx // Primary component +│ │ ├─ BreadcrumbsItem.tsx // Subcomponent (include parent component name to increase findability in most IDEs) +│ │ ├─ Breadcrumbs.mdx // Documentation. Always .mdx, not .md +│ │ ├─ Breadcrumbs.stories.tsx +│ │ ├─ Breadcrumbs.test.tsx // Unit tests +│ │ ├─ Breadcrumbs.types.test.tsx // Type tests +│ │ ├─ Breadcrumbs.yml // Component metadata (Possible future) +│ │ └─ __snapshots__/ +┆ ┆ +``` + +### Rules + +- Every component should have its own PascalCased directory directly under `src/` +- Subcomponents should be properties of the exported parent component (e.g., `Breadcrumbs.Item`) +- Replacements of existing components should use an incrementing number (e.g., `Breadcrumbs2` rather than `NewBreadcrumbs`) + +## Implementation + +- [ ] Migrate components into this structure +- [ ] Set up tests for the component structure +- [ ] Mark this ADR as adopted