ci(lint): [WIP] lib local rules setup and bool input transform check

Author: damyanpetev

projects/igniteui-angular/eslint.config.mjs

@@ -2,6 +2,7 @@ import { FlatCompat } from "@eslint/eslintrc";
 import js from "@eslint/js";
 import path from "node:path";
 import { fileURLToPath } from "node:url";
+import localRules from "./rules/index.mjs";
 import rootConfig from "../../eslint.config.mjs";
 // import tseslint from "typescript-eslint";
 // import angular from "angular-eslint";
@@ -18,6 +19,9 @@ export default [
     ...rootConfig,
     {
         files: ["**/*.ts"],
+        plugins: {
+            'igniteui-angular-local': localRules,
+        },
         rules: {
             "@angular-eslint/component-selector": ["error", {
                 type: "element",
@@ -48,6 +52,7 @@ export default [
             }],
 
             "no-debugger": "error",
+            "igniteui-angular-local/boolean-input-transform": ["error"],
         },
     },
     ...compat.extends(

projects/igniteui-angular/rules/README.md

@@ -0,0 +1,11 @@
+## Custom ESLint rules
+
+This folder contains local custom ESLint rules for the Ignite UI for Angular library.
+
+
+### Useful links for development
+
+- [Writing custom ESLint rules with angular-eslint utils](https://github.com/angular-eslint/angular-eslint/blob/main/docs/WRITING_CUSTOM_RULES.md)
+- Working with AST
+    - AST Specification https://typescript-eslint.io/packages/typescript-estree/ast-spec
+    - AST Explorer https://astexplorer.net (pick from the options dropdown)

projects/igniteui-angular/rules/boolean-input-transform.mjs

@@ -0,0 +1,110 @@
+import { ASTUtils, Selectors } from '@angular-eslint/utils';
+// import type { TSESTree } from '@typescript-eslint/utils';
+import { ESLintUtils } from '@typescript-eslint/utils';
+import { TypeFlags } from 'typescript';
+
+// export type Options = [
+//   {
+//     suffixes?: string[];
+//   },
+// ];
+
+// export type MessageIds = 'serviceSuffix';
+
+export const RULE_NAME = 'boolean-input-transform';
+
+/**
+ * Check if a property is of boolean type.
+ * @param {import('@typescript-eslint/utils').TSESTree.PropertyDefinition | import('@typescript-eslint/utils').TSESTree.MethodDefinition} property
+ * @param {import('@typescript-eslint/utils').ParserServicesWithTypeInformation} parserServices
+ * @returns {boolean}
+ */
+function isBooleanProperty(property, parserServices) {
+    let isBoolean = false;
+    let typeAnnotation = null;
+
+    if (property.type === 'MethodDefinition' && (property.kind === 'get' || property.kind === 'set')) {
+        // getter/setter
+        const typeAnnotation = property.value.returnType?.typeAnnotation || property.value.params[0]?.typeAnnotation?.typeAnnotation;
+        isBoolean = typeAnnotation
+            ? typeAnnotation === 'TSBooleanKeyword'
+            : isBooleanType(property, parserServices);
+
+    } else if (property.type === 'PropertyDefinition') {
+        isBoolean = property.typeAnnotation
+            && property.typeAnnotation.typeAnnotation.type === 'TSBooleanKeyword';
+
+        isBoolean ||= property.value
+            && property.value.type === 'Literal'
+            && typeof property.value.value === 'boolean';
+    }
+    return isBoolean;
+}
+
+/**
+ * Type-aware check if a property is of boolean type.
+ * @param {import('@typescript-eslint/utils').TSESTree.Node} node
+ * @param {import('@typescript-eslint/utils').ParserServicesWithTypeInformation} parserServices
+ * @returns {boolean}
+ */
+function isBooleanType(node, parserServices) {
+    const tsNode = parserServices.esTreeNodeToTSNodeMap.get(node);
+    const checker = parserServices.program.getTypeChecker();
+    const type = checker.getTypeAtLocation(tsNode);
+    return (type.flags & TypeFlags.BooleanLike) !== 0;
+}
+
+export const rule = ESLintUtils.RuleCreator.withoutDocs({
+  name: RULE_NAME,
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description:
+        'Require boolean @Input properties to use { transform: booleanAttribute }',
+      recommended: 'error',
+    },
+    schema: [],
+    messages: {
+      missingTransform:
+        'Boolean @Input properties must have { transform: booleanAttribute }.',
+    },
+  },
+  defaultOptions: [],
+  create(context, [ /* options*/ ]) {
+    // const parserServices = ESLintUtils.getParserServices(context);
+    // const checker = parserServices.program.getTypeChecker();
+
+    const ruleOptions = {
+      [Selectors.INPUT_DECORATOR](decorator) {
+        const property = decorator.parent;
+
+        if (!ASTUtils.isPropertyOrMethodDefinition(property)) return;
+
+        const classDeclaration = ASTUtils.getNearestNodeFrom(
+            decorator,
+            ASTUtils.isClassDeclaration,
+        );
+
+
+        let isBoolean = isBooleanProperty(property/*, parserServices*/);
+
+        if (!isBoolean) return;
+
+        const arg = decorator.expression.arguments[0];
+        const hasTransform =
+            arg &&
+            arg.type === 'ObjectExpression' &&
+            arg.properties.some(
+            (p) =>
+                p.key.name === 'transform' &&
+                p.value.name === 'booleanAttribute'
+            );
+
+        if (hasTransform) return;
+
+        context.report({ node: decorator, messageId: 'missingTransform' });
+      },
+    };
+    return ruleOptions;
+  },
+});

projects/igniteui-angular/rules/index.mjs

@@ -0,0 +1,10 @@
+import {
+  rule as booleanInputTransform,
+  RULE_NAME as booleanInputTransformRuleName,
+} from './boolean-input-transform.mjs';
+
+export default {
+  rules: {
+    [booleanInputTransformRuleName]: booleanInputTransform,
+  }
+};