refactor: improve template selection

Author: mdjastrzebski

packages/create-app/package.json

@@ -1,15 +1,18 @@
 {
   "name": "@callstack/create-rnef-app",
   "version": "0.0.1",
+  "type": "commonjs",
+  "main": "./src/index.js",
+  "typings": "./src/index.d.ts",
+  "bin": {
+    "create-rnef-app": "./src/bin.js"
+  },
   "dependencies": {
     "@clack/prompts": "^0.7.0",
     "minimist": "^1.2.8",
     "tslib": "^2.3.0"
   },
   "devDependencies": {
     "@types/minimist": "^1.2.5"
-  },
-  "type": "commonjs",
-  "main": "./src/index.js",
-  "typings": "./src/index.d.ts"
+  }
 }

packages/create-app/project.json

@@ -17,7 +17,7 @@
       "executor": "@nx/js:tsc",
       "outputs": ["{options.outputPath}"],
       "options": {
-        "outputPath": "dist/packages/create-app",
+        "outputPath": "packages/create-app/dist",
         "main": "packages/create-app/src/index.ts",
         "tsConfig": "packages/create-app/tsconfig.lib.json",
         "assets": ["packages/create-app/*.md"]

packages/create-app/src/lib/create-app.ts

@@ -10,9 +10,10 @@ import {
   promptProjectName,
   printWelcomeMessage,
   printByeMessage,
+  promptTemplate,
 } from './prompts';
 import { copyDir, isEmptyDir, removeDir, resolveAbsolutePath } from './fs';
-import { parseCliOptions } from './parse-args';
+import { parseCliOptions } from './parse-cli-options';
 
 const TEMPLATES = ['default'];
 
@@ -32,7 +33,7 @@ async function create() {
   printWelcomeMessage();
 
   const projectName =
-    (options.dir || options.projectName) ?? (await promptProjectName());
+    (options.dir || options.name) ?? (await promptProjectName());
   const { targetDir } = parsePackageInfo(projectName);
   const absoluteTargetDir = resolveAbsolutePath(targetDir);
 
@@ -49,11 +50,17 @@ async function create() {
 
   removeDir(absoluteTargetDir);
 
-  const templateName = TEMPLATES[0];
-  // TODO: figure monorepo workaround
-  const srcDir = path.join(__dirname, '..', `rnef-template-${templateName}`);
+  const templateName = options.template ?? (await promptTemplate(TEMPLATES));
+  const srcDir = path.join(
+    __dirname,
+    // Workaround for getting the template from within the monorepo
+    // TODO: implement downloading templates from NPM
+    '../../../../../templates',
+    `rnef-template-${templateName}`
+  );
+
   if (!fs.existsSync(srcDir)) {
-    throw new Error(`Invalid input: template "${templateName}" not found.`);
+    throw new Error(`Invalid template: template "${templateName}" not found.`);
   }
 
   copyDir(srcDir, absoluteTargetDir);

packages/create-app/src/lib/parse-args.ts renamed to packages/create-app/src/lib/parse-cli-options.ts

@@ -1,7 +1,8 @@
 import minimist from 'minimist';
 
 export type CliOptions = {
-  projectName?: string;
+  name?: string;
+  template?: string;
   help?: boolean;
   version?: boolean;
   dir?: string;
@@ -14,7 +15,8 @@ export function parseCliOptions(argv: string[]): CliOptions {
   });
 
   return {
-    projectName: options._[0],
+    name: options._[0],
+    template: options.template,
     help: options.help,
     version: options.version,
     dir: options.dir,

packages/create-app/src/lib/prompts.ts

@@ -45,10 +45,12 @@ export function printByeMessage(targetDir: string) {
     process.env['npm_config_user_agent']
   );
 
+  const pkgManagerCommand = pkgManager?.name ?? 'npm';
+
   const nextSteps = [
     `cd ${targetDir}`,
-    `${pkgManager} install`,
-    `${pkgManager} run start`,
+    `${pkgManagerCommand} install`,
+    `${pkgManagerCommand} run start`,
   ].join('\n');
 
   note(nextSteps, 'Next steps');
@@ -64,6 +66,26 @@ export async function promptProjectName() {
   );
 }
 
+export async function promptTemplate(templates: string[]): Promise<string> {
+  if (templates.length === 0) {
+    throw new Error('No templates found');
+  }
+
+  if (templates.length === 1) {
+    return templates[0];
+  }
+
+  return checkCancel<string>(
+    await select({
+      message: 'Select a template:',
+      options: templates.map((template) => ({
+        value: template,
+        label: template,
+      })),
+    })
+  );
+}
+
 export async function confirmOverrideFiles(targetDir: string) {
   const option = checkCancel<string>(
     await select({