@ethlete/eslint-plugin 0.1.0-next.8 → 1.0.0-next.11

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # Changelog
 
+## 1.0.0-next.11
+
+### Major Changes
+
+- [#3016](https://github.com/ethlete-io/ethdk/pull/3016) [`396bdfb`](https://github.com/ethlete-io/ethdk/commit/396bdfb50dc51d2de0156dd7b7cc0ae3b21dfe9b) Thanks [@github-actions](https://github.com/apps/github-actions)! - Remove the `no-public-property` rule. It contradicted `template-member-accessibility`, which requires an explicit `public` modifier on surface members — the explicit-public style is the intended one. The rule was never part of the `recommended` config; if you enabled `ethlete/no-public-property` manually, drop it from your ESLint config.
+
+## 0.1.0-next.10
+
+### Minor Changes
+
+- [`4e9f2b4`](https://github.com/ethlete-io/ethdk/commit/4e9f2b4d12335fafef192350aef8ffc584996a91) Thanks [@TomTomB](https://github.com/TomTomB)! - Make the OnPush change detection rules Angular-version aware. Since OnPush is the default from Angular 22, declaring it is now redundant:
+  - Add `no-redundant-on-push-change-detection`, which flags and auto-fixes explicit `changeDetection: ChangeDetectionStrategy.OnPush` on `@Component`, and removes the now-unused `ChangeDetectionStrategy` import when it is no longer referenced. Active on Angular >= 22.
+  - `require-on-push-change-detection` now only applies on Angular <= 21, where OnPush is opt-in.
+
+  Both rules resolve the workspace's Angular major version automatically (overridable via `settings.ethlete.angularMajor`) and stay inert when they don't apply, so exactly one of them is ever active for a given Angular version.
+
+## 0.1.0-next.9
+
+### Patch Changes
+
+- [`b323ef6`](https://github.com/ethlete-io/ethdk/commit/b323ef66130d196e5c893e844d50ecfc85487373) Thanks [@TomTomB](https://github.com/TomTomB)! - `class-member-order`: recognize custom `injectXyz()` helper functions (not just the raw `inject()` call) as inject-group members, so they're required to be declared before inputs/outputs/queries/properties like other injected dependencies.
+
 ## 0.1.0-next.8
 
 ### Minor Changes

package/README.md

@@ -5,7 +5,7 @@ ESLint plugin with custom rules and shareable flat configs for the Ethlete codin
 ## Installation
 
 ```bash
-npm install --save-dev @ethlete/eslint-plugin
+yarn add --dev @ethlete/eslint-plugin
 ```
 
 ## Usage
@@ -17,9 +17,10 @@ import ethlete from '@ethlete/eslint-plugin';
 export default [...ethlete.configs.recommended];
 ```
 
-## Rules
+## Documentation
 
-| Rule                             | Description                                                                                     |
-| -------------------------------- | ----------------------------------------------------------------------------------------------- |
-| `ethlete/no-inject-chain`        | Disallows `inject(X).member` chaining — use a `const` instead                                   |
-| `ethlete/no-trivial-return-type` | Disallows explicit `void`, `boolean`, `string`, `number` return types that TypeScript can infer |
+The full rule reference (all rules, grouped, with defaults and auto-fix support) and
+config documentation live on the docs site:
+
+- [Overview & usage](https://ethlete-sdk-docs.web.app/eslint/)
+- [Rule reference](https://ethlete-sdk-docs.web.app/eslint/rules)

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@ethlete/eslint-plugin",
-  "version": "0.1.0-next.8",
+  "version": "1.0.0-next.11",
   "license": "MIT",
   "type": "commonjs",
   "main": "./src/index.js",
   "peerDependencies": {
     "@angular-eslint/eslint-plugin-template": ">=21.0.0",
+    "@angular/core": "22.0.5",
     "@typescript-eslint/eslint-plugin": ">=8.0.0",
     "eslint": ">=9.0.0",
     "tslib": "2.8.1",

package/src/configs/recommended.js

@@ -191,6 +191,12 @@ const recommendedTs = {
         message:
           'No barrel imports (index files). Import directly from the source file to avoid breaking lazy loading.',
       },
+      // No on-prefixed method names — name the method after what it does, not that it handles an event
+      {
+        selector: 'MethodDefinition[key.name=/^on[A-Z]/]',
+        message:
+          'No on-prefixed method names. Name the method after what it does (e.g. onLayoutChange -> syncGridItemsWithLayout).',
+      },
     ],
 
     // ── Native DOM globals ──────────────────────────────────────────────────
@@ -344,9 +350,14 @@ const recommendedTs = {
 
     // ── Angular components ──────────────────────────────────────────────────
 
-    // Always use ChangeDetectionStrategy.OnPush
+    // Require ChangeDetectionStrategy.OnPush on Angular <= 21, where it is opt-in
+    // (version-aware: inert on Angular 22+, where OnPush is the default).
     'ethlete/require-on-push-change-detection': 'error',
 
+    // No redundant ChangeDetectionStrategy.OnPush — it is the default since Angular 22
+    // (version-aware: inert on older Angular). Also removes the now-unused import.
+    'ethlete/no-redundant-on-push-change-detection': 'error',
+
     // Always use ViewEncapsulation.None (angular-eslint's use-component-view-encapsulation does the
     // opposite — it disallows None, so we use our own custom rule instead)
     'ethlete/require-view-encapsulation-none': 'error',

package/src/index.js

@@ -22,6 +22,7 @@ const noSubscribeWithBody = require('./rules/no-subscribe-with-body');
 const requireDollarSuffix = require('./rules/require-dollar-suffix');
 const noPipeLogic = require('./rules/no-pipe-logic');
 const enforceRoutingViewNaming = require('./rules/enforce-routing-view-naming');
+const noRedundantOnPushChangeDetection = require('./rules/no-redundant-on-push-change-detection');
 const requireOnPushChangeDetection = require('./rules/require-on-push-change-detection');
 const requireViewEncapsulationNone = require('./rules/require-view-encapsulation-none');
 const noLegacyAngularDecorators = require('./rules/no-legacy-angular-decorators');
@@ -29,7 +30,6 @@ const noAngularSeoServices = require('./rules/no-angular-seo-services');
 const preferCloneEqual = require('./rules/prefer-clone-equal');
 const noDocumentCookie = require('./rules/no-document-cookie');
 const injectMemberAccessibility = require('./rules/inject-member-accessibility');
-const noPublicProperty = require('./rules/no-public-property');
 const noRedundantInternal = require('./rules/no-redundant-internal');
 const templateMemberAccessibility = require('./rules/template-member-accessibility');
 const noAngularRouterApi = require('./rules/no-angular-router-api');
@@ -78,6 +78,7 @@ const plugin = {
     'require-dollar-suffix': requireDollarSuffix,
     'no-pipe-logic': noPipeLogic,
     'enforce-routing-view-naming': enforceRoutingViewNaming,
+    'no-redundant-on-push-change-detection': noRedundantOnPushChangeDetection,
     'require-on-push-change-detection': requireOnPushChangeDetection,
     'require-view-encapsulation-none': requireViewEncapsulationNone,
     'no-legacy-angular-decorators': noLegacyAngularDecorators,
@@ -85,7 +86,6 @@ const plugin = {
     'prefer-clone-equal': preferCloneEqual,
     'no-document-cookie': noDocumentCookie,
     'inject-member-accessibility': injectMemberAccessibility,
-    'no-public-property': noPublicProperty,
     'no-redundant-internal': noRedundantInternal,
     'template-member-accessibility': templateMemberAccessibility,
     'no-angular-router-api': noAngularRouterApi,

package/src/rules/class-member-order.js

@@ -81,6 +81,18 @@ const isPropertyInitializedWith = (node, apiNames) => {
   return apiName !== null && apiNames.has(apiName);
 };
 
+const INJECT_HELPER_NAME_PATTERN = /^inject[A-Z]/;
+
+/**
+ * @param {any} node
+ */
+const isPropertyInitializedWithInject = (node) => {
+  if (node.type !== 'PropertyDefinition') return false;
+
+  const apiName = getCallRootName(node.value);
+  return apiName !== null && (apiName === 'inject' || INJECT_HELPER_NAME_PATTERN.test(apiName));
+};
+
 /**
  * @param {any} node
  * @returns {TMemberGroup | null}
@@ -89,7 +101,7 @@ const getMemberGroup = (node) => {
   if (node.static) return null;
 
   if (node.type === 'PropertyDefinition') {
-    if (isPropertyInitializedWith(node, new Set(['inject']))) {
+    if (isPropertyInitializedWithInject(node)) {
       return 'inject';
     }
 

package/src/rules/no-redundant-on-push-change-detection.js

@@ -0,0 +1,237 @@
+// @ts-check
+'use strict';
+
+/**
+ * Disallow explicit `changeDetection: ChangeDetectionStrategy.OnPush` on
+ * `@Component` decorators. Since Angular 22, OnPush is the default change
+ * detection strategy, so declaring it is redundant noise.
+ *
+ * The rule is version-aware: it only activates when the workspace's installed
+ * Angular is v22 or newer (or when the version cannot be determined). On older
+ * Angular versions — where OnPush is NOT the default — it stays silent so that
+ * removing it would not change behaviour.
+ *
+ * BAD (Angular >= 22):
+ *   @Component({ selector: 'et-x', template: '', changeDetection: ChangeDetectionStrategy.OnPush })
+ *
+ * GOOD (Angular >= 22):
+ *   @Component({ selector: 'et-x', template: '' })
+ */
+
+const REQUIRED_MAJOR = 22;
+
+/** @type {number | null | undefined} */
+let cachedAngularMajor;
+
+/**
+ * Detect the workspace's installed Angular major version. Cached across files.
+ *
+ * @returns {number | null} major version, or null when it cannot be determined
+ */
+const detectAngularMajor = () => {
+  if (cachedAngularMajor !== undefined) return cachedAngularMajor;
+
+  try {
+    const pkg = require('@angular/core/package.json');
+    const major = Number.parseInt(String(pkg.version).split('.')[0], 10);
+    cachedAngularMajor = Number.isNaN(major) ? null : major;
+  } catch {
+    cachedAngularMajor = null;
+  }
+
+  return cachedAngularMajor;
+};
+
+/**
+ * Resolve the Angular major version to gate on. An explicit
+ * `settings.ethlete.angularMajor` wins over auto-detection — handy for
+ * pinning behaviour and for tests.
+ *
+ * @param {import('eslint').Rule.RuleContext} context
+ * @returns {number | null}
+ */
+const getAngularMajor = (context) => {
+  const settings = /** @type {any} */ (context.settings);
+  const override = settings?.ethlete?.angularMajor;
+  if (typeof override === 'number') return override;
+
+  return detectAngularMajor();
+};
+
+/**
+ * @param {import('estree').Property['key']} key
+ */
+const getPropertyName = (key) => {
+  if (key.type === 'Identifier') return key.name;
+  if (key.type === 'Literal' && typeof key.value === 'string') return key.value;
+  return null;
+};
+
+/**
+ * @param {import('eslint').Rule.Node} node
+ */
+const isComponentDecorator = (node) => {
+  const decorator = /** @type {any} */ (node);
+  if (decorator.type !== 'Decorator') return false;
+
+  const expression = decorator.expression;
+  if (expression.type === 'CallExpression') {
+    return expression.callee.type === 'Identifier' && expression.callee.name === 'Component';
+  }
+
+  return expression.type === 'Identifier' && expression.name === 'Component';
+};
+
+/**
+ * @param {any} value
+ */
+const isOnPushValue = (value) =>
+  value.type === 'MemberExpression' &&
+  value.object.type === 'Identifier' &&
+  value.object.name === 'ChangeDetectionStrategy' &&
+  value.property.type === 'Identifier' &&
+  value.property.name === 'OnPush';
+
+/**
+ * Range that removes a property together with the comma that joins it to its
+ * siblings (leading comma when it is the last property, otherwise trailing).
+ *
+ * @param {import('eslint').SourceCode} sourceCode
+ * @param {any} metadata
+ * @param {any} property
+ */
+const getPropertyRemovalRange = (sourceCode, metadata, property) => {
+  const properties = metadata.properties.filter((entry) => entry.type === 'Property');
+  const index = properties.indexOf(property);
+  const openingBrace = sourceCode.getFirstToken(metadata);
+  const closingBrace = sourceCode.getLastToken(metadata);
+
+  if (!openingBrace || !closingBrace) return property.range;
+  if (properties.length === 1) return [openingBrace.range[1], closingBrace.range[0]];
+  if (index < properties.length - 1) return [property.range[0], properties[index + 1].range[0]];
+
+  return [properties[index - 1].range[1], property.range[1]];
+};
+
+/**
+ * Range that removes a single named import specifier together with its comma.
+ *
+ * @param {import('eslint').SourceCode} sourceCode
+ * @param {any} importNode
+ * @param {any} specifier
+ */
+const getSpecifierRemovalRange = (sourceCode, importNode, specifier) => {
+  const named = importNode.specifiers.filter((entry) => entry.type === 'ImportSpecifier');
+  const index = named.indexOf(specifier);
+
+  // Sole specifier of the whole import — drop the entire declaration.
+  if (importNode.specifiers.length === 1) return importNode.range;
+  if (index < named.length - 1) return [specifier.range[0], named[index + 1].range[0]];
+
+  return [named[index - 1].range[1], specifier.range[1]];
+};
+
+/**
+ * True when every reference of the `ChangeDetectionStrategy` binding is a
+ * `changeDetection: ChangeDetectionStrategy.OnPush` property value — i.e.
+ * removing those properties leaves the import unused and safe to drop.
+ *
+ * @param {import('eslint').Scope.Reference} reference
+ */
+const isOnPushChangeDetectionReference = (reference) => {
+  const identifier = /** @type {any} */ (reference.identifier);
+  const member = identifier.parent;
+  if (!member || member.type !== 'MemberExpression' || member.object !== identifier) return false;
+  if (member.property.type !== 'Identifier' || member.property.name !== 'OnPush') return false;
+
+  const property = member.parent;
+  if (!property || property.type !== 'Property' || property.value !== member) return false;
+
+  return getPropertyName(property.key) === 'changeDetection';
+};
+
+/** @type {import('eslint').Rule.RuleModule} */
+const noRedundantOnPushChangeDetection = {
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description:
+        'Disallow redundant `changeDetection: ChangeDetectionStrategy.OnPush`. OnPush is the default since Angular 22.',
+    },
+    fixable: 'code',
+    schema: [],
+    messages: {
+      redundant:
+        '`changeDetection: ChangeDetectionStrategy.OnPush` is redundant. OnPush is the default change detection strategy since Angular 22.',
+      redundantImport:
+        'Remove the now-unused `ChangeDetectionStrategy` import. OnPush is the default change detection strategy since Angular 22.',
+    },
+  },
+  create(context) {
+    // Only enforce on Angular >= 22, where OnPush is the default. Stay silent on
+    // older versions (removing it there would change behaviour) — but enforce
+    // when the version is unknown, since this workspace targets modern Angular.
+    const angularMajor = getAngularMajor(context);
+    if (angularMajor !== null && angularMajor < REQUIRED_MAJOR) return {};
+
+    const sourceCode = context.sourceCode;
+    /** @type {any} */
+    let changeDetectionSpecifier = null;
+
+    return {
+      Decorator(node) {
+        if (!isComponentDecorator(node)) return;
+
+        const expression = /** @type {any} */ (node).expression;
+        if (expression.type !== 'CallExpression' || expression.arguments.length === 0) return;
+
+        const metadata = expression.arguments[0];
+        if (!metadata || metadata.type !== 'ObjectExpression') return;
+
+        const property = metadata.properties.find(
+          (entry) => entry.type === 'Property' && getPropertyName(entry.key) === 'changeDetection',
+        );
+        if (!property || !isOnPushValue(property.value)) return;
+
+        context.report({
+          node: property,
+          messageId: 'redundant',
+          fix: (fixer) => fixer.replaceTextRange(getPropertyRemovalRange(sourceCode, metadata, property), ''),
+        });
+      },
+
+      ImportDeclaration(node) {
+        if (node.source.value !== '@angular/core') return;
+
+        for (const specifier of node.specifiers) {
+          if (
+            specifier.type === 'ImportSpecifier' &&
+            specifier.imported.type === 'Identifier' &&
+            specifier.imported.name === 'ChangeDetectionStrategy'
+          ) {
+            changeDetectionSpecifier = specifier;
+            return;
+          }
+        }
+      },
+
+      'Program:exit'() {
+        if (!changeDetectionSpecifier) return;
+
+        const [variable] = sourceCode.getDeclaredVariables(changeDetectionSpecifier);
+        if (!variable || variable.references.length === 0) return;
+        if (!variable.references.every(isOnPushChangeDetectionReference)) return;
+
+        const importNode = changeDetectionSpecifier.parent;
+        context.report({
+          node: changeDetectionSpecifier,
+          messageId: 'redundantImport',
+          fix: (fixer) =>
+            fixer.replaceTextRange(getSpecifierRemovalRange(sourceCode, importNode, changeDetectionSpecifier), ''),
+        });
+      },
+    };
+  },
+};
+
+module.exports = noRedundantOnPushChangeDetection;

package/src/rules/require-on-push-change-detection.js

@@ -3,6 +3,49 @@
 
 const COMPONENT_ORDER = ['selector', 'template', 'styleUrl', 'encapsulation', 'changeDetection'];
 
+// OnPush became the default change detection strategy in Angular 22, so from
+// v22 onward it must NOT be declared (see no-redundant-on-push-change-detection).
+// This rule therefore only applies to older Angular, where OnPush is opt-in.
+const MAX_MAJOR = 21;
+
+/** @type {number | null | undefined} */
+let cachedAngularMajor;
+
+/**
+ * Detect the workspace's installed Angular major version. Cached across files.
+ *
+ * @returns {number | null} major version, or null when it cannot be determined
+ */
+const detectAngularMajor = () => {
+  if (cachedAngularMajor !== undefined) return cachedAngularMajor;
+
+  try {
+    const pkg = require('@angular/core/package.json');
+    const major = Number.parseInt(String(pkg.version).split('.')[0], 10);
+    cachedAngularMajor = Number.isNaN(major) ? null : major;
+  } catch {
+    cachedAngularMajor = null;
+  }
+
+  return cachedAngularMajor;
+};
+
+/**
+ * Resolve the Angular major version to gate on. An explicit
+ * `settings.ethlete.angularMajor` wins over auto-detection — handy for
+ * pinning behaviour and for tests.
+ *
+ * @param {import('eslint').Rule.RuleContext} context
+ * @returns {number | null}
+ */
+const getAngularMajor = (context) => {
+  const settings = /** @type {any} */ (context.settings);
+  const override = settings?.ethlete?.angularMajor;
+  if (typeof override === 'number') return override;
+
+  return detectAngularMajor();
+};
+
 /**
  * @param {import('estree').Property['key']} key
  */
@@ -204,6 +247,12 @@ const requireOnPushChangeDetection = {
     schema: [],
   },
   create(context) {
+    // Only enforce on Angular <= 21, where OnPush is opt-in. On v22+ (or when
+    // the version is unknown — this workspace targets modern Angular) stay
+    // silent so no-redundant-on-push-change-detection owns the metadata.
+    const angularMajor = getAngularMajor(context);
+    if (angularMajor === null || angularMajor > MAX_MAJOR) return {};
+
     const sourceCode = context.sourceCode;
 
     /**

package/src/rules/no-public-property.js

@@ -1,85 +0,0 @@
-// @ts-check
-'use strict';
-
-const { getMemberName, isReferencedFromTemplateOrHost } = require('./internals/angular-member-visibility');
-
-/**
- * @param {any} node
- */
-const isInjectCall = (node) => {
-  if (!node || node.type !== 'CallExpression') return false;
-  return node.callee.type === 'Identifier' && node.callee.name === 'inject';
-};
-
-/** @type {import('eslint').Rule.RuleModule} */
-const noPublicProperty = {
-  meta: {
-    type: 'problem',
-    docs: {
-      description:
-        'Disallow explicit public on class properties, except for injected members that intentionally expose an external API.',
-      recommended: true,
-    },
-    fixable: 'code',
-    schema: [],
-    messages: {
-      noPublicProperty:
-        'No public keyword on class properties. The only exception is an injected member that intentionally exposes an external API.',
-      shouldBeProtected:
-        'Member `{{name}}` should be protected instead of public because it is referenced from a template or host binding.',
-    },
-  },
-  create(context) {
-    /**
-     * @param {any} node
-     */
-    const removePublicFix = (node) => {
-      const publicToken = context.sourceCode.getFirstToken(node, (token) => token.value === 'public');
-      const nextToken = publicToken ? context.sourceCode.getTokenAfter(publicToken) : null;
-      if (!publicToken || !nextToken) return null;
-
-      return (fixer) => fixer.removeRange([publicToken.range[0], nextToken.range[0]]);
-    };
-
-    /**
-     * @param {any} node
-     */
-    const replacePublicWithProtectedFix = (node) => {
-      const publicToken = context.sourceCode.getFirstToken(node, (token) => token.value === 'public');
-      if (!publicToken) return null;
-
-      return (fixer) => fixer.replaceText(publicToken, 'protected');
-    };
-
-    return {
-      PropertyDefinition(node) {
-        if (node.accessibility !== 'public') return;
-        if (isInjectCall(node.value)) return;
-
-        const classNode = node.parent && node.parent.type === 'ClassBody' ? node.parent.parent : null;
-        const memberName = getMemberName(node);
-        const isTemplateVisible =
-          classNode && memberName ? isReferencedFromTemplateOrHost(classNode, memberName, context) : false;
-
-        if (isTemplateVisible) {
-          context.report({
-            node,
-            messageId: 'shouldBeProtected',
-            data: { name: memberName },
-            fix: replacePublicWithProtectedFix(node),
-          });
-
-          return;
-        }
-
-        context.report({
-          node,
-          messageId: 'noPublicProperty',
-          fix: removePublicFix(node),
-        });
-      },
-    };
-  },
-};
-
-module.exports = noPublicProperty;