[create-sitecore-jss] New initializer journey for Angular

CHANGELOG.md

@@ -13,6 +13,18 @@ Our versioning strategy is as follows:
 
 ### 🐛 Bug Fixes
 
+### 🎉 New Features & Improvements
+
+### 🛠 Breaking Change
+
+* `[create-sitecore-jss]` Rework Angular initializer to support XMCloud and SXP journeys ([#1845](https://github.com/Sitecore/jss/pull/1845))
+
+### 🧹 Chores
+
+## 22.1.0
+
+### 🐛 Bug Fixes
+
 * `[templates/nextjs]` `[templates/react]` `[templates/vue]` `[templates/angular]` Changed formatting in temp/config to prevent parse issues in Unix systems ([#1787](https://github.com/Sitecore/jss/pull/1787))([#1791](https://github.com/Sitecore/jss/pull/1791))
 * `[templates/nextjs-sxa]` The banner variant of image component is fixed with supporting metadata mode. ([#1826](https://github.com/Sitecore/jss/pull/1826))
 * `[sitecore-jss]` `[sitecore-jss-react]` DateField empty value is not treated as empty ([#1836](https://github.com/Sitecore/jss/pull/1836))

packages/create-sitecore-jss/src/initializers/angular-sxp/index.ts

@@ -0,0 +1,17 @@
+import { ClientAppArgs, DEFAULT_APPNAME, Initializer } from '../../common';
+import { InitializerResults } from '../../common/Initializer';
+
+export default class AngularXmCloudInitializer implements Initializer {
+  get isBase(): boolean {
+    return false;
+  }
+
+  async init(args: ClientAppArgs) {
+    const response: InitializerResults = {
+      nextSteps: [],
+      appName: args.appName || DEFAULT_APPNAME,
+    };
+
+    return response;
+  }
+}

packages/create-sitecore-jss/src/initializers/angular-xmcloud/index.ts

@@ -0,0 +1,17 @@
+import { ClientAppArgs, DEFAULT_APPNAME, Initializer } from '../../common';
+import { InitializerResults } from '../../common/Initializer';
+
+export default class AngularXmCloudInitializer implements Initializer {
+  get isBase(): boolean {
+    return false;
+  }
+
+  async init(args: ClientAppArgs) {
+    const response: InitializerResults = {
+      nextSteps: [],
+      appName: args.appName || DEFAULT_APPNAME,
+    };
+
+    return response;
+  }
+}

packages/create-sitecore-jss/src/initializers/angular/index.ts

@@ -19,10 +19,25 @@ export default class AngularInitializer implements Initializer {
     };
     const templatePath = path.resolve(__dirname, '../../templates/angular');
     await transform(templatePath, mergedArgs);
+    const addInitializers: string[] = [];
+
+    if (answers.xmcloud) {
+      if (!args.templates.includes('angular-xmcloud')) {
+        addInitializers.push('angular-xmcloud');
+      }
+      if (!args.templates.includes('node-xmcloud-proxy')) {
+        addInitializers.push('node-xmcloud-proxy');
+      }
+    } else {
+      if (!args.templates.includes('angular-sxp')) {
+        addInitializers.push('angular-sxp');
+      }
+    }
 
     const response = {
       nextSteps: [`* Connect to Sitecore with ${chalk.green('jss setup')} (optional)`],
       appName: answers.appName,
+      initializers: addInitializers,
     };
 
     return response;

packages/create-sitecore-jss/src/initializers/angular/prompts.ts

@@ -5,6 +5,31 @@ import {
   styleguidePrompts,
 } from '../../common';
 
-export type AngularAnswer = ClientAppAnswer & StyleguideAnswer;
+export type AngularAnswer = ClientAppAnswer &
+  StyleguideAnswer & {
+    xmcloud: boolean;
+  };
 
-export const prompts = [...clientAppPrompts, ...styleguidePrompts];
+export const prompts = [
+  ...clientAppPrompts,
+  {
+    type: 'confirm',
+    name: 'xmcloud',
+    message: 'Are you building for Sitecore XM Cloud?',
+    default: false,
+    when: (answers: AngularAnswer): boolean => {
+      // don't prompt if --yes or angular-xmcloud template was specified
+      if (answers.yes) {
+        return false;
+      } else if (
+        answers.templates.includes('angular-xmcloud') &&
+        !answers.templates.includes('angular-sxp')
+      ) {
+        answers.xmcloud = true;
+        return false;
+      }
+      return true;
+    },
+  },
+  ...styleguidePrompts,
+];

packages/create-sitecore-jss/src/initializers/node-xmcloud-proxy/index.ts

@@ -0,0 +1,15 @@
+import { Initializer } from '../../common';
+
+export default class AngularXmCloudInitializer implements Initializer {
+  get isBase(): boolean {
+    return false;
+  }
+
+  async init() {
+    const response = {
+      appName: 'node-xmcloud-proxy',
+    };
+
+    return response;
+  }
+}