@hypersolid-dev/eslint-config 3.0.0 → 5.0.0

package/dist/shared.js

@@ -1,7 +1,7 @@
 import eslintReact from '@eslint-react/eslint-plugin';
 import reactHooks from 'eslint-plugin-react-hooks';
 import unicorn from 'eslint-plugin-unicorn';
-import hypersolid from './plugins/props-destructuring.js';
+import hypersolid from './plugins/hypersolid.js';
 export const CODE_FILES = ['**/*.{js,mjs,cjs,jsx,ts,mts,cts,tsx}'];
 // Tests, stories, mocks and test setup: each preset relaxes a few rules here that test doubles break by design.
 export const TEST_FILES = [
@@ -18,6 +18,39 @@ export const NUMBER_GLOBAL_RESTRICTIONS = ['isFinite', 'isNaN'].map((name) => ({
     name,
     message: `Use Number.${name}; the global coerces its argument.`,
 }));
+/** `no-restricted-syntax` entries per preset; a later config replaces the options, so each preset spreads the ones before it. */
+export const BASE_RESTRICTED_SYNTAX = [
+    {
+        selector: "CallExpression[callee.property.name='catch'] > :matches(ArrowFunctionExpression, FunctionExpression).arguments:matches([body.type='Identifier'][body.name='undefined'], [body.type='Literal'][body.value=null], [body.type='BlockStatement'][body.body.length=0], [body.type='UnaryExpression'][body.operator='void'])",
+        message: 'An empty catch hides the failure. Log it, recover from it, or drop the catch when the promise cannot reject.',
+    },
+    {
+        selector: ":matches(ExportSpecifier[local.name='default'], ImportSpecifier[imported.name='default'])",
+        message: 'Import a default as a default (`import name from "…"`), then `export { name };` if it has to be re-exported.',
+    },
+];
+export const REACT_RESTRICTED_SYNTAX = [
+    ...BASE_RESTRICTED_SYNTAX,
+    {
+        selector: 'ExpressionStatement > Literal[value=/^use no (memo|forget)$/]',
+        message: 'Leave this component in the React Compiler; opting a subtree out is a performance decision that needs a reviewed reason.',
+    },
+    {
+        selector: ":matches(JSXExpressionContainer, JSXSpreadAttribute) CallExpression[callee.type='Identifier'][callee.name=/^use([A-Z0-9]|$)/]:not(Property[key.name=/^[A-Z]/] > ArrowFunctionExpression CallExpression)",
+        message: 'Call this hook at the top of the component and pass its result: `const fade = useAnimatedStyle(…)`, then `style={fade}`.',
+    },
+    {
+        selector: "MemberExpression[object.name='React'][property.name=/^use/]",
+        message: "Import React hooks from 'react' (`import { useEffect } from 'react'`) instead of `React.use*`.",
+    },
+];
+/** `@typescript-eslint/naming-convention` entries per preset, for the same reason. Destructured names come from elsewhere (`const { user_id } = payload`). */
+export const NAMING_CONVENTION = [
+    { selector: 'variable', modifiers: ['destructured'], format: null },
+    { selector: 'variable', format: ['camelCase', 'PascalCase', 'UPPER_CASE'] },
+    { selector: 'function', format: ['camelCase', 'PascalCase'] },
+    { selector: 'typeLike', format: ['PascalCase'] },
+];
 // Every enabled rule is an error: a warning is either worth fixing or not worth reporting.
 export function raiseWarnings(configs) {
     return configs.map((config) => {
@@ -85,12 +118,50 @@ export function reactConfigs() {
                 '@hypersolid-dev/props-destructuring': 'error',
                 // A boolean reads as a claim; hook and mock names are exempt. Bad: `const visible = true` (use `isVisible`).
                 'unicorn/consistent-boolean-name': ['error', REACT_BOOLEAN_NAME_OPTIONS],
+                // Base's empty catch and default specifiers, plus compiler opt-outs, hooks inside JSX and `React.useX`. Bad: `style={useAnimatedStyle(…)}`, `React.useState(0)`.
+                'no-restricted-syntax': ['error', ...REACT_RESTRICTED_SYNTAX],
+                // Base's naming, plus: a boolean prop is a state, not a command. Bad: `type Props = { showBadge: boolean }` (use `hasBadge`).
+                '@typescript-eslint/naming-convention': [
+                    'error',
+                    ...NAMING_CONVENTION,
+                    { selector: 'typeProperty', types: ['boolean'], format: null, custom: { regex: '^(show|display|hide)[A-Z]', match: false } },
+                ],
+                // A fragment around one child renders nothing extra. Bad: `<><Row /></>`.
+                '@eslint-react/jsx-no-useless-fragment': 'error',
+                // A literal default prop is a new object each render and breaks memoization. Bad: `({ items = [] }: Props)`.
+                '@eslint-react/no-unstable-default-props': 'error',
+                // State synced from props in an effect renders one frame stale. Bad: `useEffect(() => setFullName(first + last), [first, last])`.
+                'react-hooks/no-deriving-state-in-effects': 'error',
+                // Off: memo-dependencies and exhaustive-effect-dependencies check the same arrays with the compiler's analysis, so one missing dependency would be reported twice.
+                'react-hooks/exhaustive-deps': 'off',
+                // The compiler's dependency check for memos: missing and unused deps. Bad: `useMemo(() => a + b, [a])`.
+                'react-hooks/memo-dependencies': 'error',
+                // The same check for effects; plugin 7.1.1 ships it inert, so `environment` turns it on. Bad: `useEffect(() => log(id), [])`.
+                'react-hooks/exhaustive-effect-dependencies': ['error', { environment: { validateExhaustiveEffectDependencies: 'all' } }],
+                // `{count && <Badge />}` renders `0`, which crashes React Native outside `<Text>`. Bad: `{items.length && <List />}`.
+                '@hypersolid-dev/boolean-guard': 'error',
+                // Styled JSX built in a component body is a component without a name. Bad: `const header = <View style={s.header}>…</View>`.
+                '@hypersolid-dev/no-markup-variable': 'error',
+                // A `use*Effect` hook takes its callback first, like `useEffect`. Bad: `useFocusEffect(deps, () => …)`.
+                '@hypersolid-dev/effect-takes-callback': 'error',
+                // A `useCallback` with empty deps that captures nothing is a module-level function. Bad: `useCallback(() => track('open'), [])`.
+                '@hypersolid-dev/no-unnecessary-use-callback': 'error',
+                // A component forwards the event; the caller builds the payload. Bad: `onPress={() => onSelect(item.id)}` inside `Row`.
+                '@hypersolid-dev/no-callback-payload': 'error',
+                // A comment on a type member is JSDoc, the form editors show. Bad: `// The title\ntitle: string` in a props type.
+                '@hypersolid-dev/jsdoc-for-props': 'error',
             },
         },
         {
             name: '@hypersolid-dev/react/tests',
             files: TEST_FILES,
             rules: {
+                // Off: tests build markup and callbacks inline by design. Bad: `const tree = <Row />` in a test reported.
+                '@hypersolid-dev/boolean-guard': 'off',
+                '@hypersolid-dev/no-markup-variable': 'off',
+                '@hypersolid-dev/effect-takes-callback': 'off',
+                '@hypersolid-dev/no-unnecessary-use-callback': 'off',
+                '@hypersolid-dev/no-callback-payload': 'off',
                 // Off: a mocked hook keeps the `use` name of the hook it replaces. Bad: `const useUser = () => fakeUser` in a mock.
                 '@eslint-react/no-unnecessary-use-prefix': 'off',
             },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hypersolid-dev/eslint-config",
-  "version": "3.0.0",
+  "version": "5.0.0",
   "description": "Shared ESLint flat config for Hypersolid TypeScript projects",
   "license": "MIT",
   "keywords": [
@@ -73,10 +73,11 @@
     "@typescript-eslint/types": "^8.72.1",
     "@typescript-eslint/utils": "^8.72.1",
     "eslint-import-resolver-typescript": "^4.4.5",
+    "eslint-plugin-expo": "^1.2.1",
     "eslint-plugin-import-x": "^4.17.1",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-no-secrets": "^2.3.3",
-    "eslint-plugin-react-hooks": "^7.1.1",
+    "eslint-plugin-react-hooks": "7.1.1",
     "eslint-plugin-unicorn": "^79.0.0",
     "globals": "^17.13.0",
     "typescript-eslint": "^8.72.1"