@hubspot/cli 7.7.0-experimental.2 → 7.7.0

package/lib/projects/add/v3AddComponent.js

@@ -0,0 +1,101 @@
+import { commands, lib } from '../../../lang/en.js';
+import { getConfigForPlatformVersion } from '../create/legacy.js';
+import { calculateComponentTemplateChoices, createV3App, } from '../create/v3.js';
+import { PROJECT_WITH_APP } from '../../constants.js';
+import path from 'path';
+import fs from 'fs';
+import { projectAddPromptV3 } from '../../prompts/projectAddPrompt.js';
+import { HUBSPOT_PROJECT_COMPONENTS_GITHUB_PATH, DEFAULT_PROJECT_TEMPLATE_BRANCH, } from '../../constants.js';
+import { updateHsMetaFilesWithAutoGeneratedFields, handleComponentCollision, } from '../components.js';
+import { getProjectMetadata, } from '@hubspot/project-parsing-lib/src/lib/project.js';
+import { AppKey } from '@hubspot/project-parsing-lib/src/lib/constants.js';
+import { cloneGithubRepo } from '@hubspot/local-dev-lib/github';
+import { debugError } from '../../errorHandlers/index.js';
+import { uiLogger } from '../../ui/logger.js';
+import { trackCommandUsage } from '../../usageTracking.js';
+export async function v3AddComponent(args, projectDir, projectConfig, accountId) {
+    uiLogger.log(commands.project.add.creatingComponent(projectConfig.name));
+    const config = await getConfigForPlatformVersion(projectConfig.platformVersion);
+    const { components, parentComponents } = config;
+    if (!components || !components.length) {
+        throw new Error(commands.project.add.error.failedToFetchComponentList);
+    }
+    const projectSrcDirectory = path.join(projectDir, projectConfig.srcDir);
+    const currentProjectMetadata = await getProjectMetadata(projectSrcDirectory);
+    let derivedAuthType;
+    let derivedDistribution;
+    const appsMetadata = currentProjectMetadata.components[AppKey];
+    const shouldCreateApp = appsMetadata.count === 0;
+    if (shouldCreateApp) {
+        const { authType, distribution } = await createV3App(args.auth, args.distribution);
+        derivedDistribution = distribution;
+        derivedAuthType = authType;
+    }
+    else if (appsMetadata.count > appsMetadata.maxCount) {
+        throw new Error(lib.projects.create.errors.exceededMaxNumberOfApps(appsMetadata.maxCount));
+    }
+    else {
+        const apps = appsMetadata.hsMetaFiles.map(appLoc => {
+            try {
+                return JSON.parse(fs.readFileSync(appLoc, 'utf8'));
+            }
+            catch (err) {
+                throw new Error(lib.projects.create.errors.unableToParseAppConfig(appLoc));
+            }
+        });
+        derivedDistribution = apps[0].config?.distribution;
+        derivedAuthType = apps[0].config?.auth?.type;
+    }
+    const componentTemplateChoices = await calculateComponentTemplateChoices(components, derivedAuthType, derivedDistribution, args.derivedAccountId, currentProjectMetadata);
+    const projectAddPromptResponse = await projectAddPromptV3(componentTemplateChoices, args.features);
+    const componentTypes = projectAddPromptResponse.componentTemplate?.map(componentTemplate => componentTemplate.cliSelector || componentTemplate.type);
+    await trackCommandUsage('project-add', {
+        type: componentTypes?.join(','),
+    }, accountId);
+    try {
+        const components = projectAddPromptResponse.componentTemplate?.map((componentTemplate) => {
+            return path.join(projectConfig.platformVersion, componentTemplate.path);
+        }) || [];
+        if (shouldCreateApp) {
+            const parentComponent = parentComponents?.find(possibleParent => {
+                return (possibleParent.type === PROJECT_WITH_APP &&
+                    possibleParent.authType === derivedAuthType &&
+                    possibleParent.distribution === derivedDistribution);
+            });
+            if (parentComponent) {
+                components.push(path.join(projectConfig.platformVersion, parentComponent.path));
+            }
+        }
+        if (components.length === 0) {
+            uiLogger.log(lib.projects.add.nothingAdded);
+            return;
+        }
+        await cloneGithubRepo(HUBSPOT_PROJECT_COMPONENTS_GITHUB_PATH, projectDir, {
+            sourceDir: components,
+            hideLogs: true,
+            branch: DEFAULT_PROJECT_TEMPLATE_BRANCH,
+            handleCollision: handleComponentCollision,
+        });
+        const updatedProjectMetadata = await getProjectMetadata(projectSrcDirectory);
+        const newHsMetaFiles = updatedProjectMetadata.hsMetaFiles.filter(hsMetaFile => !currentProjectMetadata.hsMetaFiles.includes(hsMetaFile));
+        const existingUids = currentProjectMetadata.hsMetaFiles.map(hsMetaFile => {
+            try {
+                const { uid } = JSON.parse(fs.readFileSync(hsMetaFile, 'utf8'));
+                return uid;
+            }
+            catch (err) {
+                return '';
+            }
+        });
+        updateHsMetaFilesWithAutoGeneratedFields(projectConfig.name, newHsMetaFiles, existingUids);
+        uiLogger.success(commands.project.add.success(projectAddPromptResponse.componentTemplate
+            .map(template => `'${template.label}'`)
+            .join(', '), projectAddPromptResponse.componentTemplate.length > 1));
+    }
+    catch (error) {
+        debugError(error);
+        throw new Error(commands.project.add.error.failedToDownloadComponent, {
+            cause: error,
+        });
+    }
+}

package/lib/projects/components.d.ts

@@ -0,0 +1,3 @@
+import { Collision } from '@hubspot/local-dev-lib/types/Archive';
+export declare function handleComponentCollision({ dest, src, collisions }: Collision): void;
+export declare function updateHsMetaFilesWithAutoGeneratedFields(projectName: string, hsMetaFilePaths: string[], existingUids?: string[]): void;

package/lib/projects/components.js

@@ -0,0 +1,102 @@
+import path from 'path';
+import fs from 'fs';
+import { coerceToValidUid, metafileExtension, } from '@hubspot/project-parsing-lib';
+import { uiLogger } from '../ui/logger.js';
+import { AppKey } from '@hubspot/project-parsing-lib/src/lib/constants.js';
+import { lib } from '../../lang/en.js';
+// Handles a collision between component source files
+export function handleComponentCollision({ dest, src, collisions }) {
+    const hsMetaFiles = [];
+    const packageJsonFiles = [];
+    const sourceFiles = [];
+    collisions.forEach(collision => {
+        if (collision.endsWith(metafileExtension)) {
+            hsMetaFiles.push(collision);
+        }
+        else if (path.parse(collision).base === 'package.json') {
+            packageJsonFiles.push(collision);
+        }
+        else {
+            sourceFiles.push(collision);
+        }
+    });
+    const sourceFilenameMapping = sourceFiles.reduce((acc, filename) => {
+        const { name, ext, dir } = path.parse(filename);
+        return {
+            ...acc,
+            [filename]: path.join(dir, `${name}-${Date.now()}${ext}`),
+        };
+    }, {});
+    const metafileExtensionPrefix = path.parse(metafileExtension).name;
+    const metaFilenameMapping = hsMetaFiles.reduce((acc, filename) => {
+        const { name, dir } = path.parse(filename);
+        return {
+            ...acc,
+            [filename]: path.join(dir, `${name.replace(metafileExtensionPrefix, '')}-${Date.now()}${metafileExtension}`),
+        };
+    }, {});
+    // Update the metafiles that might contain references to the old filenames
+    hsMetaFiles.forEach(file => {
+        updateMetaFile({
+            dest,
+            src,
+            file,
+            sourceFilenameMapping,
+            metaFilenameMapping,
+        });
+    });
+    // Copy the renamed files into their new destination location
+    Object.entries(sourceFilenameMapping).forEach(([key, value]) => {
+        fs.copyFileSync(path.join(src, key), path.join(dest, value));
+    });
+    if (packageJsonFiles.length) {
+        handlePackageJsonCollisions(dest, src, packageJsonFiles);
+    }
+}
+function updateMetaFile({ dest, src, file, sourceFilenameMapping, metaFilenameMapping, }) {
+    let text = fs.readFileSync(path.join(src, file), 'utf-8');
+    Object.entries(sourceFilenameMapping).forEach(([key, value]) => {
+        const { base: oldFileName } = path.parse(key);
+        const { base: newFileName } = path.parse(value);
+        text = text.replace(oldFileName, newFileName);
+    });
+    fs.writeFileSync(path.join(dest, metaFilenameMapping[file]), text);
+}
+function handlePackageJsonCollisions(dest, src, packageJsonFiles) {
+    packageJsonFiles.forEach(file => {
+        const existingPackageJsonContents = JSON.parse(fs.readFileSync(path.join(dest, file), 'utf-8'));
+        const newPackageJsonContents = JSON.parse(fs.readFileSync(path.join(src, file), 'utf-8'));
+        existingPackageJsonContents.dependencies = {
+            ...newPackageJsonContents.dependencies,
+            ...existingPackageJsonContents.dependencies,
+        };
+        existingPackageJsonContents.devDependencies = {
+            ...newPackageJsonContents.devDependencies,
+            ...existingPackageJsonContents.devDependencies,
+        };
+        fs.writeFileSync(path.join(dest, file), JSON.stringify(existingPackageJsonContents, null, 2));
+    });
+}
+export function updateHsMetaFilesWithAutoGeneratedFields(projectName, hsMetaFilePaths, existingUids = []) {
+    uiLogger.log('');
+    uiLogger.log(lib.projects.updateHsMetaFilesWithAutoGeneratedFields.header);
+    for (const hsMetaFile of hsMetaFilePaths) {
+        const component = JSON.parse(fs.readFileSync(hsMetaFile).toString());
+        let uid = coerceToValidUid(`${component.type}-${projectName}`) || component.uid;
+        if (existingUids.includes(uid)) {
+            uid =
+                coerceToValidUid(`${component.type}-${Date.now()}-${projectName}`) ||
+                    component.uid;
+        }
+        component.uid = uid;
+        if (component.type === AppKey && component.config) {
+            component.config.name = `${projectName}-Application`;
+            uiLogger.log(lib.projects.updateHsMetaFilesWithAutoGeneratedFields.applicationLog(component.type, component.uid, component.config.name));
+        }
+        else {
+            uiLogger.log(lib.projects.updateHsMetaFilesWithAutoGeneratedFields.componentLog(component.type, component.uid));
+        }
+        fs.writeFileSync(hsMetaFile, JSON.stringify(component, null, 2));
+    }
+    uiLogger.log('');
+}

package/lib/projects/config.d.ts

@@ -1,4 +1,4 @@
-import { ProjectConfig } from '../../types/Projects';
+import { ProjectConfig } from '../../types/Projects.js';
 export declare function writeProjectConfig(configPath: string, config: ProjectConfig): boolean;
 export declare function getIsInProject(dir?: string): boolean;
 export interface LoadedProjectConfig {

package/lib/projects/config.js

@@ -1,79 +1,70 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.writeProjectConfig = writeProjectConfig;
-exports.getIsInProject = getIsInProject;
-exports.getProjectConfig = getProjectConfig;
-exports.validateProjectConfig = validateProjectConfig;
-const fs_extra_1 = __importDefault(require("fs-extra"));
-const path_1 = __importDefault(require("path"));
-const findup_sync_1 = __importDefault(require("findup-sync"));
-const path_2 = require("@hubspot/local-dev-lib/path");
-const constants_1 = require("../constants");
-const en_1 = require("../../lang/en");
-const exitCodes_1 = require("../enums/exitCodes");
-const logger_1 = require("../ui/logger");
-function writeProjectConfig(configPath, config) {
+import fs from 'fs-extra';
+import path from 'path';
+import findup from 'findup-sync';
+import { getAbsoluteFilePath, getCwd } from '@hubspot/local-dev-lib/path';
+import { PROJECT_CONFIG_FILE } from '../constants.js';
+import { lib } from '../../lang/en.js';
+import { EXIT_CODES } from '../enums/exitCodes.js';
+import { uiLogger } from '../ui/logger.js';
+export function writeProjectConfig(configPath, config) {
     try {
-        fs_extra_1.default.ensureFileSync(configPath);
-        fs_extra_1.default.writeFileSync(configPath, JSON.stringify(config, null, 2));
-        logger_1.uiLogger.debug(`Wrote project config at ${configPath}`);
+        fs.ensureFileSync(configPath);
+        fs.writeFileSync(configPath, JSON.stringify(config, null, 2));
+        uiLogger.debug(`Wrote project config at ${configPath}`);
     }
     catch (e) {
-        logger_1.uiLogger.debug(e);
+        uiLogger.debug(e);
         return false;
     }
     return true;
 }
-function getIsInProject(dir) {
+export function getIsInProject(dir) {
     const configPath = getProjectConfigPath(dir);
     return !!configPath;
 }
 function getProjectConfigPath(dir) {
-    const projectDir = dir ? (0, path_2.getAbsoluteFilePath)(dir) : (0, path_2.getCwd)();
-    const configPath = (0, findup_sync_1.default)(constants_1.PROJECT_CONFIG_FILE, {
+    const projectDir = dir ? getAbsoluteFilePath(dir) : getCwd();
+    const configPath = findup(PROJECT_CONFIG_FILE, {
         cwd: projectDir,
         nocase: true,
     });
     return configPath;
 }
-async function getProjectConfig(dir) {
+export async function getProjectConfig(dir) {
     const configPath = getProjectConfigPath(dir);
     if (!configPath) {
         return { projectConfig: null, projectDir: null };
     }
     try {
-        const config = fs_extra_1.default.readFileSync(configPath);
+        const config = fs.readFileSync(configPath);
         const projectConfig = JSON.parse(config.toString());
         return {
-            projectDir: path_1.default.dirname(configPath),
+            projectDir: path.dirname(configPath),
             projectConfig,
         };
     }
     catch (e) {
-        logger_1.uiLogger.error(en_1.lib.projects.getProjectConfig.error);
+        uiLogger.error(lib.projects.getProjectConfig.error);
         return { projectConfig: null, projectDir: null };
     }
 }
-function validateProjectConfig(projectConfig, projectDir) {
+export function validateProjectConfig(projectConfig, projectDir) {
     if (!projectConfig || !projectDir) {
-        logger_1.uiLogger.error(en_1.lib.projects.validateProjectConfig.configNotFound);
-        return process.exit(exitCodes_1.EXIT_CODES.ERROR);
+        uiLogger.error(lib.projects.validateProjectConfig.configNotFound);
+        return process.exit(EXIT_CODES.ERROR);
     }
     if (!projectConfig.name || !projectConfig.srcDir) {
-        logger_1.uiLogger.error(en_1.lib.projects.validateProjectConfig.configMissingFields);
-        return process.exit(exitCodes_1.EXIT_CODES.ERROR);
+        uiLogger.error(lib.projects.validateProjectConfig.configMissingFields);
+        return process.exit(EXIT_CODES.ERROR);
     }
-    const resolvedPath = path_1.default.resolve(projectDir, projectConfig.srcDir);
+    const resolvedPath = path.resolve(projectDir, projectConfig.srcDir);
     if (!resolvedPath.startsWith(projectDir)) {
-        const projectConfigFile = path_1.default.relative('.', path_1.default.join(projectDir, constants_1.PROJECT_CONFIG_FILE));
-        logger_1.uiLogger.error(en_1.lib.projects.validateProjectConfig.srcOutsideProjectDir(projectConfigFile, projectConfig.srcDir));
-        return process.exit(exitCodes_1.EXIT_CODES.ERROR);
+        const projectConfigFile = path.relative('.', path.join(projectDir, PROJECT_CONFIG_FILE));
+        uiLogger.error(lib.projects.validateProjectConfig.srcOutsideProjectDir(projectConfigFile, projectConfig.srcDir));
+        return process.exit(EXIT_CODES.ERROR);
     }
-    if (!fs_extra_1.default.existsSync(resolvedPath)) {
-        logger_1.uiLogger.error(en_1.lib.projects.validateProjectConfig.srcDirNotFound(projectConfig.srcDir, projectDir));
-        return process.exit(exitCodes_1.EXIT_CODES.ERROR);
+    if (!fs.existsSync(resolvedPath)) {
+        uiLogger.error(lib.projects.validateProjectConfig.srcDirNotFound(projectConfig.srcDir, projectDir));
+        return process.exit(EXIT_CODES.ERROR);
     }
 }

package/lib/projects/create/__tests__/legacy.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/projects/create/__tests__/legacy.test.js

@@ -0,0 +1,91 @@
+import { logger } from '@hubspot/local-dev-lib/logger';
+import * as github from '@hubspot/local-dev-lib/api/github';
+import { EXIT_CODES } from '../../../enums/exitCodes.js';
+import { getProjectComponentListFromRepo, getProjectTemplateListFromRepo, } from '../legacy.js';
+import { PROJECT_COMPONENT_TYPES, HUBSPOT_PROJECT_COMPONENTS_GITHUB_PATH, } from '../../../constants.js';
+vi.mock('@hubspot/local-dev-lib/logger');
+vi.mock('@hubspot/local-dev-lib/api/github');
+const mockedFetchRepoFile = vi.mocked(github.fetchRepoFile);
+const repoConfig = {
+    [PROJECT_COMPONENT_TYPES.COMPONENTS]: [
+        {
+            label: 'Component 1',
+            path: 'component1',
+            type: 'Component',
+        },
+    ],
+    [PROJECT_COMPONENT_TYPES.PROJECTS]: [
+        {
+            name: 'project1',
+            label: 'Project 1',
+            path: 'project1',
+        },
+    ],
+};
+describe('lib/projects/create/legacy', () => {
+    describe('getProjectComponentListFromRepo()', () => {
+        it('returns a list of components', async () => {
+            // @ts-expect-error - Mocking AxiosResponse
+            mockedFetchRepoFile.mockResolvedValue({
+                data: repoConfig,
+            });
+            const components = await getProjectComponentListFromRepo('gh-ref');
+            expect(components).toEqual(repoConfig[PROJECT_COMPONENT_TYPES.COMPONENTS]);
+        });
+        it('returns an empty list if no components are found', async () => {
+            mockedFetchRepoFile.mockRejectedValue(new Error('Not found'));
+            const components = await getProjectComponentListFromRepo('gh-ref');
+            expect(components).toEqual([]);
+        });
+    });
+    describe('getProjectTemplateListFromRepo()', () => {
+        let exitMock;
+        beforeEach(() => {
+            // @ts-expect-error - Mocking process.exit
+            exitMock = vi
+                .spyOn(process, 'exit')
+                .mockImplementation(() => undefined);
+        });
+        afterEach(() => {
+            exitMock.mockRestore();
+        });
+        it('returns a list of project templates', async () => {
+            // @ts-expect-error - Mocking AxiosResponse
+            mockedFetchRepoFile.mockResolvedValue({
+                data: repoConfig,
+            });
+            const templates = await getProjectTemplateListFromRepo(HUBSPOT_PROJECT_COMPONENTS_GITHUB_PATH, 'gh-ref');
+            expect(templates).toEqual(repoConfig[PROJECT_COMPONENT_TYPES.PROJECTS]);
+        });
+        it('Logs an error and exits the process if the request for the template list fails', async () => {
+            mockedFetchRepoFile.mockRejectedValue(new Error('Not found'));
+            await getProjectTemplateListFromRepo(HUBSPOT_PROJECT_COMPONENTS_GITHUB_PATH, 'gh-ref');
+            expect(logger.error).toHaveBeenCalledWith(expect.stringMatching(/Failed to fetch the config.json file from the target repository/));
+            expect(exitMock).toHaveBeenCalledWith(EXIT_CODES.ERROR);
+        });
+        it('Logs an error and exits the process if there are no projects listed in the repo config', async () => {
+            // @ts-expect-error - Mocking AxiosResponse
+            mockedFetchRepoFile.mockResolvedValue({});
+            await getProjectTemplateListFromRepo(HUBSPOT_PROJECT_COMPONENTS_GITHUB_PATH, 'gh-ref');
+            expect(logger.error).toHaveBeenCalledWith(expect.stringMatching(/Unable to find any projects in the target repository's config.json file/));
+            expect(exitMock).toHaveBeenCalledWith(EXIT_CODES.ERROR);
+        });
+        it('Logs an error and exits the process if any of the projects in the repo config are missing required properties', async () => {
+            // @ts-expect-error - Mocking AxiosResponse
+            mockedFetchRepoFile.mockResolvedValue({
+                data: {
+                    ...repoConfig,
+                    [PROJECT_COMPONENT_TYPES.PROJECTS]: [
+                        {
+                            name: 'project1',
+                            label: 'Project 1',
+                        },
+                    ],
+                },
+            });
+            await getProjectTemplateListFromRepo(HUBSPOT_PROJECT_COMPONENTS_GITHUB_PATH, 'gh-ref');
+            expect(logger.error).toHaveBeenCalledWith(expect.stringMatching(/Found misconfigured projects in the target repository's config.json file/));
+            expect(exitMock).toHaveBeenCalledWith(EXIT_CODES.ERROR);
+        });
+    });
+});

package/lib/projects/create/__tests__/v3.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/projects/create/__tests__/v3.test.js

@@ -0,0 +1,241 @@
+import { calculateComponentTemplateChoices } from '../v3.js';
+import { hasFeature } from '../../../hasFeature.js';
+vi.mock('@hubspot/local-dev-lib/logger');
+vi.mock('@hubspot/local-dev-lib/api/github');
+vi.mock('../../../hasFeature.js');
+const mockHasFeature = vi.mocked(hasFeature);
+describe('lib/projects/create/v3', () => {
+    beforeEach(() => {
+        mockHasFeature.mockResolvedValue(true);
+    });
+    describe('calculateComponentTemplateChoices()', () => {
+        beforeEach(() => {
+            mockHasFeature.mockClear();
+        });
+        const mockComponents = [
+            {
+                label: 'Module Component',
+                path: 'module',
+                type: 'module',
+                supportedAuthTypes: ['oauth'],
+                supportedDistributions: ['private'],
+            },
+            {
+                label: 'Card Component',
+                path: 'card',
+                type: 'card',
+                supportedAuthTypes: ['oauth', 'static'],
+                supportedDistributions: ['private', 'marketplace'],
+            },
+        ];
+        const mockProjectMetadataForChoices = {
+            hsMetaFiles: [],
+            components: {
+                module: { count: 0, maxCount: 5, hsMetaFiles: [] },
+                card: { count: 3, maxCount: 3, hsMetaFiles: [] },
+            },
+        };
+        it('returns enabled components when they meet all requirements', async () => {
+            const choices = await calculateComponentTemplateChoices(mockComponents, 'oauth', 'private', 123, mockProjectMetadataForChoices);
+            expect(choices).toHaveLength(4); // includes separator
+            expect(choices[0]).toEqual({
+                name: 'Module Component [module]',
+                value: mockComponents[0],
+            });
+            expect(choices[2]).toEqual({
+                name: expect.stringContaining('Card Component'),
+                value: mockComponents[1],
+                disabled: expect.stringContaining('maximum'),
+            });
+        });
+        it('disables components when auth type is not supported', async () => {
+            const choices = await calculateComponentTemplateChoices(mockComponents, 'privatekey', 'private', 123, mockProjectMetadataForChoices);
+            // All components should be disabled, so they come after the separator
+            expect(choices[1]).toEqual({
+                name: expect.stringContaining('Module Component'),
+                value: mockComponents[0],
+                disabled: expect.stringContaining('privatekey'),
+            });
+        });
+        it('disables components when distribution is not supported', async () => {
+            const choices = await calculateComponentTemplateChoices(mockComponents, 'oauth', 'enterprise', 123, mockProjectMetadataForChoices);
+            // All components should be disabled, so they come after the separator
+            expect(choices[1]).toEqual({
+                name: expect.stringContaining('Module Component'),
+                value: mockComponents[0],
+                disabled: expect.stringContaining('enterprise'),
+            });
+        });
+        it('handles components without auth type or distribution restrictions', async () => {
+            const componentsWithoutRestrictions = [
+                {
+                    label: 'Unrestricted Component',
+                    path: 'unrestricted',
+                    type: 'module',
+                },
+            ];
+            const choices = await calculateComponentTemplateChoices(componentsWithoutRestrictions, 'oauth', 'private', 123, {
+                hsMetaFiles: [],
+                components: { module: { count: 0, maxCount: 5, hsMetaFiles: [] } },
+            });
+            expect(choices[0]).toEqual({
+                name: 'Unrestricted Component [module]',
+                value: componentsWithoutRestrictions[0],
+            });
+        });
+        it('handles components with cliSelector field (metadata compatibility)', async () => {
+            const componentWithCliSelector = [
+                {
+                    label: 'Workflow Action Tool',
+                    path: 'workflow-action-tool',
+                    type: 'workflow-action',
+                    cliSelector: 'workflow-action-tool',
+                    supportedAuthTypes: ['oauth'],
+                    supportedDistributions: ['private'],
+                },
+            ];
+            const projectMetadataWithWorkflowAction = {
+                hsMetaFiles: [],
+                components: {
+                    'workflow-action': { count: 2, maxCount: 3, hsMetaFiles: [] },
+                },
+            };
+            const choices = await calculateComponentTemplateChoices(componentWithCliSelector, 'oauth', 'private', 213, projectMetadataWithWorkflowAction);
+            expect(choices).toHaveLength(1); // no disabled components
+            expect(choices[0]).toEqual({
+                name: 'Workflow Action Tool [workflow-action-tool]',
+                value: componentWithCliSelector[0],
+            });
+        });
+        it('disables component when project metadata count exceeds maximum', async () => {
+            const componentWithCliSelector = [
+                {
+                    label: 'Workflow Action Tool',
+                    path: 'workflow-action-tool',
+                    type: 'workflow-action',
+                    cliSelector: 'workflow-action-tool',
+                    supportedAuthTypes: ['oauth'],
+                    supportedDistributions: ['private'],
+                },
+            ];
+            const projectMetadataAtMaxWorkflowAction = {
+                hsMetaFiles: [],
+                components: {
+                    'workflow-action': { count: 3, maxCount: 3, hsMetaFiles: [] },
+                },
+            };
+            const choices = await calculateComponentTemplateChoices(componentWithCliSelector, 'oauth', 'private', 123, projectMetadataAtMaxWorkflowAction);
+            expect(choices).toHaveLength(3); // includes separators
+            expect(choices[1]).toEqual({
+                name: expect.stringContaining('Workflow Action Tool'),
+                value: componentWithCliSelector[0],
+                disabled: expect.stringContaining('maximum'),
+            });
+        });
+        it('handles undefined projectMetadata without throwing errors', async () => {
+            const componentWithCliSelector = [
+                {
+                    label: 'Workflow Action Tool',
+                    path: 'workflow-action-tool',
+                    type: 'workflow-action',
+                    cliSelector: 'workflow-action-tool',
+                    supportedAuthTypes: ['oauth'],
+                    supportedDistributions: ['private'],
+                },
+            ];
+            const choices = await calculateComponentTemplateChoices(componentWithCliSelector, 'oauth', 'private', 123, undefined);
+            expect(choices).toHaveLength(1); // no disabled components
+            expect(choices[0]).toEqual({
+                name: 'Workflow Action Tool [workflow-action-tool]',
+                value: componentWithCliSelector[0],
+            });
+        });
+        it('handles projectMetadata with undefined components property (after fix)', async () => {
+            const componentWithCliSelector = [
+                {
+                    label: 'Workflow Action Tool',
+                    path: 'workflow-action-tool',
+                    type: 'workflow-action',
+                    cliSelector: 'workflow-action-tool',
+                    supportedAuthTypes: ['oauth'],
+                    supportedDistributions: ['private'],
+                },
+            ];
+            const projectMetadataWithoutComponents = {
+                hsMetaFiles: [],
+                components: undefined,
+            };
+            // This test verifies the null check fix works
+            // Currently this will fail because the fix checks for projectMetadata.components
+            await expect(async () => calculateComponentTemplateChoices(componentWithCliSelector, 'oauth', 'private', 123, 
+            // @ts-expect-error breaking stuff on purpose
+            projectMetadataWithoutComponents)).rejects.toThrow();
+        });
+        it('disables gated components when hasFeature returns false', async () => {
+            mockHasFeature.mockResolvedValue(false);
+            const gatedComponent = [
+                {
+                    label: 'Workflow Action Tool',
+                    path: 'workflow-action-tool',
+                    type: 'workflow-action',
+                    cliSelector: 'workflow-action-tool',
+                    supportedAuthTypes: ['oauth'],
+                    supportedDistributions: ['private'],
+                },
+            ];
+            const choices = await calculateComponentTemplateChoices(gatedComponent, 'oauth', 'private', 123, mockProjectMetadataForChoices);
+            expect(choices).toHaveLength(3); // includes separators
+            expect(choices[1]).toEqual({
+                name: expect.stringContaining('Workflow Action Tool'),
+                value: gatedComponent[0],
+                disabled: expect.stringContaining('does not have access to this feature'),
+            });
+            expect(mockHasFeature).toHaveBeenCalledWith(123, expect.any(String));
+        });
+        it('enables gated components when hasFeature returns true', async () => {
+            mockHasFeature.mockResolvedValue(true);
+            const gatedComponent = [
+                {
+                    label: 'Workflow Action Tool',
+                    path: 'workflow-action-tool',
+                    type: 'workflow-action',
+                    cliSelector: 'workflow-action-tool',
+                    supportedAuthTypes: ['oauth'],
+                    supportedDistributions: ['private'],
+                },
+            ];
+            const projectMetadataWithWorkflowAction = {
+                hsMetaFiles: [],
+                components: {
+                    'workflow-action': { count: 0, maxCount: 3, hsMetaFiles: [] },
+                },
+            };
+            const choices = await calculateComponentTemplateChoices(gatedComponent, 'oauth', 'private', 123, projectMetadataWithWorkflowAction);
+            expect(choices).toHaveLength(1); // no disabled components
+            expect(choices[0]).toEqual({
+                name: 'Workflow Action Tool [workflow-action-tool]',
+                value: gatedComponent[0],
+            });
+            expect(mockHasFeature).toHaveBeenCalledWith(123, expect.any(String));
+        });
+        it('handles non-gated components without calling hasFeature', async () => {
+            const nonGatedComponent = [
+                {
+                    label: 'Regular Component',
+                    path: 'regular',
+                    type: 'module',
+                    supportedAuthTypes: ['oauth'],
+                    supportedDistributions: ['private'],
+                },
+            ];
+            const choices = await calculateComponentTemplateChoices(nonGatedComponent, 'oauth', 'private', 123, mockProjectMetadataForChoices);
+            expect(choices).toHaveLength(1);
+            expect(choices[0]).toEqual({
+                name: 'Regular Component [module]',
+                value: nonGatedComponent[0],
+            });
+            // hasFeature should not be called for non-gated components
+            expect(mockHasFeature).not.toHaveBeenCalled();
+        });
+    });
+});