fix(cf): Allow deletion of non existing cluster (spinnaker#6907)

spinnaker/spinnaker#3979 Co-Authored-By: Ria Stein <eleftheria.kousathana@gmail.com>
christopherthielen · Apr 30, 2019 · 07895b0 · 07895b0
1 parent ff7d8e2
commit 07895b0
Show file tree

Hide file tree

Showing 2 changed files with 62 additions and 5 deletions.
diff --git a/...c/presentation/widgets/accountRegionClusterSelector/AccountRegionClusterSelector.spec.tsx b/...c/presentation/widgets/accountRegionClusterSelector/AccountRegionClusterSelector.spec.tsx
@@ -113,7 +113,6 @@ describe('<AccountRegionClusterSelector />', () => {
         cluster = value.cluster;
       },
       component: {
-        cluster: 'app-stack-detailOne',
         credentials: 'account-name-one',
         regions: ['region-one'],
       },
@@ -131,7 +130,6 @@ describe('<AccountRegionClusterSelector />', () => {
     expect(component.state().clusters.length).toBe(2, 'number of clusters does not match');
     expect(component.state().clusters).toContain('app-stack-detailOne');
     expect(component.state().clusters).toContain('app-stack-detailThree');
-    expect(component.state().cluster).toBe('app-stack-detailOne');
 
     const accountSelectComponent = component.find('Select[name="credentials"] .Select-control input');
     accountSelectComponent.simulate('mouseDown');
@@ -312,6 +310,54 @@ describe('<AccountRegionClusterSelector />', () => {
     expect(moniker).toEqual(expectedMoniker);
   });
 
+  it('the cluster value is updated in the component when cluster is changed to freeform value', () => {
+    let cluster = '';
+    let moniker: IMoniker = { app: '' };
+    const accountRegionClusterProps: IAccountRegionClusterSelectorProps = {
+      accounts: [
+        {
+          accountId: 'account-id-two',
+          name: 'account-name-two',
+          requiredGroupMembership: [],
+          type: 'account-type',
+        },
+        {
+          accountId: 'account-id-one',
+          name: 'account-name-one',
+          requiredGroupMembership: [],
+          type: 'account-type',
+        },
+      ],
+      application,
+      cloudProvider: 'cloud-provider',
+      clusterField: 'newCluster',
+      onComponentUpdate: (value: any) => {
+        cluster = value.newCluster;
+        moniker = value.moniker;
+      },
+      component: {
+        cluster: 'app-stack-detailOne',
+        credentials: 'account-name-one',
+        regions: ['region-one'],
+      },
+    };
+
+    const component = mount<AccountRegionClusterSelector>(
+      <AccountRegionClusterSelector {...accountRegionClusterProps} />,
+    );
+    $scope.$digest();
+
+    const clusterSelectComponent = component.find('Select[name="newCluster"] .Select-control input');
+    clusterSelectComponent.simulate('mouseDown');
+    clusterSelectComponent.simulate('change', { target: { value: 'app-stack-freeform' } });
+    clusterSelectComponent.simulate('keyDown', { keyCode: 9, key: 'Tab' });
+    $scope.$digest();
+
+    expect(cluster).toBe('app-stack-freeform');
+    expect(moniker).toBeUndefined();
+    expect(component.state().clusters).toContain('app-stack-freeform');
+  });
+
   it('initialize with form names', () => {
     const accountRegionClusterProps: IAccountRegionClusterSelectorProps = {
       accounts: [
@@ -337,6 +383,6 @@ describe('<AccountRegionClusterSelector />', () => {
 
     expect(component.find('Select[name="form.credentials"]').length).toBe(1, 'select for account not found');
     expect(component.find('Select[name="form.regions"]').length).toBe(1, 'select for regions not found');
-    expect(component.find('Select[name="form.cluster"]').length).toBe(1, 'select for cluster not found');
+    expect(component.find('StageConfigField [name="form.cluster"]').length).toBe(1, 'select for cluster not found');
   });
 });
diff --git a/...ry/src/presentation/widgets/accountRegionClusterSelector/AccountRegionClusterSelector.tsx b/...ry/src/presentation/widgets/accountRegionClusterSelector/AccountRegionClusterSelector.tsx
@@ -4,7 +4,7 @@ import { Observable, Subject } from 'rxjs';
 
 import { first, isNil, uniq } from 'lodash';
 
-import Select, { Option } from 'react-select';
+import Select, { Option, Creatable } from 'react-select';
 
 import {
   Application,
@@ -87,6 +87,11 @@ export class AccountRegionClusterSelector extends React.Component<
       .subscribe(() => {
         const clusterFilter = AppListExtractor.clusterFilterForCredentialsAndRegion(credentials, regions);
         const clusters = AppListExtractor.getClusters([application], clusterFilter);
+
+        const clusterField = this.props.component[this.state.clusterField];
+        if (clusterField && !clusters.includes(clusterField)) {
+          clusters.push(clusterField);
+        }
         this.setState({ clusters });
       });
   };
@@ -142,6 +147,12 @@ export class AccountRegionClusterSelector extends React.Component<
       moniker = clusterMoniker;
     }
 
+    if (option.className) {
+      const clusters = this.state.clusters;
+      clusters.push(clusterName);
+      this.setState(clusters);
+    }
+
     this.props.onComponentUpdate &&
       this.props.onComponentUpdate({
         ...this.props.component,
@@ -208,7 +219,7 @@ export class AccountRegionClusterSelector extends React.Component<
           </StageConfigField>
         )}
         <StageConfigField label="Cluster" helpKey={'pipeline.config.findAmi.cluster'}>
-          <Select
+          <Creatable
             name={componentName ? `${componentName}.${clusterField}` : `${clusterField}`}
             options={
               clusters &&