@spinnaker/kubernetes 0.0.0-main-2

package/src/pipelines/stages/deleteManifest/DeleteManifestOptionsForm.spec.tsx

@@ -0,0 +1,85 @@
+import type { ShallowWrapper } from 'enzyme';
+import { shallow } from 'enzyme';
+import React from 'react';
+
+import { StageConfigField } from '@spinnaker/core';
+
+import type { IDeleteManifestOptionsFormProps } from './DeleteManifestOptionsForm';
+import DeleteManifestOptionsForm from './DeleteManifestOptionsForm';
+
+describe('<DeleteManifestOptionsForm />', () => {
+  let onChangeSpy: jasmine.Spy;
+  let props: IDeleteManifestOptionsFormProps;
+  let component: ShallowWrapper<IDeleteManifestOptionsFormProps>;
+
+  beforeEach(() => {
+    onChangeSpy = jasmine.createSpy('onChangeSpy');
+    props = {
+      onOptionsChange: onChangeSpy,
+      options: {
+        cascading: true,
+        gracePeriodSeconds: 60,
+      },
+    };
+    component = shallow(<DeleteManifestOptionsForm {...props} />);
+  });
+
+  describe('view', () => {
+    it('renders a StageConfigField for Cascading and Grace Period options', () => {
+      expect(component.find(StageConfigField).length).toEqual(2);
+      expect(component.find(StageConfigField).at(0).prop('label')).toEqual('Cascading');
+      expect(component.find(StageConfigField).at(1).prop('label')).toEqual('Grace Period');
+    });
+  });
+  describe('functionality', () => {
+    it('calls `props.onOptionsChange` when cascading is toggled', () => {
+      component
+        .find(StageConfigField)
+        .at(0)
+        .find('input')
+        .simulate('change', { target: { checked: false } });
+      expect(onChangeSpy).toHaveBeenCalledWith({
+        cascading: false,
+        gracePeriodSeconds: 60,
+      });
+      component
+        .find(StageConfigField)
+        .at(0)
+        .find('input')
+        .simulate('change', { target: { checked: true } });
+      expect(onChangeSpy).toHaveBeenCalledWith({
+        cascading: true,
+        gracePeriodSeconds: 60,
+      });
+    });
+    it('calls `props.onOptionsChange` when grace period is changed', () => {
+      component
+        .find(StageConfigField)
+        .at(1)
+        .find('input')
+        .simulate('change', { target: { value: 0 } });
+      expect(onChangeSpy).toHaveBeenCalledWith({
+        cascading: true,
+        gracePeriodSeconds: 0,
+      });
+      component
+        .find(StageConfigField)
+        .at(1)
+        .find('input')
+        .simulate('change', { target: { value: 100 } });
+      expect(onChangeSpy).toHaveBeenCalledWith({
+        cascading: true,
+        gracePeriodSeconds: 100,
+      });
+      component
+        .find(StageConfigField)
+        .at(1)
+        .find('input')
+        .simulate('change', { target: { value: '' } });
+      expect(onChangeSpy).toHaveBeenCalledWith({
+        cascading: true,
+        gracePeriodSeconds: null,
+      });
+    });
+  });
+});

package/src/pipelines/stages/deleteManifest/DeleteManifestOptionsForm.tsx

@@ -0,0 +1,87 @@
+import React from 'react';
+
+import { noop, StageConfigField } from '@spinnaker/core';
+
+import type { IDeleteOptions } from '../../../manifest/delete/delete.controller';
+
+import './deleteManifestOptionsForm.less';
+
+export interface IDeleteManifestOptionsFormProps {
+  onOptionsChange: (options: IDeleteOptions) => void;
+  options: IDeleteOptions;
+}
+
+export interface IDeleteManifestOptionsFormState {
+  options: IDeleteOptions;
+}
+
+export default class DeleteManifestOptionsForm extends React.Component<
+  IDeleteManifestOptionsFormProps,
+  IDeleteManifestOptionsFormState
+> {
+  public static defaultProps: Partial<IDeleteManifestOptionsFormProps> = {
+    onOptionsChange: noop,
+    options: {
+      cascading: true,
+      gracePeriodSeconds: null,
+    },
+  };
+
+  public constructor(props: IDeleteManifestOptionsFormProps) {
+    super(props);
+    this.state = {
+      options: props.options,
+    };
+  }
+
+  private setStateAndUpdateStage = (options: IDeleteOptions) => {
+    this.props.onOptionsChange(options);
+    this.setState({ options });
+  };
+
+  private onCascadingChange = (e: any): void => {
+    this.setStateAndUpdateStage({
+      ...this.state.options,
+      cascading: e.target.checked,
+    });
+  };
+
+  private onGracePeriodChange = (e: any): void => {
+    const integerValue = parseInt(e.target.value, 10);
+    const gracePeriodSeconds = !isNaN(integerValue) ? integerValue : null;
+    this.setStateAndUpdateStage({
+      ...this.state.options,
+      gracePeriodSeconds,
+    });
+  };
+
+  public render() {
+    const {
+      options: { cascading, gracePeriodSeconds },
+    } = this.state;
+    return (
+      <>
+        <StageConfigField helpKey="kubernetes.manifest.delete.cascading" label="Cascading">
+          <div className="checkbox">
+            <input
+              checked={cascading}
+              className="delete-manifest-options-input-cascading"
+              onChange={this.onCascadingChange}
+              type="checkbox"
+            />
+          </div>
+        </StageConfigField>
+        <StageConfigField helpKey="kubernetes.manifest.delete.gracePeriod" label="Grace Period">
+          <input
+            className="form-control input-sm delete-manifest-options-input-grace-period"
+            min="0"
+            onChange={this.onGracePeriodChange}
+            type="number"
+            value={Number.isInteger(gracePeriodSeconds) ? gracePeriodSeconds : ''}
+          />
+          <span className="form-control-static">{gracePeriodSeconds === 1 ? 'second' : 'seconds'}</span>
+        </StageConfigField>
+      </>
+    );
+  }
+}

package/src/pipelines/stages/deleteManifest/DeleteManifestStageConfig.tsx

@@ -0,0 +1,62 @@
+import { defaults } from 'lodash';
+import React from 'react';
+
+import type { Application, IStage, IStageConfigProps } from '@spinnaker/core';
+
+import DeleteManifestOptionsForm from './DeleteManifestOptionsForm';
+import type { IDeleteOptions } from '../../../manifest/delete/delete.controller';
+import type { IManifestSelector } from '../../../manifest/selector/IManifestSelector';
+import { SelectorMode } from '../../../manifest/selector/IManifestSelector';
+import { ManifestSelector } from '../../../manifest/selector/ManifestSelector';
+
+export interface IKubernetesManifestStageConfigProps extends IStageConfigProps {
+  application: Application;
+  stage: IManifestSelector & IStage;
+  stageFieldUpdated: () => void;
+}
+
+export class DeleteManifestStageConfig extends React.Component<IKubernetesManifestStageConfigProps> {
+  public componentDidMount = (): void => {
+    defaults(this.props.stage, {
+      app: this.props.application.name,
+      cloudProvider: 'kubernetes',
+    });
+    if (this.props.stage.isNew) {
+      this.props.stage.options = {
+        gracePeriodSeconds: null,
+        cascading: true,
+      };
+    }
+    this.props.stageFieldUpdated();
+  };
+
+  private onChange = (stage: IManifestSelector): void => {
+    Object.assign(this.props.stage, stage);
+    this.props.stageFieldUpdated();
+  };
+
+  private onOptionsChange = (options: IDeleteOptions): void => {
+    this.props.stage.options = options;
+    this.props.stageFieldUpdated();
+  };
+
+  public render() {
+    const selector = { ...this.props.stage };
+    return (
+      <div className="form-horizontal">
+        <h4>Manifest</h4>
+        <div className="horizontal-rule" />
+        <ManifestSelector
+          application={this.props.application}
+          selector={selector}
+          modes={[SelectorMode.Static, SelectorMode.Dynamic, SelectorMode.Label]}
+          onChange={this.onChange}
+          includeSpinnakerKinds={null}
+        />
+        <h4>Settings</h4>
+        <div className="horizontal-rule" />
+        <DeleteManifestOptionsForm onOptionsChange={this.onOptionsChange} options={this.props.stage.options} />
+      </div>
+    );
+  }
+}

package/src/pipelines/stages/deleteManifest/deleteManifestOptionsForm.less

@@ -0,0 +1,9 @@
+.checkbox input[type='checkbox'].delete-manifest-options-input-cascading {
+  margin-left: 0;
+}
+
+.delete-manifest-options-input-grace-period {
+  display: inline-block;
+  margin-right: 5px;
+  max-width: 75px;
+}

package/src/pipelines/stages/deleteManifest/deleteManifestStage.ts

@@ -0,0 +1,21 @@
+import type { IStage } from '@spinnaker/core';
+import { ExecutionDetailsTasks, Registry } from '@spinnaker/core';
+
+import { DeleteManifestStageConfig } from './DeleteManifestStageConfig';
+import { manifestExecutionDetails } from '../ManifestExecutionDetails';
+import { manifestSelectorValidators } from '../validators/manifestSelectorValidators';
+
+const STAGE_NAME = 'Delete (Manifest)';
+const STAGE_KEY = 'deleteManifest';
+
+Registry.pipeline.registerStage({
+  label: STAGE_NAME,
+  description: 'Destroy a Kubernetes object created from a manifest.',
+  key: STAGE_KEY,
+  cloudProvider: 'kubernetes',
+  component: DeleteManifestStageConfig,
+  executionDetailsSections: [manifestExecutionDetails(STAGE_KEY), ExecutionDetailsTasks],
+  accountExtractor: (stage: IStage): string[] => (stage.context.account ? [stage.context.account] : []),
+  configAccountExtractor: (stage: any): string[] => (stage.account ? [stage.account] : []),
+  validators: manifestSelectorValidators(STAGE_NAME),
+});

package/src/pipelines/stages/deployManifest/CopyFromTemplateButton.tsx

@@ -0,0 +1,45 @@
+import React from 'react';
+
+import type { Application, IManifest } from '@spinnaker/core';
+
+import { ManifestCopier } from './ManifestCopier';
+
+export interface ICopyFromTemplateProps {
+  application: Application;
+  handleCopy(manifest: IManifest): void;
+}
+
+export interface ICopyFromTemplateState {
+  show: boolean;
+}
+
+export class CopyFromTemplateButton extends React.Component<ICopyFromTemplateProps, ICopyFromTemplateState> {
+  constructor(props: ICopyFromTemplateProps) {
+    super(props);
+    this.state = { show: false };
+  }
+
+  private toggle = () => this.setState({ show: !this.state.show });
+
+  private handleManifestSelected = (manifest: IManifest) => {
+    this.props.handleCopy(manifest);
+    this.toggle();
+  };
+
+  public render() {
+    return (
+      <>
+        <ManifestCopier
+          show={this.state.show}
+          application={this.props.application}
+          cloudProvider="kubernetes"
+          onDismiss={this.toggle}
+          onManifestSelected={this.handleManifestSelected}
+        />
+        <button className="link" onClick={this.toggle} style={{ paddingLeft: 0 }}>
+          Copy from running infrastructure
+        </button>
+      </>
+    );
+  }
+}

package/src/pipelines/stages/deployManifest/DeployManifestStageConfig.tsx

@@ -0,0 +1,77 @@
+import { cloneDeep } from 'lodash';
+import React from 'react';
+import { from as observableFrom, Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+
+import type { IAccountDetails, IStage, IStageConfigProps } from '@spinnaker/core';
+import { AccountService, FormikStageConfig } from '@spinnaker/core';
+
+import { DeployManifestStageForm } from './DeployManifestStageForm';
+import { defaultTrafficManagementConfig } from './ManifestDeploymentOptions';
+import { ManifestSource } from '../../../manifest/ManifestSource';
+
+interface IDeployManifestStageConfigState {
+  accounts: IAccountDetails[];
+}
+
+export class DeployManifestStageConfig extends React.Component<IStageConfigProps, IDeployManifestStageConfigState> {
+  private stage: IStage;
+  private destroy$ = new Subject();
+
+  public constructor(props: IStageConfigProps) {
+    super(props);
+    this.state = {
+      accounts: [],
+    };
+    const { stage: initialStageConfig } = props;
+    const stage = cloneDeep(initialStageConfig);
+    if (!stage.source) {
+      stage.source = ManifestSource.TEXT;
+    }
+    if (!stage.skipExpressionEvaluation) {
+      stage.skipExpressionEvaluation = false;
+    }
+    if (!stage.trafficManagement) {
+      stage.trafficManagement = defaultTrafficManagementConfig;
+    }
+    if (!stage.cloudProvider) {
+      stage.cloudProvider = 'kubernetes';
+    }
+    if (!stage.moniker) {
+      stage.moniker = {};
+    }
+    if (!stage.moniker.app) {
+      stage.moniker.app = props.application.name;
+    }
+    // Intentionally initializing the stage config only once in the constructor
+    // The stage config is then completely owned within FormikStageConfig's Formik state
+    this.stage = stage;
+  }
+
+  public componentDidMount() {
+    this.fetchAccounts();
+  }
+
+  private fetchAccounts = (): void => {
+    observableFrom(AccountService.getAllAccountDetailsForProvider('kubernetes'))
+      .pipe(takeUntil(this.destroy$))
+      .subscribe((accounts: IAccountDetails[]) => {
+        this.setState({ accounts });
+      });
+  };
+
+  public componentWillUnmount() {
+    this.destroy$.next();
+  }
+
+  public render() {
+    return (
+      <FormikStageConfig
+        {...this.props}
+        stage={this.stage}
+        onChange={this.props.updateStage}
+        render={(props) => <DeployManifestStageForm {...props} accounts={this.state.accounts} />}
+      />
+    );
+  }
+}

package/src/pipelines/stages/deployManifest/DeployManifestStageForm.tsx

@@ -0,0 +1,265 @@
+import { capitalize, get, isEmpty, map } from 'lodash';
+import React from 'react';
+import type { Option } from 'react-select';
+
+import type {
+  IAccountDetails,
+  IArtifact,
+  IExpectedArtifact,
+  IFormikStageConfigInjectedProps,
+  IManifest,
+} from '@spinnaker/core';
+import {
+  ArtifactTypePatterns,
+  CheckboxInput,
+  RadioButtonInput,
+  SETTINGS,
+  StageArtifactSelectorDelegate,
+  StageConfigField,
+  yamlDocumentsToString,
+  YamlEditor,
+} from '@spinnaker/core';
+
+import { CopyFromTemplateButton } from './CopyFromTemplateButton';
+import type { IManifestBindArtifact } from './ManifestBindArtifactsSelector';
+import { ManifestBindArtifactsSelector } from './ManifestBindArtifactsSelector';
+import { ManifestDeploymentOptions } from './ManifestDeploymentOptions';
+import { NamespaceSelector } from './NamespaceSelector';
+import { ManifestSource } from '../../../manifest/ManifestSource';
+import type { IManifestLabelSelector } from '../../../manifest/selector/IManifestLabelSelector';
+import type { IManifestSelector } from '../../../manifest/selector/IManifestSelector';
+import { SelectorMode } from '../../../manifest/selector/IManifestSelector';
+import LabelEditor from '../../../manifest/selector/labelEditor/LabelEditor';
+import { ManifestBasicSettings } from '../../../manifest/wizard/BasicSettings';
+
+interface IDeployManifestStageConfigFormProps {
+  accounts: IAccountDetails[];
+  selector?: IManifestSelector;
+  modes?: SelectorMode.Label;
+}
+
+interface IDeployManifestStageConfigFormState {
+  rawManifest: string;
+  overrideNamespace: boolean;
+  selector: IManifestSelector;
+  labelSelectors: IManifestLabelSelector[];
+}
+
+export class DeployManifestStageForm extends React.Component<
+  IDeployManifestStageConfigFormProps & IFormikStageConfigInjectedProps,
+  IDeployManifestStageConfigFormState
+> {
+  private readonly excludedManifestArtifactTypes = [
+    ArtifactTypePatterns.DOCKER_IMAGE,
+    ArtifactTypePatterns.KUBERNETES,
+    ArtifactTypePatterns.FRONT50_PIPELINE_TEMPLATE,
+    ArtifactTypePatterns.MAVEN_FILE,
+  ];
+
+  public constructor(props: IDeployManifestStageConfigFormProps & IFormikStageConfigInjectedProps) {
+    super(props);
+    const stage = this.props.formik.values;
+    const manifests: any[] = get(props.formik.values, 'manifests');
+    const isTextManifest: boolean = get(props.formik.values, 'source') === ManifestSource.TEXT;
+    this.state = {
+      rawManifest: !isEmpty(manifests) && isTextManifest ? yamlDocumentsToString(manifests) : '',
+      overrideNamespace: get(stage, 'namespaceOverride', '') !== '',
+      selector: {
+        account: '',
+        location: '',
+        mode: SelectorMode.Label,
+        labelSelectors: { selectors: [] },
+      },
+      labelSelectors: [],
+    };
+  }
+
+  private getSourceOptions = (): Array<Option<string>> => {
+    return map([ManifestSource.TEXT, ManifestSource.ARTIFACT], (option) => ({
+      label: capitalize(option),
+      value: option,
+    }));
+  };
+
+  private handleCopy = (manifest: IManifest): void => {
+    this.props.formik.setFieldValue('manifests', [manifest]);
+    this.setState({
+      rawManifest: yamlDocumentsToString([manifest]),
+    });
+  };
+
+  private handleRawManifestChange = (rawManifest: string, manifests: any): void => {
+    this.setState({
+      rawManifest,
+    });
+    this.props.formik.setFieldValue('manifests', manifests);
+  };
+
+  private onManifestArtifactSelected = (expectedArtifactId: string): void => {
+    this.props.formik.setFieldValue('manifestArtifactId', expectedArtifactId);
+    this.props.formik.setFieldValue('manifestArtifact', null);
+  };
+
+  private onManifestArtifactEdited = (artifact: IArtifact) => {
+    this.props.formik.setFieldValue('manifestArtifactId', null);
+    this.props.formik.setFieldValue('manifestArtifact', artifact);
+  };
+
+  private getRequiredArtifacts = (): IManifestBindArtifact[] => {
+    const { requiredArtifactIds, requiredArtifacts } = this.props.formik.values;
+    return (requiredArtifactIds || [])
+      .map((id: string) => ({ expectedArtifactId: id }))
+      .concat(requiredArtifacts || []);
+  };
+
+  private onRequiredArtifactsChanged = (bindings: IManifestBindArtifact[]): void => {
+    this.props.formik.setFieldValue(
+      'requiredArtifactIds',
+      bindings.filter((b) => b.expectedArtifactId).map((b) => b.expectedArtifactId),
+    );
+    this.props.formik.setFieldValue(
+      'requiredArtifacts',
+      bindings.filter((b) => b.artifact),
+    );
+  };
+
+  private overrideNamespaceChange(checked: boolean) {
+    if (!checked) {
+      this.props.formik.setFieldValue('namespaceOverride', '');
+    }
+    this.setState({ overrideNamespace: checked });
+  }
+
+  public render() {
+    const stage = this.props.formik.values;
+    return (
+      <div className="form-horizontal">
+        <h4>Basic Settings</h4>
+        <ManifestBasicSettings
+          accounts={this.props.accounts}
+          onAccountSelect={(accountName) => this.props.formik.setFieldValue('account', accountName)}
+          selectedAccount={stage.account}
+        />
+        <StageConfigField label="Override Namespace">
+          <CheckboxInput
+            checked={this.state.overrideNamespace}
+            onChange={(e: any) => this.overrideNamespaceChange(e.target.checked)}
+          />
+        </StageConfigField>
+        {this.state.overrideNamespace && (
+          <StageConfigField label="Namespace">
+            <NamespaceSelector
+              createable={true}
+              accounts={this.props.accounts}
+              selectedAccount={stage.account}
+              selectedNamespace={stage.namespaceOverride || ''}
+              onChange={(namespace) => this.props.formik.setFieldValue('namespaceOverride', namespace)}
+            />
+          </StageConfigField>
+        )}
+        <hr />
+        <h4>Manifest Configuration</h4>
+        <StageConfigField label="Manifest Source" helpKey="kubernetes.manifest.source">
+          <RadioButtonInput
+            options={this.getSourceOptions()}
+            onChange={(e: any) => this.props.formik.setFieldValue('source', e.target.value)}
+            value={stage.source}
+          />
+        </StageConfigField>
+        {stage.source === ManifestSource.TEXT && (
+          <StageConfigField label="Manifest">
+            <CopyFromTemplateButton application={this.props.application} handleCopy={this.handleCopy} />
+            <YamlEditor onChange={this.handleRawManifestChange} value={this.state.rawManifest} />
+          </StageConfigField>
+        )}
+        {stage.source === ManifestSource.ARTIFACT && (
+          <>
+            <StageArtifactSelectorDelegate
+              artifact={stage.manifestArtifact}
+              excludedArtifactTypePatterns={this.excludedManifestArtifactTypes}
+              expectedArtifactId={stage.manifestArtifactId}
+              helpKey="kubernetes.manifest.expectedArtifact"
+              label="Manifest Artifact"
+              onArtifactEdited={this.onManifestArtifactEdited}
+              onExpectedArtifactSelected={(artifact: IExpectedArtifact) => this.onManifestArtifactSelected(artifact.id)}
+              pipeline={this.props.pipeline}
+              stage={stage}
+            />
+            <StageConfigField label="Expression Evaluation" helpKey="kubernetes.manifest.skipExpressionEvaluation">
+              <CheckboxInput
+                checked={stage.skipExpressionEvaluation === true}
+                onChange={(e: any) => this.props.formik.setFieldValue('skipExpressionEvaluation', e.target.checked)}
+                text="Skip SpEL expression evaluation"
+              />
+            </StageConfigField>
+          </>
+        )}
+        <StageConfigField label="Required Artifacts to Bind" helpKey="kubernetes.manifest.requiredArtifactsToBind">
+          <ManifestBindArtifactsSelector
+            bindings={this.getRequiredArtifacts()}
+            onChangeBindings={this.onRequiredArtifactsChanged}
+            pipeline={this.props.pipeline}
+            stage={stage}
+          />
+        </StageConfigField>
+        {SETTINGS.feature.deployManifestStageAdvancedConfiguration && (
+          <>
+            <hr />
+            <h4>Deploy Configuration</h4>
+            <StageConfigField label="Skip Spec Template Labels" helpKey="kubernetes.manifest.skipSpecTemplateLabels">
+              <CheckboxInput
+                checked={stage.skipSpecTemplateLabels === true}
+                onChange={(e: any) => this.props.formik.setFieldValue('skipSpecTemplateLabels', e.target.checked)}
+              />
+            </StageConfigField>
+            <StageConfigField label="Label Selectors" helpKey="kubernetes.manifest.deployLabelSelectors">
+              <CheckboxInput
+                checked={stage.labelSelectors != null}
+                onChange={(e: any) => {
+                  if (e.target.checked) {
+                    this.props.formik.setFieldValue('labelSelectors', { selectors: [] });
+                    this.props.formik.setFieldValue('allowNothingSelected', false);
+                  } else {
+                    this.props.formik.setFieldValue('labelSelectors', null);
+                    this.props.formik.setFieldValue('allowNothingSelected', null);
+                  }
+                }}
+              />
+            </StageConfigField>
+            {stage.labelSelectors && stage.labelSelectors.selectors && (
+              <>
+                <StageConfigField label="Labels">
+                  <LabelEditor
+                    labelSelectors={this.props.formik.values.labelSelectors.selectors}
+                    onLabelSelectorsChange={this.handleLabelSelectorsChange}
+                  />
+                </StageConfigField>
+                <StageConfigField
+                  label="Allow nothing selected"
+                  helpKey="kubernetes.manifest.deployLabelSelectors.allowNothingSelected"
+                >
+                  <CheckboxInput
+                    checked={stage.allowNothingSelected === true}
+                    onChange={(e: any) => this.props.formik.setFieldValue('allowNothingSelected', e.target.checked)}
+                  />
+                </StageConfigField>
+              </>
+            )}
+          </>
+        )}
+        <hr />
+        <ManifestDeploymentOptions
+          accounts={this.props.accounts}
+          config={stage.trafficManagement}
+          onConfigChange={(config) => this.props.formik.setFieldValue('trafficManagement', config)}
+          selectedAccount={stage.account}
+        />
+      </div>
+    );
+  }
+
+  private handleLabelSelectorsChange = (labelSelectors: IManifestLabelSelector[]): void => {
+    this.setState({ labelSelectors });
+    this.props.formik.setFieldValue('labelSelectors.selectors', labelSelectors);
+  };
+}