ryanahamilton opened a new pull request, #72349: URL: https://github.com/apache/airflow/pull/72349
`src/components/ui/` holds the UI's customized Chakra primitives — its design system — but sitting under `components/` it read as just another components subfolder, to the point that `AGENTS.md` needed a line telling contributors not to put generic app components there. This promotes it to a top-level `src/system-components/` so that boundary is structural rather than documented. Four commits, each independently green so the history bisects cleanly: 1. **Rename `components/ui` to `system-components`** — the move plus every importer. All access forms collapse to `src/system-components`: the barrel, deep paths, and the relative variants (`./ui`, `../ui`, `../../ui`) that already violated the documented alias convention. 2. **Remove the unused `Tag` system component** — nothing imported it and it was never re-exported from the barrel, so it had been dead since it was added. 3. **Export every system component from the barrel** — five components (`ActionBar`, `NumberInput`, `RadioCard`, `ResizableWrapper`, `SegmentedControl`) were reachable only by deep path, so files needing one ended up importing the design system twice. Completing the barrel lets every consumer use a single import and stops callers needing to know which file a component lives in. There are now no deep `src/system-components/*` imports left. 4. **Group imports by architectural layer** — import blocks previously collapsed the design system, pages, components and every other `src` layer into one undifferentiated block, so a file's dependencies gave no sense of which layers it reached into. They are now blank-line-separated groups: react → external → `openapi` → `system-components` → `layouts` → `pages` → `components` → remaining `src` → relative. Ordering stays with the existing `@trivago/prettier-plugin-sort-imports` rather than moving to an ESLint rule. Two reasons: `eslint-plugin-import` caps its ESLint peer at `^9` while this repo is on ESLint 10, and the `ts-compile-lint-ui` prek hook runs `eslint --fix` *before* `prettier --write`, so an ESLint ordering rule would be overwritten on disk and leave `pnpm lint` failing with no possible fix. There is a comment in `rules/perfectionist.js` recording that, so `sort-imports` is not enabled later by mistake. No functional change — the diff is a directory move, import specifiers, and import ordering. `pnpm lint` (ESLint + `tsc`), `prettier --check`, `pnpm build` and the full test suite (1140 tests) pass, and the `ts-compile-lint-ui` prek hook is clean. Two things worth a reviewer's eye: - The `react` group matches `^react$` only, so `react-dom`, `react-dom/client` and `react/jsx-runtime` sort as third party. In practice this only visibly affects `main.tsx`. - `Menu/MenuTrigger.tsx` and `Modal/Modal.tsx` use sibling-relative imports (`../Tooltip`, `../Dialog`) rather than the barrel, which would make the barrel depend on its own members. --- ##### Was generative AI tooling used to co-author this PR? - [X] Yes — Claude Code (Opus 5) Generated-by: Claude Code (Opus 5) following [the guidelines](https://github.com/apache/airflow/blob/main/contributing-docs/05_pull_requests.rst#gen-ai-assisted-contributions) -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected]
