Capture the five recurring code-review patterns from the recent PR series
(#3591–#3596) as enforceable rules so they don't have to be raised again
in review.
## Conventions
- Prefer MUI native props over `sx` (e.g. color={...}, mt={...}, width={...}).
- Use the full theme path for colors: theme.palette.text.secondary, never
the "text.secondary" shorthand string. The shorthand is invisible to
grep, which makes future audits and refactors miss callsites.
- No hardcoded numeric or string literals — use LAYOUT, typographyLevels,
theme.shape.borderRadius, theme.palette tokens.
- Use useTheme() inside components; don't import { theme } from
@/Utils/Theme/Theme (factory output, not a live mode-aware instance).
- Pair runtime tuples with derived types so they can't drift.
## Files
- docs/frontend-conventions.md — long-form doc with before/after examples
drawn from the actual review fixes, plus a pre-PR checklist.
- CLAUDE.md — short summary in the Code Conventions section pointing to
the doc, so it's loaded into agent context at session start.
## ESLint enforcement
- client/.eslintrc.cjs — four no-restricted-syntax selectors for each rule:
- color="…" / bgcolor="…" / borderColor="…" with a dotted shorthand value
- sx={{ key: ... }} where key has a native equivalent, only on hoistable
components (Box, Stack, Typography, Grid, Container, Paper, Card*,
Divider, Link, Chip) — Dialog/Drawer/Menu etc. only accept sx.
- import { theme } from "@/Utils/Theme/Theme"
- Typography fontSize={13} (the body default — drop the prop).
- TypeScript files are now actually parsed: added @typescript-eslint/parser
and @typescript-eslint/eslint-plugin and a TS override that extends the
React plugin configs. Several @typescript-eslint/recommended rules
disabled to avoid noise on the existing codebase.
- client/package.json — lint script now covers .ts/.tsx; new lint-strict
script for CI use once the codebase is conformant; --max-warnings 0
removed from `lint` so existing-code warnings don't block the workflow.
## Surface
Running `npm run lint` after this change reports ~280 warnings against
the existing codebase, almost all from rule #1 (sx-vs-native). These are
intentionally warnings, not errors — they surface the work without
blocking. Each warning links to the rule number in the conventions doc
so the reasoning is one click away.
74 lines
2.0 KiB
JSON
74 lines
2.0 KiB
JSON
{
|
|
"name": "client",
|
|
"private": true,
|
|
"version": "3.6.1",
|
|
"type": "module",
|
|
"scripts": {
|
|
"dev": "vite",
|
|
"build": "tsc -b && vite build",
|
|
"build-dev": "tsc -b && vite build --mode development",
|
|
"lint": "eslint . --ext js,jsx,ts,tsx --report-unused-disable-directives",
|
|
"lint-strict": "eslint . --ext js,jsx,ts,tsx --report-unused-disable-directives --max-warnings 0",
|
|
"preview": "vite preview",
|
|
"format": "prettier --write .",
|
|
"format-check": "prettier --check ."
|
|
},
|
|
"lint-staged": {
|
|
"**/*": "prettier --write"
|
|
},
|
|
"dependencies": {
|
|
"@emotion/react": "^11.13.3",
|
|
"@emotion/styled": "^11.13.0",
|
|
"@hello-pangea/dnd": "^18.0.0",
|
|
"@hookform/resolvers": "5.2.2",
|
|
"@mui/lab": "7.0.0",
|
|
"@mui/material": "7.3.7",
|
|
"@mui/x-charts": "7.29.1",
|
|
"@mui/x-date-pickers": "7.29.4",
|
|
"@reduxjs/toolkit": "2.7.0",
|
|
"@types/maplibre-gl": "^1.13.2",
|
|
"axios": "^1.7.4",
|
|
"dayjs": "1.11.13",
|
|
"html2canvas": "^1.4.1",
|
|
"human-interval": "2.0.1",
|
|
"i18next": "25.4.2",
|
|
"joi": "17.13.3",
|
|
"lucide-react": "^0.562.0",
|
|
"maplibre-gl": "^5.19.0",
|
|
"mui-color-input": "^7.0.0",
|
|
"pretty-bytes": "^7.1.0",
|
|
"pretty-ms": "^9.3.0",
|
|
"react": "18.3.1",
|
|
"react-dom": "^18.2.0",
|
|
"react-hook-form": "^7.63.0",
|
|
"react-i18next": "^15.4.0",
|
|
"react-icons": "5.5.0",
|
|
"react-map-gl": "^8.1.0",
|
|
"react-redux": "9.2.0",
|
|
"react-router": "^6.23.0",
|
|
"react-router-dom": "^6.23.1",
|
|
"react-toastify": "^10.0.5",
|
|
"recharts": "2.15.2",
|
|
"redux-persist": "6.0.0",
|
|
"swr": "^2.3.6",
|
|
"vite-plugin-svgr": "^4.2.0",
|
|
"zod": "^4.3.6"
|
|
},
|
|
"devDependencies": {
|
|
"@types/node": "24.5.2",
|
|
"@types/react": "^18.2.66",
|
|
"@types/react-dom": "^18.2.22",
|
|
"@typescript-eslint/eslint-plugin": "^7.18.0",
|
|
"@typescript-eslint/parser": "^7.18.0",
|
|
"@vitejs/plugin-react": "^4.2.1",
|
|
"eslint": "^8.57.0",
|
|
"eslint-plugin-react": "^7.34.1",
|
|
"eslint-plugin-react-hooks": "^5.0.0",
|
|
"eslint-plugin-react-refresh": "^0.4.6",
|
|
"lint-staged": "^16.2.7",
|
|
"prettier": "^3.3.3",
|
|
"typescript": "5.9.3",
|
|
"vite": "6.4.1"
|
|
}
|
|
}
|