Feat/dx 544 add boilerplates

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentstack/apps-cli",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "App ClI",
   "author": "Contentstack CLI",
   "homepage": "https://github.com/contentstack/contentstack-apps-cli",

src/commands/app/create.ts

@@ -32,7 +32,8 @@ import {
   getAppName,
   getDirName,
   getOrgAppUiLocation,
-  sanitizePath
+  sanitizePath,
+  selectedBoilerplate,
 } from "../../util";
 
 export default class Create extends BaseCommand<typeof Create> {
@@ -96,7 +97,15 @@ export default class Create extends BaseCommand<typeof Create> {
           message: this.messages.CONFIRM_CLONE_BOILERPLATE,
         }))
       ) {
-        await this.boilerplateFlow();
+        const boilerplate = await selectedBoilerplate();
+        if (boilerplate) {
+          this.sharedConfig.boilerplateName = boilerplate.name
+            .toLowerCase()
+            .replace(/ /g, "-");
+          this.sharedConfig.appBoilerplateGithubUrl = boilerplate.link;
+          this.sharedConfig.appName = this.sharedConfig.boilerplateName;
+          await this.boilerplateFlow();
+        }
       } else {
         this.manageManifestToggeling();
         await this.registerTheAppOnDeveloperHub(false);
@@ -120,6 +129,12 @@ export default class Create extends BaseCommand<typeof Create> {
     await this.unZipBoilerplate(await this.cloneBoilerplate());
     tmp.setGracefulCleanup(); // NOTE If graceful cleanup is set, tmp will remove all controlled temporary objects on process exit
 
+    // Update the sharedConfig.appName with the actual folder name
+    this.sharedConfig.appName =
+      this.sharedConfig.folderPath.split("/").pop() ||
+      this.sharedConfig.appName;
+    this.tempAppData.name = this.sharedConfig.appName;
+
     this.manageManifestToggeling();
 
     // NOTE Step 2: Registering the app
@@ -198,7 +213,11 @@ export default class Create extends BaseCommand<typeof Create> {
     const zip = new AdmZip(filepath);
     const dataDir = this.flags["data-dir"] ?? process.cwd();
     let targetPath = resolve(dataDir, this.sharedConfig.appName);
-    const sourcePath = resolve(dataDir, this.sharedConfig.boilerplateName);
+
+    // Get the directory inside the zip file
+    const zipEntries = zip.getEntries();
+    const firstEntry = zipEntries[0];
+    const sourcePath = resolve(dataDir, firstEntry.entryName.split("/")[0]);
 
     if (this.flags["data-dir"] && !existsSync(this.flags["data-dir"])) {
       mkdirSync(this.flags["data-dir"], { recursive: true });
@@ -225,6 +244,10 @@ export default class Create extends BaseCommand<typeof Create> {
         reject(error);
       });
     });
+    // Update the app name and folder path
+    this.sharedConfig.appName =
+      this.sharedConfig.folderPath.split("/").pop() ||
+      this.sharedConfig.appName;
   }
 
   /**
@@ -236,8 +259,8 @@ export default class Create extends BaseCommand<typeof Create> {
   manageManifestToggeling() {
     // NOTE Use boilerplate manifest if exist
     const manifestPath = resolve(
-      this.sharedConfig.folderPath || "",
-      "manifest.json"
+      this.sharedConfig.folderPath,
+      `${this.sharedConfig.folderPath}/manifest.json`
     );
 
     if (existsSync(manifestPath)) {
@@ -301,7 +324,10 @@ export default class Create extends BaseCommand<typeof Create> {
         this.appData = merge(this.appData, pick(response, validKeys));
         if (saveManifest) {
           writeFileSync(
-            resolve(this.sharedConfig.folderPath, "manifest.json"),
+            resolve(
+              this.sharedConfig.folderPath,
+              `${this.sharedConfig.folderPath}/manifest.json`
+            ),
             JSON.stringify(this.appData),
             {
               encoding: "utf8",

src/config/index.ts

@@ -2,12 +2,13 @@ import { resolve } from "path";
 
 const config = {
   defaultAppName: "app-boilerplate",
-  manifestPath: resolve(__dirname, "manifest.json"),
+  manifestPath: resolve(__dirname, ""),
   boilerplateName: "marketplace-app-boilerplate-main",
   developerHubBaseUrl: "",
   appBoilerplateGithubUrl:
     "https://codeload.github.com/contentstack/marketplace-app-boilerplate/zip/refs/heads/main",
   defaultAppFileName: "manifest",
+  boilerplatesUrl: 'https://marketplace-artifacts.contentstack.com/cli/starter-template.json'
 };
 
 export default config;

src/util/common-utils.ts

@@ -19,6 +19,8 @@ import {
 } from "../types";
 import { askProjectName } from "./inquirer";
 import { deployAppMsg } from "../messages";
+import config from "../config";
+import axios from "axios";
 
 export type CommonOptions = {
   log: LogFn;
@@ -396,6 +398,15 @@ const handleProjectNameConflict = async (
   }
   return projectName;
 };
+async function fetchBoilerplateDetails(): Promise<Record<string, any>[]> {
+  try {
+    const url = config.boilerplatesUrl;
+    const content = await axios.get(url);
+    return content.data.templates
+  } catch (error) {
+    throw error;
+  }
+}
 
 export {
   getOrganizations,
@@ -418,4 +429,5 @@ export {
   disconnectApp,
   formatUrl,
   handleProjectNameConflict,
+  fetchBoilerplateDetails
 };

src/util/inquirer.ts

@@ -27,6 +27,7 @@ import {
   fetchApps,
   sanitizePath,
   MarketPlaceOptions,
+  fetchBoilerplateDetails,
 } from "./common-utils";
 import { LaunchProjectRes } from "../types";
 
@@ -385,6 +386,22 @@ function inquireRequireValidation(input: any): string | boolean {
   return true;
 }
 
+const selectedBoilerplate = async (): Promise<any> => {
+  const boilerplates = await fetchBoilerplateDetails();
+
+  const response = await cliux
+    .inquire({
+      type: "search-list",
+      name: "App",
+      choices: boilerplates.map((bp) => bp.name),
+      message: "Select a boilerplate from search list",
+    })
+    .then((name) => {
+      return find(boilerplates, (boilerplate) => boilerplate.name === name);
+    });
+  return response;
+};
+
 export {
   getOrg,
   getAppName,
@@ -399,5 +416,6 @@ export {
   askProjectType,
   askConfirmation,
   selectProject,
-  askProjectName
+  askProjectName,
+  selectedBoilerplate,
 };