ngx-devkit-builders 1.3.3 → 2.0.1

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2022 - 2024 Celtian
+Copyright (c) 2022 - 2026 Celtian
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -13,7 +13,7 @@
 
 This package contains Architect builders used to build and test Angular applications and libraries.
 
-> ✓ _Angular 18 compatible_
+> ✓ _Angular 21 compatible_
 
 ## 🚀 Builders
 
@@ -22,6 +22,7 @@ This package contains Architect builders used to build and test Angular applicat
 | [version](./src/version/README.md)                   | Create build information file     |
 | [robots](./src/robots/README.md)                     | Create simplified robots.txt file |
 | [copy-environment](./src/copy-environment/README.md) | Copy environment file             |
+| [sort-imports](./src/sort-imports/README.md)         | Sort imports of components        |
 
 _More builders can be added in the future._
 
@@ -29,12 +30,13 @@ _More builders can be added in the future._
 
 | Angular | ngx-devkit-builders | Install                          |
 | ------- | ------------------- | -------------------------------- |
-| >= 17   | 1.x                 | `yarn add ngx-devkit-builders`   |
+| >= 21   | 2.x                 | `yarn add ngx-devkit-builders`   |
+| >= 17   | 1.x                 | `yarn add ngx-devkit-builders@1` |
 | >= 16   | 0.x                 | `yarn add ngx-devkit-builders@0` |
 
 ## 🪪 License
 
-Copyright © 2022 - 2024 [Dominik Hladik](https://github.com/Celtian)
+Copyright © 2022 - 2026 [Dominik Hladik](https://github.com/Celtian)
 
 All contents are licensed under the [MIT license].
 

package/builders.json

@@ -14,6 +14,11 @@
       "description": "Create build information file",
       "implementation": "./version",
       "schema": "./version/schema.json"
+    },
+    "sort-imports": {
+      "description": "Sorts imports in Angular components and directives using AST analysis",
+      "implementation": "./dist/sort-imports",
+      "schema": "./dist/sort-imports/schema.json"
     }
   }
 }

package/copy-environment/index.js

@@ -3,16 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const architect_1 = require("@angular-devkit/architect");
 const core_1 = require("@angular-devkit/core");
 const fs_extra_1 = require("fs-extra");
-async function copyFiles({ sourceFile, targetFile, overwrite }) {
-    return new Promise((resolve, reject) => {
-        (0, fs_extra_1.copy)(sourceFile, targetFile, { overwrite }, () => {
-            reject();
-        });
-        resolve();
-    });
-}
 exports.default = (0, architect_1.createBuilder)(async ({ verbose, source, target, overwrite }, ctx) => {
-    ctx.logger.info('🚧 Creating robots file…');
+    ctx.logger.info('🚧 Copying environment…');
     const projectMetadata = await ctx.getProjectMetadata(ctx.target.project);
     if (projectMetadata.projectType !== 'application') {
         ctx.logger.error('❌ Project must be type of application');
@@ -30,11 +22,7 @@ exports.default = (0, architect_1.createBuilder)(async ({ verbose, source, targe
     const sourceFile = `${environmentsFolder}/${source}`;
     const targetFile = `${environmentsFolder}/${target}`;
     try {
-        await copyFiles({
-            sourceFile,
-            targetFile,
-            overwrite,
-        });
+        await (0, fs_extra_1.copy)(sourceFile, targetFile, { overwrite });
         if (overwrite) {
             ctx.logger.info(`✔️  Environment replaced in "${targetFile}"`);
         }

package/copy-environment/schema.json

@@ -1,5 +1,5 @@
 {
-  "$schema": "http://json-schema.org/schema",
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
   "type": "object",
   "properties": {
     "source": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-devkit-builders",
-  "version": "1.3.3",
+  "version": "2.0.1",
   "author": {
     "name": "Dominik Hladík",
     "email": "dominik.hladik@seznam.cz",
@@ -12,9 +12,10 @@
   "builders": "builders.json",
   "scripts": {},
   "dependencies": {
-    "@angular-devkit/architect": "^0.1802.9",
-    "@angular-devkit/core": "^18.2.9",
-    "fs-extra": "^11.2.0"
+    "@angular-devkit/architect": "^0.2100.4",
+    "@angular-devkit/core": "^21.0.4",
+    "@schematics/angular": "^21.0.4",
+    "fs-extra": "^11.3.3"
   },
   "devDependencies": {},
   "homepage": "https://github.com/Celtian/ngx-devkit-builders#readme",
@@ -32,14 +33,14 @@
     "url": "https://github.com/Celtian/ngx-devkit-builders/issues"
   },
   "engines": {
-    "node": ">=12",
+    "node": ">=20",
     "npm": "please-use-yarn"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
   "peerDependencies": {
-    "@angular/core": ">=12",
-    "@angular/cli": ">=12"
+    "@angular/core": ">=21",
+    "@angular/cli": ">=21"
   }
 }

package/robots/schema.json

@@ -1,5 +1,5 @@
 {
-  "$schema": "http://json-schema.org/schema",
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
   "type": "object",
   "properties": {
     "allow": {

package/sort-imports/index.js

@@ -0,0 +1,215 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const architect_1 = require("@angular-devkit/architect");
+const ast_utils_1 = require("@schematics/angular/utility/ast-utils");
+const fs_1 = require("fs");
+const path_1 = require("path");
+const ts = require("typescript");
+const walkDirectory = (dir, files = []) => {
+    const items = (0, fs_1.readdirSync)(dir, { withFileTypes: true });
+    for (const item of items) {
+        const fullPath = (0, path_1.join)(dir, item.name);
+        if (item.isDirectory()) {
+            walkDirectory(fullPath, files);
+        }
+        else if (item.isFile() &&
+            item.name.endsWith('.ts') &&
+            !item.name.endsWith('.spec.ts') &&
+            !item.name.endsWith('.d.ts')) {
+            files.push(fullPath);
+        }
+    }
+    return files;
+};
+const isAngularComponentOrDirective = (filePath, includeDirectives) => {
+    try {
+        const content = (0, fs_1.readFileSync)(filePath, 'utf8');
+        const sourceFile = ts.createSourceFile(filePath, content, ts.ScriptTarget.Latest, true);
+        const componentDecorators = (0, ast_utils_1.getDecoratorMetadata)(sourceFile, 'Component', '@angular/core');
+        if (componentDecorators.length > 0) {
+            return true;
+        }
+        if (includeDirectives) {
+            const directiveDecorators = (0, ast_utils_1.getDecoratorMetadata)(sourceFile, 'Directive', '@angular/core');
+            return directiveDecorators.length > 0;
+        }
+        return false;
+    }
+    catch {
+        return false;
+    }
+};
+const analyzeComponentImports = (sourceFile) => {
+    const componentImports = [];
+    const visitNode = (node) => {
+        if (ts.isDecorator(node) && ts.isCallExpression(node.expression)) {
+            const callExpr = node.expression;
+            // Check if this is a @Component decorator
+            if (ts.isIdentifier(callExpr.expression) && callExpr.expression.text === 'Component') {
+                if (callExpr.arguments.length > 0) {
+                    const arg = callExpr.arguments[0];
+                    if (ts.isObjectLiteralExpression(arg)) {
+                        // Look for the imports property
+                        for (const property of arg.properties) {
+                            if (ts.isPropertyAssignment(property) &&
+                                ts.isIdentifier(property.name) &&
+                                property.name.text === 'imports') {
+                                if (ts.isArrayLiteralExpression(property.initializer)) {
+                                    // Extract import names from the array
+                                    for (const element of property.initializer.elements) {
+                                        if (ts.isIdentifier(element)) {
+                                            componentImports.push(element.text);
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        ts.forEachChild(node, visitNode);
+    };
+    visitNode(sourceFile);
+    return componentImports;
+};
+const sortComponentImports = (imports) => {
+    // Sort imports alphabetically
+    return [...imports].sort();
+};
+const processFile = (filePath, options) => {
+    const content = (0, fs_1.readFileSync)(filePath, 'utf8');
+    const sourceFile = ts.createSourceFile(filePath, content, ts.ScriptTarget.Latest, true);
+    const componentName = (0, path_1.basename)(filePath, '.ts');
+    const importsArray = analyzeComponentImports(sourceFile);
+    const sortedImports = sortComponentImports(importsArray);
+    // Check if imports need to be reordered
+    const hasChanges = JSON.stringify(importsArray) !== JSON.stringify(sortedImports);
+    if (hasChanges && !options.dryRun) {
+        // Find and replace the imports array in the component decorator
+        const updatedContent = updateComponentImports(content, sortedImports);
+        (0, fs_1.writeFileSync)(filePath, updatedContent, 'utf8');
+    }
+    return {
+        filePath,
+        componentName,
+        importsArray,
+        sortedImports,
+        hasChanges,
+    };
+};
+const updateComponentImports = (content, sortedImports) => {
+    const sourceFile = ts.createSourceFile('temp.ts', content, ts.ScriptTarget.Latest, true);
+    let updatedContent = content;
+    const visitNode = (node) => {
+        if (ts.isDecorator(node) && ts.isCallExpression(node.expression)) {
+            const callExpr = node.expression;
+            if (ts.isIdentifier(callExpr.expression) && callExpr.expression.text === 'Component') {
+                if (callExpr.arguments.length > 0) {
+                    const arg = callExpr.arguments[0];
+                    if (ts.isObjectLiteralExpression(arg)) {
+                        for (const property of arg.properties) {
+                            if (ts.isPropertyAssignment(property) &&
+                                ts.isIdentifier(property.name) &&
+                                property.name.text === 'imports') {
+                                if (ts.isArrayLiteralExpression(property.initializer)) {
+                                    // Replace the array content
+                                    const start = property.initializer.getStart(sourceFile);
+                                    const end = property.initializer.getEnd();
+                                    const newImportsArray = `[${sortedImports.join(', ')}]`;
+                                    updatedContent = content.substring(0, start) + newImportsArray + content.substring(end);
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        ts.forEachChild(node, visitNode);
+    };
+    visitNode(sourceFile);
+    return updatedContent;
+};
+const outputResults = (analyses, options, context) => {
+    const changedFiles = analyses.filter((a) => a.hasChanges);
+    const unchangedFiles = analyses.filter((a) => !a.hasChanges);
+    context.logger.info('\n📋 COMPONENT IMPORTS SORTING ANALYSIS');
+    context.logger.info('━'.repeat(80));
+    if (options.dryRun) {
+        context.logger.info('🔍 DRY RUN MODE - No files were modified');
+    }
+    context.logger.info(`📊 Summary: ${analyses.length} files analyzed`);
+    context.logger.info(`✅ ${unchangedFiles.length} files already have sorted imports`);
+    context.logger.info(`🔄 ${changedFiles.length} files ${options.dryRun ? 'would be' : 'were'} updated`);
+    if (options.verbose && changedFiles.length > 0) {
+        context.logger.info(`📝 Files ${options.dryRun ? 'that would be' : 'that were'} updated:`);
+        context.logger.info('─'.repeat(80));
+        context.logger.info('Component Name'.padEnd(35) + 'Sorted Imports');
+        context.logger.info('─'.repeat(80));
+        changedFiles.forEach((analysis) => {
+            const componentName = analysis.componentName.length > 32 ? analysis.componentName.substring(0, 29) + '...' : analysis.componentName;
+            const sortedImports = `[${analysis.sortedImports.join(', ')}]`;
+            context.logger.info(componentName.padEnd(35) + sortedImports);
+        });
+        context.logger.info('─'.repeat(80));
+    }
+    if (options.verbose && unchangedFiles.length > 0) {
+        context.logger.info('✨ Files with already sorted imports:');
+        context.logger.info('─'.repeat(80));
+        context.logger.info('Component Name'.padEnd(35) + 'Current Imports');
+        context.logger.info('─'.repeat(80));
+        unchangedFiles.forEach((analysis) => {
+            const componentName = analysis.componentName.length > 32 ? analysis.componentName.substring(0, 29) + '...' : analysis.componentName;
+            if (analysis.importsArray.length > 0) {
+                const imports = `[${analysis.importsArray.join(', ')}]`;
+                context.logger.info(componentName.padEnd(35) + imports);
+            }
+            else {
+                const noImportsText = 'No imports array found';
+                context.logger.info(componentName.padEnd(35) + noImportsText);
+            }
+        });
+        context.logger.info('─'.repeat(80));
+    }
+    context.logger.info('━'.repeat(80));
+};
+exports.default = (0, architect_1.createBuilder)(async (options, context) => {
+    try {
+        const projectRoot = context.target?.project
+            ? (0, path_1.join)(context.workspaceRoot, 'projects', context.target.project)
+            : context.workspaceRoot;
+        const srcDir = (0, path_1.join)(projectRoot, 'src');
+        if (!(0, fs_1.statSync)(srcDir).isDirectory()) {
+            context.logger.error(`Source directory not found: ${srcDir}`);
+            return { success: false };
+        }
+        // Find all TypeScript files recursively
+        const allTsFiles = walkDirectory(srcDir);
+        // Filter to only component and directive files
+        const targetFiles = allTsFiles.filter((file) => isAngularComponentOrDirective(file, options.includeDirectives));
+        if (targetFiles.length === 0) {
+            context.logger.info('No Angular components or directives found.');
+            return { success: true };
+        }
+        // Process each file
+        const analyses = [];
+        for (const filePath of targetFiles) {
+            try {
+                const analysis = processFile(filePath, options);
+                analyses.push(analysis);
+            }
+            catch (error) {
+                const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+                context.logger.warn(`Failed to process ${filePath}: ${errorMessage}`);
+            }
+        }
+        // Output results
+        outputResults(analyses, options, context);
+        return { success: true };
+    }
+    catch (err) {
+        const errorMessage = err instanceof Error ? err.message : 'Unknown error';
+        context.logger.error('Error sorting imports: ' + errorMessage);
+        return { success: false };
+    }
+});

package/sort-imports/schema.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "type": "object",
+  "properties": {
+    "dryRun": {
+      "description": "Run the builder without making any changes to files",
+      "type": "boolean",
+      "default": false
+    },
+    "verbose": {
+      "description": "Extended logging output",
+      "type": "boolean",
+      "default": false
+    },
+    "includeDirectives": {
+      "description": "Include Angular directives in addition to components",
+      "type": "boolean",
+      "default": true
+    }
+  }
+}

package/version/schema.json

@@ -1,5 +1,5 @@
 {
-  "$schema": "http://json-schema.org/schema",
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
   "type": "object",
   "properties": {
     "outputFile": {