Agent skill · metabase
fe-modularization
Deciding where frontend code lives — tier model, move mechanics, extension points, side effects, naming, and the traps. Use when moving code between modules, carving new modules, fixing boundary violations, adding a barrel or an endpoint, or reviewing module-shape decisions.
What it needs
About 8k tokens when loaded.
What this skill does
Frontend modularization The module is the unit of blast radius: dependency direction, test selection, bundle cones, and review scope all follow module boundaries. Every decision here serves one goal: make the file locations tell the truth about who owns what and who may depend on whom. Hard rules (check these before anything else) NEVER add an export … from re-export at an old path, and NEVER export from a barrel. Move the code, codemod every call site, delete the old path, all in the same PR. NEVER import past a module's index.ts when that module has enforcePublicApi: true, and never past metabase/ui's index at all. If the barrel is heavy, the fix is making the module side-effect free (below), not a deep import. NEVER rewrite a consumer to a lower-level idiom to make the linter pass. If the fix makes the consumer worse, the plan is wrong. NEVER give a new module enforceSharedTiers: false; new modules ship enforced with enforcePublicApi: true and an explicit index.ts. NEVER move code without the consumer-tier check (procedure step 2). ALWAYS delete a module's enforceSharedTiers: false line in the PR that takes it to zero violations. ALWAYS measure bun run module-boundaries before and after, and report the numbers. ALWAYS import dayjs from metabase/dayjs, routing from metabase/router, Mantine from metabase/ui, react-redux hooks from metabase/redux; the raw specifiers are lint-forbidden. Files that are ground truth what where --- --- module elements, tiers, enforceSharedTiers, enforcePublicApi frontend/lint/module-boundaries.mjs shared sub-tiers and levels, cluster rules frontend/lint/shared-tiers.mjs standalone boundaries lint (all violations, incl. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills metabase/fe-modularization