@commercetools-frontend/create-mc-app 21.9.0 → 21.10.0

package/dist/declarations/src/cli.d.ts

@@ -0,0 +1,2 @@
+declare const run: () => void;
+export default run;

package/dist/declarations/src/hint-outdated-version.d.ts

@@ -0,0 +1,2 @@
+declare function hintOutdatedVersion(currentVersion: string): Promise<void>;
+export default hintOutdatedVersion;

package/dist/declarations/src/index.d.ts

@@ -0,0 +1,2 @@
+import cli from './cli';
+export { cli };

package/dist/declarations/src/process-options.d.ts

@@ -0,0 +1,3 @@
+import type { TCliCommandOptions, TCliTaskOptions } from './types';
+declare function processOptions(projectDirectoryName: string, options: TCliCommandOptions): Promise<TCliTaskOptions>;
+export default processOptions;

package/dist/declarations/src/tasks/download-template.d.ts

@@ -0,0 +1,4 @@
+import { type ListrTask } from 'listr2';
+import type { TCliTaskOptions } from '../types';
+declare function downloadTemplate(options: TCliTaskOptions): ListrTask;
+export default downloadTemplate;

package/dist/declarations/src/tasks/index.d.ts

@@ -0,0 +1,5 @@
+export { default as downloadTemplate } from './download-template';
+export { default as installDependencies } from './install-dependencies';
+export { default as updatePackageJson } from './update-package-json';
+export { default as updateCustomApplicationConfig } from './update-custom-application-config';
+export { default as updateApplicationConstants } from './update-application-constants';

package/dist/declarations/src/tasks/install-dependencies.d.ts

@@ -0,0 +1,4 @@
+import type { ListrTask } from 'listr2';
+import type { TCliTaskOptions } from '../types';
+declare function installDependencies(options: TCliTaskOptions): ListrTask;
+export default installDependencies;

package/dist/declarations/src/tasks/update-application-constants.d.ts

@@ -0,0 +1,4 @@
+import type { ListrTask } from 'listr2';
+import type { TCliTaskOptions } from '../types';
+declare function updateApplicationConstants(options: TCliTaskOptions): ListrTask;
+export default updateApplicationConstants;

package/dist/declarations/src/tasks/update-custom-application-config.d.ts

@@ -0,0 +1,4 @@
+import type { ListrTask } from 'listr2';
+import type { TCliTaskOptions } from '../types';
+declare function updateCustomApplicationConfig(options: TCliTaskOptions): ListrTask;
+export default updateCustomApplicationConfig;

package/dist/declarations/src/tasks/update-package-json.d.ts

@@ -0,0 +1,4 @@
+import type { ListrTask } from 'listr2';
+import type { TCliTaskOptions } from '../types';
+declare function updatePackageJson(options: TCliTaskOptions): ListrTask;
+export default updatePackageJson;

package/dist/declarations/src/types.d.ts

@@ -0,0 +1,19 @@
+export declare type TCliGlobalOptions = {
+    '--'?: string[];
+};
+export declare type TCliCommandOptions = {
+    template: 'starter' | 'starter-typescript';
+    templateVersion: string;
+    skipInstall: boolean;
+    yes: boolean;
+    entryPointUriPath?: string;
+    initialProjectKey?: string;
+};
+export declare type TCliTaskOptions = {
+    projectDirectoryName: string;
+    projectDirectoryPath: string;
+    templateName: TCliCommandOptions['template'];
+    tagOrBranchVersion: string;
+    entryPointUriPath: string;
+    initialProjectKey: string;
+};

package/dist/declarations/src/utils.d.ts

@@ -0,0 +1,7 @@
+declare const isSemVer: (version: string) => boolean;
+declare const shouldUseYarn: () => boolean;
+declare const slugify: (name: string) => string;
+declare const upperFirst: (value: string) => string;
+declare const wordify: (slug: string) => string;
+declare const resolveFilePathByExtension: (requestedModule: string) => string;
+export { isSemVer, shouldUseYarn, slugify, wordify, upperFirst, resolveFilePathByExtension, };

package/dist/declarations/src/validations.d.ts

@@ -0,0 +1,7 @@
+import type { TCliCommandOptions } from './types';
+declare const throwIfTemplateIsNotSupported: (templateName: TCliCommandOptions['template']) => void;
+declare const throwIfProjectDirectoryExists: (dirName: string, dirPath: string) => void;
+declare const throwIfTemplateVersionDoesNotExist: (templateName: string, templateFolderPath: string, versionToCheck: string) => void;
+declare const throwIfInitialProjectKeyIsMissing: (initialProjectKey?: string) => void;
+declare const throwIfNodeVersionIsNotSupported: (currentNodeVersion: string, expectedVersionRange: string) => void;
+export { throwIfTemplateIsNotSupported, throwIfProjectDirectoryExists, throwIfTemplateVersionDoesNotExist, throwIfInitialProjectKeyIsMissing, throwIfNodeVersionIsNotSupported, };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercetools-frontend/create-mc-app",
-  "version": "21.9.0",
+  "version": "21.10.0",
   "description": "Create Merchant Center applications to quickly get up and running",
   "bugs": "https://github.com/commercetools/merchant-center-application-kit/issues",
   "repository": {
@@ -14,12 +14,16 @@
   "publishConfig": {
     "access": "public"
   },
+  "main": "dist/commercetools-frontend-create-mc-app.cjs.js",
+  "module": "dist/commercetools-frontend-create-mc-app.esm.js",
   "bin": "./bin/cli.js",
   "dependencies": {
     "@babel/core": "^7.18.6",
+    "@babel/runtime": "^7.18.6",
+    "@babel/runtime-corejs3": "^7.18.6",
+    "cac": "6.7.12",
     "execa": "5.1.1",
-    "listr": "0.14.3",
-    "mri": "1.2.0",
+    "listr2": "4.0.5",
     "prettier": "2.6.2",
     "rcfile": "1.0.3",
     "semver": "7.3.7"

package/src/cli.ts

@@ -0,0 +1,109 @@
+import { cac } from 'cac';
+import { Listr, type ListrTask } from 'listr2';
+import * as tasks from './tasks';
+import { throwIfNodeVersionIsNotSupported } from './validations';
+import { shouldUseYarn } from './utils';
+import hintOutdatedVersion from './hint-outdated-version';
+import processOptions from './process-options';
+import type { TCliCommandOptions } from './types';
+import pkgJson from '../package.json';
+
+throwIfNodeVersionIsNotSupported(process.versions.node, pkgJson.engines.node);
+
+const cli = cac('create-mc-app');
+
+// Makes the script crash on unhandled rejections instead of silently
+// ignoring them. In the future, promise rejections that are not handled will
+// terminate the Node.js process with a non-zero exit code.
+process.on('unhandledRejection', (err) => {
+  throw err;
+});
+
+const run = () => {
+  // Default command
+  cli
+    .command('[project-directory]')
+    .usage(
+      '[project-directory]\n\n  Bootstraps a new Custom Application project using one of the predefined templates.'
+    )
+    .option(
+      '--template <name>',
+      '(optional) The name of the template to install.',
+      { default: 'starter' }
+    )
+    .option(
+      '--template-version <version>',
+      '(optional) The version of the template to install (either a git tag or a git branch of the "commercetools/merchant-center-application-kit" repository).',
+      { default: 'main' }
+    )
+    .option(
+      '--skip-install',
+      '(optional) Skip installing the dependencies after cloning the template.',
+      { default: false }
+    )
+    .option(
+      '--yes',
+      '(optional) If set, the prompt options with default values will be skipped.',
+      { default: false }
+    )
+    .option(
+      '--entry-point-uri-path <value>',
+      '(optional) The version of the template to install. (default: starter-<hash>)'
+    )
+    .option(
+      '--initial-project-key <value>',
+      '(optional) A commercetools project key used for the initial login in development. By default, the value is prompted in the terminal.'
+    )
+    .action(async (projectDirectory, options: TCliCommandOptions) => {
+      if (!projectDirectory) {
+        cli.outputHelp();
+        return;
+      }
+
+      await hintOutdatedVersion(pkgJson.version);
+
+      console.log('');
+      console.log(
+        `Documentation available at https://docs.commercetools.com/custom-applications`
+      );
+      console.log('');
+
+      const taskOptions = await processOptions(projectDirectory, options);
+
+      const taskList = new Listr(
+        [
+          tasks.downloadTemplate(taskOptions),
+          tasks.updatePackageJson(taskOptions),
+          tasks.updateCustomApplicationConfig(taskOptions),
+          tasks.updateApplicationConstants(taskOptions),
+          !options.skipInstall && tasks.installDependencies(taskOptions),
+        ].filter(Boolean) as ListrTask[]
+      );
+
+      await taskList.run();
+      const useYarn = shouldUseYarn();
+
+      console.log('');
+      console.log(
+        `🎉 🎉 🎉 The Custom Application has been created in the "${taskOptions.projectDirectoryName}" folder.`
+      );
+      console.log('');
+      console.log(`To get started:`);
+      console.log(`$ cd ${taskOptions.projectDirectoryName}`);
+      if (options.skipInstall) {
+        console.log(`$ ${useYarn ? 'yarn' : 'npm'} install`);
+      }
+      console.log(`$ ${useYarn ? 'yarn' : 'npm'} start`);
+      console.log('');
+      console.log(
+        `Visit https://docs.commercetools.com/custom-applications for more info about developing Custom Applications. Enjoy 🚀`
+      );
+    });
+
+  cli.help();
+  cli.version(pkgJson.version);
+
+  cli.parse();
+};
+
+export default run;

package/src/hint-outdated-version.ts

@@ -0,0 +1,39 @@
+import semver from 'semver';
+import execa from 'execa';
+
+async function hintOutdatedVersion(currentVersion: string) {
+  try {
+    const commandResult = await execa.command(
+      'npm view @commercetools-frontend/create-mc-app --json',
+      { encoding: 'utf-8' }
+    );
+
+    const packageInfoForTagLatest = JSON.parse(commandResult.stdout);
+
+    const hasBeenReleastedInLatestTag = semver.gt(
+      packageInfoForTagLatest.version,
+      currentVersion
+    );
+
+    const hintNewerVersions = [
+      hasBeenReleastedInLatestTag && `${packageInfoForTagLatest.version}`,
+    ]
+      .filter(Boolean)
+      .join(', ');
+
+    if (hintNewerVersions.length > 0) {
+      console.log('');
+      console.log(
+        `New version available! ${currentVersion} -> ${hintNewerVersions}`
+      );
+      console.log('');
+    }
+  } catch (error) {
+    // Ignore errors, as this function should not affect the exit code of the command
+    if (process.env.NODE_ENV === 'test') {
+      console.error(error);
+    }
+  }
+}
+
+export default hintOutdatedVersion;

package/src/index.ts

@@ -0,0 +1,3 @@
+import cli from './cli';
+
+export { cli };

package/src/process-options.ts

@@ -0,0 +1,97 @@
+import path from 'path';
+import readline, { type Interface } from 'readline';
+import crypto from 'crypto';
+import {
+  throwIfTemplateIsNotSupported,
+  throwIfProjectDirectoryExists,
+  throwIfInitialProjectKeyIsMissing,
+} from './validations';
+import { isSemVer } from './utils';
+import type { TCliCommandOptions, TCliTaskOptions } from './types';
+
+const question = (rl: Interface, value: string) =>
+  new Promise<string>((resolve) => rl.question(value, resolve));
+
+const getEntryPointUriPath = async (
+  rl: Interface,
+  options: TCliCommandOptions
+) => {
+  if (options.entryPointUriPath) {
+    return options.entryPointUriPath;
+  }
+
+  const randomEntryPointUriPath = `${options.template}-${crypto
+    .randomBytes(3)
+    .toString('hex')}`;
+
+  if (options.yes) {
+    return randomEntryPointUriPath;
+  }
+
+  const answerEntryPointUriPath = await question(
+    rl,
+    `Provide the Custom Application entryPointUriPath (default "${randomEntryPointUriPath}"): `
+  );
+  return answerEntryPointUriPath || randomEntryPointUriPath;
+};
+
+const getInitialProjectKey = async (
+  rl: Interface,
+  options: TCliCommandOptions
+) => {
+  if (options.initialProjectKey) {
+    return options.initialProjectKey;
+  }
+
+  const initialProjectKey = await question(
+    rl,
+    `Provide the initial project key for local development: `
+  );
+
+  throwIfInitialProjectKeyIsMissing(initialProjectKey);
+
+  return initialProjectKey;
+};
+
+async function processOptions(
+  projectDirectoryName: string,
+  options: TCliCommandOptions
+): Promise<TCliTaskOptions> {
+  if (!projectDirectoryName) {
+    throw new Error('Missing required argument "[project-directory]"');
+  }
+  const projectDirectoryPath = path.resolve(projectDirectoryName);
+
+  // Parse options
+  let tagOrBranchVersion = options.templateVersion || 'main';
+  tagOrBranchVersion =
+    isSemVer(tagOrBranchVersion) && !tagOrBranchVersion.startsWith('v')
+      ? `v${tagOrBranchVersion}`
+      : tagOrBranchVersion;
+
+  const templateName = options.template;
+
+  // Validate options
+  throwIfProjectDirectoryExists(projectDirectoryName, projectDirectoryPath);
+  throwIfTemplateIsNotSupported(templateName);
+
+  // Read prompts
+  const rl = readline.createInterface({
+    input: process.stdin,
+    output: process.stdout,
+  });
+  const entryPointUriPath = await getEntryPointUriPath(rl, options);
+  const initialProjectKey = await getInitialProjectKey(rl, options);
+  rl.close();
+
+  return {
+    projectDirectoryName,
+    projectDirectoryPath,
+    templateName,
+    tagOrBranchVersion,
+    entryPointUriPath,
+    initialProjectKey,
+  };
+}
+
+export default processOptions;

package/src/tasks/{download-template.js → download-template.ts}

@@ -1,13 +1,14 @@
-const fs = require('fs');
-const os = require('os');
-const path = require('path');
-const execa = require('execa');
-const Listr = require('listr');
-const { throwIfTemplateVersionDoesNotExist } = require('../validations');
+import fs from 'fs';
+import os from 'os';
+import path from 'path';
+import execa from 'execa';
+import { Listr, type ListrTask } from 'listr2';
+import { throwIfTemplateVersionDoesNotExist } from '../validations';
+import type { TCliTaskOptions } from '../types';
 
 const filesToBeRemoved = ['CHANGELOG.md'];
 
-module.exports = function downloadTemplate(options) {
+function downloadTemplate(options: TCliTaskOptions): ListrTask {
   return {
     title: 'Downloading template',
     task: () => {
@@ -121,4 +122,6 @@ module.exports = function downloadTemplate(options) {
       ]);
     },
   };
-};
+}
+
+export default downloadTemplate;

package/src/tasks/index.ts

@@ -0,0 +1,5 @@
+export { default as downloadTemplate } from './download-template';
+export { default as installDependencies } from './install-dependencies';
+export { default as updatePackageJson } from './update-package-json';
+export { default as updateCustomApplicationConfig } from './update-custom-application-config';
+export { default as updateApplicationConstants } from './update-application-constants';

package/src/tasks/{install-dependencies.js → install-dependencies.ts}

@@ -1,7 +1,9 @@
-const execa = require('execa');
-const { shouldUseYarn } = require('../utils');
+import execa from 'execa';
+import type { ListrTask } from 'listr2';
+import { shouldUseYarn } from '../utils';
+import type { TCliTaskOptions } from '../types';
 
-module.exports = function installDependencies(options) {
+function installDependencies(options: TCliTaskOptions): ListrTask {
   return {
     title: 'Installing dependencies (this might take a while)',
     task: () => {
@@ -15,4 +17,6 @@ module.exports = function installDependencies(options) {
       });
     },
   };
-};
+}
+
+export default installDependencies;

package/src/tasks/update-application-constants.ts

@@ -0,0 +1,61 @@
+import os from 'os';
+import fs from 'fs';
+import path from 'path';
+// @ts-ignore
+import rcfile from 'rcfile';
+import prettier from 'prettier';
+import { type PluginItem, transformFileSync, types } from '@babel/core';
+import type { ListrTask } from 'listr2';
+import { resolveFilePathByExtension } from '../utils';
+import type { TCliTaskOptions } from '../types';
+
+function replaceEntryPointUriPathInConstants(
+  filePath: string,
+  options: TCliTaskOptions
+) {
+  const result = transformFileSync(filePath, {
+    plugins: [
+      function replaceConstants(): PluginItem {
+        return {
+          visitor: {
+            VariableDeclarator(nodePath) {
+              if (
+                nodePath.node.id.type === 'Identifier' &&
+                nodePath.node.id.name === 'entryPointUriPath'
+              ) {
+                nodePath.node.init = types.stringLiteral(
+                  options.entryPointUriPath
+                );
+              }
+            },
+          },
+        };
+      },
+    ],
+    retainLines: true,
+  });
+
+  if (result?.code) {
+    const prettierConfig = rcfile('prettier', {
+      cwd: options.projectDirectoryPath,
+    });
+    const formattedData = prettier.format(result.code + os.EOL, prettierConfig);
+    fs.writeFileSync(filePath, formattedData, {
+      encoding: 'utf8',
+    });
+  }
+}
+
+function updateApplicationConstants(options: TCliTaskOptions): ListrTask {
+  return {
+    title: 'Updating application constants',
+    task: () => {
+      const applicationConstantsPath = resolveFilePathByExtension(
+        path.join(options.projectDirectoryPath, 'src/constants')
+      );
+      replaceEntryPointUriPathInConstants(applicationConstantsPath, options);
+    },
+  };
+}
+
+export default updateApplicationConstants;

package/src/tasks/update-custom-application-config.ts

@@ -0,0 +1,85 @@
+import os from 'os';
+import fs from 'fs';
+import path from 'path';
+// @ts-ignore
+import rcfile from 'rcfile';
+import prettier from 'prettier';
+import { transformFileSync, types, type PluginItem } from '@babel/core';
+import type { ListrTask } from 'listr2';
+import { wordify, resolveFilePathByExtension } from '../utils';
+import type { TCliTaskOptions } from '../types';
+
+function replaceApplicationInfoInCustomApplicationConfig(
+  filePath: string,
+  options: TCliTaskOptions
+) {
+  const appName = wordify(options.entryPointUriPath);
+
+  const result = transformFileSync(filePath, {
+    plugins: [
+      function replaceCustomApplicationConfig(): PluginItem {
+        return {
+          visitor: {
+            Identifier(nodePath) {
+              if (
+                nodePath.isIdentifier({ name: 'name' }) &&
+                nodePath.parent.type === 'ObjectProperty'
+              ) {
+                nodePath.parent.value = types.stringLiteral(appName);
+              }
+              if (
+                nodePath.isIdentifier({ name: 'initialProjectKey' }) &&
+                nodePath.parent.type === 'ObjectProperty'
+              ) {
+                nodePath.parent.value = types.stringLiteral(
+                  options.initialProjectKey
+                );
+              }
+              if (nodePath.isIdentifier({ name: 'defaultLabel' })) {
+                const isMainMenuLinkParent = nodePath.findParent((parentPath) =>
+                  parentPath.isIdentifier({
+                    name: 'mainMenuLink',
+                  })
+                );
+                if (
+                  isMainMenuLinkParent &&
+                  nodePath.parent.type === 'ObjectProperty'
+                ) {
+                  nodePath.parent.value = types.stringLiteral(appName);
+                }
+              }
+            },
+          },
+        };
+      },
+    ],
+    retainLines: true,
+  });
+
+  if (result?.code) {
+    const prettierConfig = rcfile('prettier', {
+      cwd: options.projectDirectoryPath,
+    });
+    const formattedData = prettier.format(result.code + os.EOL, prettierConfig);
+    fs.writeFileSync(filePath, formattedData, {
+      encoding: 'utf8',
+    });
+  }
+}
+
+function updateCustomApplicationConfig(options: TCliTaskOptions): ListrTask {
+  return {
+    title: 'Updating Custom Applications config',
+    task: () => {
+      const customApplicationConfigPath = resolveFilePathByExtension(
+        path.join(options.projectDirectoryPath, 'custom-application-config')
+      );
+      replaceApplicationInfoInCustomApplicationConfig(
+        customApplicationConfigPath,
+        options
+      );
+    },
+  };
+}
+
+export default updateCustomApplicationConfig;

package/src/tasks/{update-package-json.js → update-package-json.ts}

@@ -1,9 +1,11 @@
-const os = require('os');
-const fs = require('fs');
-const path = require('path');
-const { slugify } = require('../utils');
+import os from 'os';
+import fs from 'fs';
+import path from 'path';
+import type { ListrTask } from 'listr2';
+import { slugify } from '../utils';
+import type { TCliTaskOptions } from '../types';
 
-module.exports = function updatePackageJson(options) {
+function updatePackageJson(options: TCliTaskOptions): ListrTask {
   return {
     title: 'Updating package.json',
     task: () => {
@@ -32,4 +34,6 @@ module.exports = function updatePackageJson(options) {
       );
     },
   };
-};
+}
+
+export default updatePackageJson;

package/src/types.ts

@@ -0,0 +1,21 @@
+export type TCliGlobalOptions = {
+  '--'?: string[];
+};
+
+export type TCliCommandOptions = {
+  template: 'starter' | 'starter-typescript';
+  templateVersion: string;
+  skipInstall: boolean;
+  yes: boolean;
+  entryPointUriPath?: string;
+  initialProjectKey?: string;
+};
+
+export type TCliTaskOptions = {
+  projectDirectoryName: string;
+  projectDirectoryPath: string;
+  templateName: TCliCommandOptions['template'];
+  tagOrBranchVersion: string;
+  entryPointUriPath: string;
+  initialProjectKey: string;
+};

package/src/utils.ts

@@ -0,0 +1,41 @@
+import fs from 'fs';
+import execa from 'execa';
+
+const isSemVer = (version: string) => /^(v?)([0-9].[0-9].[0-9])+/.test(version);
+
+const shouldUseYarn = () => {
+  try {
+    const result = execa.commandSync('yarn --version', { stdio: 'ignore' });
+    return !result.failed;
+  } catch (error) {
+    return false;
+  }
+};
+
+const slugify = (name: string) => name.toLowerCase().replace(/_/gi, '-');
+
+const upperFirst = (value: string) =>
+  value.charAt(0).toUpperCase() + value.slice(1);
+
+const wordify = (slug: string) =>
+  slug
+    .split('-')
+    .map((word) => upperFirst(word))
+    .join(' ');
+
+const resolveFilePathByExtension = (requestedModule: string) => {
+  const fileExtension = ['.js', '.ts', '.mjs', '.cjs'].find((ext) => {
+    const filePath = `${requestedModule}${ext}`;
+    return fs.existsSync(filePath);
+  });
+  return `${requestedModule}${fileExtension}`;
+};
+
+export {
+  isSemVer,
+  shouldUseYarn,
+  slugify,
+  wordify,
+  upperFirst,
+  resolveFilePathByExtension,
+};