changed create component workflow and the application name generated based on the starter project selected (#2433)

Author: msivasubramaniaan

src/openshift/component.ts

@@ -536,10 +536,9 @@ export class Component extends OpenShiftItem {
     }
 
     @vsCommand('openshift.componentType.newComponent')
-    public static async createComponentFromCatalogEntry(context: DevfileComponentType | StarterProject, appName?: string, registryName?: string): Promise<string> {
+    public static async createComponentFromCatalogEntry(context: DevfileComponentType | StarterProject, registryName?: string): Promise<string> {
         const application = await Component.getOpenShiftCmdData(undefined,
-            'Select an Application where you want to create a Component', undefined, undefined,
-            appName
+            'Select an Application where you want to create a Component', undefined, undefined
         );
 
         if (!application) return null;
@@ -605,7 +604,7 @@ export class Component extends OpenShiftItem {
 
     @vsCommand('openshift.component.createFromRootWorkspaceFolder')
     static async createFromRootWorkspaceFolder(folder: Uri, selection: Uri[], context: OpenShiftApplication, componentTypeName?: string, starterProjectName?: string, registryName?: string, notification = true): Promise<string | null> {
-        const application = await Component.getOpenShiftCmdData(context,
+        let application = await Component.getOpenShiftCmdData(context,
             'Select an Application where you want to create a Component'
         );
 
@@ -622,19 +621,8 @@ export class Component extends OpenShiftItem {
             if (devfileYaml && devfileYaml.metadata && devfileYaml.metadata.name) {
                 initialNameValue = devfileYaml.metadata.name;
             }
-        } else {
-            initialNameValue = starterProjectName || path.basename(folder.fsPath);
         }
 
-        const componentName = await Component.getName(
-            'Name',
-            application.getParent().getParent() ? Component.odo.getComponents(application) : Promise.resolve([]),
-            application.getName(),
-            initialNameValue
-        );
-
-        if (!componentName) return createCancelledResult('componentName');
-
         const progressIndicator = window.createQuickPick();
 
         let createStarter: string;
@@ -699,9 +687,19 @@ export class Component extends OpenShiftItem {
                         }
                     }
                 }
+                application = application.getName() === 'app' ?
+                    new OpenShiftApplication(application.getParent(), `app-${createStarter}`) : application;
             }
         }
 
+        const componentName = await Component.getName(
+            'Name',
+            application.getParent().getParent() ? Component.odo.getComponents(application) : Promise.resolve([]),
+            application.getName(),
+            initialNameValue?.trim().length > 0 ? initialNameValue : createStarter
+        );
+
+        if (!componentName) return createCancelledResult('componentName');
         const refreshComponentsView = workspace.getWorkspaceFolder(folder);
         const creatComponentProperties: NewComponentCommandProps = {
             'component_kind': 'devfile',

src/openshift/openshiftItem.ts

@@ -180,7 +180,7 @@ export default class OpenShiftItem {
         return urlList;
     }
 
-    static async getOpenShiftCmdData<T extends OpenShiftObject>(treeItem: T, appPlaceholder?: string, compPlaceholder?: string, condition?: (value: OpenShiftObject) => boolean, appName?: string): Promise<T | null>  {
+    static async getOpenShiftCmdData<T extends OpenShiftObject>(treeItem: T, appPlaceholder?: string, compPlaceholder?: string, condition?: (value: OpenShiftObject) => boolean): Promise<T | null> {
         let context: OpenShiftObject | QuickPickCommand = treeItem;
         let project: OpenShiftObject;
         if (!context) {
@@ -231,7 +231,7 @@ export default class OpenShiftItem {
                 context = await window.showQuickPick<OpenShiftObject | QuickPickCommand>(applicationList, {placeHolder: appPlaceholder, ignoreFocusOut: true});
             }
             if (context && isCommand(context)) {
-                const newAppName = appName || await context.command();
+                const newAppName = 'app';
                 if (newAppName) {
                     context = new OpenShiftApplication(project, newAppName);
                 } else {

src/webview/devfile-registry/app/cardItem.tsx

@@ -91,7 +91,6 @@ export class CardItem extends React.Component<DevFileProps, {
                 'action': 'createComponent',
                 'devFile': this.props.compDescription.Devfile,
                 'selectedProject': this.state.selectedProject,
-                'appName': 'app-' + this.state.selectedProject.name,
                 'registryName': this.props.compDescription.RegistryName
             });
         return;

src/webview/devfile-registry/registryViewLoader.ts

@@ -33,9 +33,8 @@ async function devfileRegistryViewerMessageListener(event: any): Promise<any> {
             );
             break;
         case 'createComponent':
-            const appName = event.appName;
             const registryName = event.registryName;
-            vscode.commands.executeCommand('openshift.componentType.newComponent', starterProject, appName, registryName);
+            vscode.commands.executeCommand('openshift.componentType.newComponent', starterProject, registryName);
             break;
         case 'cloneToWorkSpace':
             vscode.commands.executeCommand('openshift.componentType.cloneStarterProjectRepository', starterProject);