Enforce front project structure through ESLINT #7863
Conversation
packages/twenty-front/.eslintrc.cjs
Outdated
| './packages/twenty-front/folderStructure.json', | ||
| }, | ||
| rules: { | ||
| 'project-structure/folder-structure': 'warn', |
There was a problem hiding this comment.
only warning for now
| { "ruleId": "moduleFolderRule" }, | ||
| { "name": "hooks", "ruleId": "hooksLeafFolderRule" }, | ||
| { "name": "utils", "ruleId": "utilsLeafFolderRule" }, | ||
| { "name": "states", "ruleId": "doNotCheckLeafFolderRule" }, |
There was a problem hiding this comment.
I have added this rule for now we can progressively add the rules folder by folder once we have fixed the existing warnings (we have ~150), let's do it step by step
There was a problem hiding this comment.
I've actually fixed existing warnings but I don't want to move everything now, we will activate these rules progressively
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
There was a problem hiding this comment.
PR Summary
This PR enforces a new folder structure for the twenty-front package using ESLint rules, aiming to improve code organization and maintainability.
- Added 'eslint-plugin-project-structure' in package.json and configured it in .eslintrc.cjs
- Introduced folderStructure.json to define expected structure for modules, hooks, and utilities
- Renamed test directories from 'test' to 'tests' for consistency
- Changed file extensions from .tsx to .ts for several hooks in the workflow module
- Reordered imports in some files to align with best practices
21 file(s) reviewed, 25 comment(s)
Edit PR Review Bot Settings | Greptile
| @@ -21,7 +21,14 @@ module.exports = { | |||
| parserOptions: { | |||
| project: ['packages/twenty-front/tsconfig.{json,*.json}'], | |||
| }, | |||
| rules: {}, | |||
| plugins: ['project-structure'], | |||
There was a problem hiding this comment.
style: Consider adding a comment explaining the purpose of the 'project-structure' plugin for future maintainers
| ], | ||
| "rules": { | ||
| "moduleFolderRule": { | ||
| "name": "^(?!utils$|hooks$|states|types|graphql|components|effect-components|constants|validation-schemas|context$)[a-z][a-z0-9]**(?:-[a-z0-9]+)**$", |
There was a problem hiding this comment.
style: The regex for module folder names is complex and may be difficult to maintain. Consider simplifying or documenting it for clarity.
| "hooksLeafFolderRule": { | ||
| "folderRecursionLimit": 2, | ||
| "children": [ | ||
| { "name": "use{PascalCase}.(ts|tsx)" }, |
There was a problem hiding this comment.
style: The naming convention for hooks files is strict. Ensure all existing hooks follow this pattern, or consider allowing more flexibility.
| "name": "modules", | ||
| "children": [ | ||
| { "ruleId": "moduleFolderRule" }, | ||
| { "name": "types", "ruleId": "doNotCheckLeafFolderRule" } |
Fixes: #7329