@spinnaker/cloudfoundry 0.0.0-main-2

package/src/presentation/widgets/accountRegionClusterSelector/FormikAccountRegionClusterSelector.tsx

@@ -0,0 +1,164 @@
+import type { FormikProps } from 'formik';
+import { get } from 'lodash';
+import React from 'react';
+import { from as observableFrom, Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+
+import type { Application, IAccount, IServerGroup, IServerGroupFilter } from '@spinnaker/core';
+import { AppListExtractor, FormikFormField, ReactSelectInput } from '@spinnaker/core';
+import type { ICloudFoundryCreateServerGroupCommand } from '../../../serverGroup';
+
+export interface IFormikAccountRegionClusterSelectorProps {
+  accounts: IAccount[];
+  application: Application;
+  cloudProvider: string;
+  clusterField?: string;
+  componentName?: string;
+  credentialsField?: string;
+  formik: FormikProps<ICloudFoundryCreateServerGroupCommand>;
+}
+
+export interface IFormikAccountRegionClusterSelectorState {
+  availableRegions: string[];
+  cloudProvider: string;
+  clusterField: string;
+  clusters: string[];
+  componentName: string;
+  credentialsField: string;
+}
+
+export class FormikAccountRegionClusterSelector extends React.Component<
+  IFormikAccountRegionClusterSelectorProps,
+  IFormikAccountRegionClusterSelectorState
+> {
+  private destroy$ = new Subject();
+
+  constructor(props: IFormikAccountRegionClusterSelectorProps) {
+    super(props);
+    const credentialsField = props.credentialsField || 'credentials';
+    const clusterField = props.clusterField || 'cluster';
+    this.state = {
+      availableRegions: [],
+      cloudProvider: props.cloudProvider,
+      clusterField,
+      clusters: [],
+      componentName: props.componentName || '',
+      credentialsField,
+    };
+  }
+
+  public componentDidMount(): void {
+    const { componentName, formik } = this.props;
+    const { credentialsField } = this.state;
+    const credentials = get(
+      formik.values,
+      componentName ? `${componentName}.${credentialsField}` : `${credentialsField}`,
+      undefined,
+    );
+    const region = get(formik.values, componentName ? `${componentName}.region` : 'region', undefined);
+    this.setRegionList(credentials);
+    this.setClusterList(credentials, [region]);
+  }
+
+  public componentWillUnmount(): void {
+    this.destroy$.next();
+  }
+
+  private setRegionList = (credentials: string): void => {
+    const { application } = this.props;
+    const accountFilter: IServerGroupFilter = (serverGroup: IServerGroup) =>
+      serverGroup ? serverGroup.account === credentials : true;
+    observableFrom(application.ready())
+      .pipe(takeUntil(this.destroy$))
+      .subscribe(() => {
+        const availableRegions = AppListExtractor.getRegions([application], accountFilter);
+        availableRegions.sort();
+        this.setState({ availableRegions });
+      });
+  };
+
+  private setClusterList = (credentials: string, regions: string[]): void => {
+    const { application } = this.props;
+    observableFrom(application.ready())
+      .pipe(takeUntil(this.destroy$))
+      .subscribe(() => {
+        const clusterFilter = AppListExtractor.clusterFilterForCredentialsAndRegion(credentials, regions);
+        const clusters = AppListExtractor.getClusters([application], clusterFilter);
+        this.setState({ clusters });
+      });
+  };
+
+  public accountChanged = (credentials: string): void => {
+    this.setRegionList(credentials);
+    this.setClusterList(credentials, []);
+  };
+
+  public regionChanged = (region: string): void => {
+    const { componentName, formik } = this.props;
+    const { credentialsField } = this.state;
+    const credentials = get(
+      formik.values,
+      componentName ? `${componentName}.${credentialsField}` : `${credentialsField}`,
+      undefined,
+    );
+    this.setClusterList(credentials, [region]);
+  };
+
+  public render() {
+    const { accounts } = this.props;
+    const { credentialsField, availableRegions, clusters, clusterField, componentName } = this.state;
+    return (
+      <div className="col-md-9">
+        <div className="sp-margin-m-bottom">
+          <FormikFormField
+            name={componentName ? `${componentName}.${credentialsField}` : `${credentialsField}`}
+            label="Account"
+            input={(props) => (
+              <ReactSelectInput
+                inputClassName="cloudfoundry-react-select"
+                {...props}
+                stringOptions={accounts && accounts.map((acc: IAccount) => acc.name)}
+                clearable={false}
+              />
+            )}
+            onChange={this.accountChanged}
+            required={true}
+          />
+        </div>
+
+        <div className="sp-margin-m-bottom">
+          <FormikFormField
+            name={componentName ? `${componentName}.region` : 'region'}
+            label="Region"
+            input={(props) => (
+              <ReactSelectInput
+                inputClassName="cloudfoundry-react-select"
+                {...props}
+                stringOptions={availableRegions}
+                clearable={false}
+              />
+            )}
+            onChange={this.regionChanged}
+            required={true}
+          />
+        </div>
+
+        <div className="sp-margin-m-bottom">
+          <FormikFormField
+            name={componentName ? `${componentName}.${clusterField}` : `${clusterField}`}
+            label="Cluster"
+            input={(props) => (
+              <ReactSelectInput
+                inputClassName="cloudfoundry-react-select"
+                {...props}
+                stringOptions={clusters}
+                clearable={false}
+              />
+            )}
+            required={true}
+          />
+        </div>
+      </div>
+    );
+  }
+}

package/src/presentation/widgets/accountRegionClusterSelector/index.ts

@@ -0,0 +1,2 @@
+export * from './AccountRegionClusterSelector';
+export * from './FormikAccountRegionClusterSelector';

package/src/presentation/widgets/index.ts

@@ -0,0 +1 @@
+export * from './accountRegionClusterSelector/';

package/src/presentation/widgets/recentLogs/CloudFoundryRecentLogs.tsx

@@ -0,0 +1,112 @@
+import { bindAll } from 'lodash';
+import React from 'react';
+import { Button, Modal } from 'react-bootstrap';
+
+import type { IInstanceConsoleOutput } from '@spinnaker/core';
+import { InstanceReader } from '@spinnaker/core';
+
+export enum CloudFoundryRecentLogsType {
+  APP = 'app',
+  TASK = 'task',
+}
+
+export interface ICloudFoundryRecentLogsProps {
+  account: string;
+  region: string;
+  resourceDisplayName: string;
+  resourceGuid: string;
+  logsType: CloudFoundryRecentLogsType;
+  resourceInstanceIndex?: number;
+}
+
+export interface ICloudFoundryRecentLogsState {
+  logs: string;
+  showModal: boolean;
+  errorMessage: string;
+}
+
+export class CloudFoundryRecentLogs extends React.Component<
+  ICloudFoundryRecentLogsProps,
+  ICloudFoundryRecentLogsState
+> {
+  constructor(props: ICloudFoundryRecentLogsProps) {
+    super(props);
+    this.state = {
+      logs: '',
+      showModal: false,
+      errorMessage: null,
+    };
+    bindAll(this, ['open', 'close', 'onClick']);
+  }
+
+  private canShow(): boolean {
+    const { resourceGuid } = this.props;
+    return resourceGuid !== ''; // or null?
+  }
+
+  private generateResourceId(): string {
+    const { resourceGuid, logsType, resourceInstanceIndex } = this.props;
+    const optionalInstanceIndex = logsType === CloudFoundryRecentLogsType.APP ? `:${resourceInstanceIndex}` : '';
+    return `${logsType}:${resourceGuid}${optionalInstanceIndex}`;
+  }
+
+  public close() {
+    this.setState({ showModal: false });
+  }
+
+  public open() {
+    this.setState({ showModal: true });
+  }
+
+  public onClick() {
+    const { account, region } = this.props;
+    InstanceReader.getConsoleOutput(account, region, this.generateResourceId(), 'cloudfoundry')
+      .then((response: IInstanceConsoleOutput) => {
+        this.setState({
+          logs: response.output as string,
+        });
+        this.open();
+      })
+      .catch((exception: any) => {
+        this.setState({ errorMessage: exception.data.message });
+        this.open();
+      });
+  }
+
+  public render() {
+    const { showModal, logs, errorMessage } = this.state;
+    if (this.canShow()) {
+      return (
+        <div>
+          <a onClick={this.onClick} className="clickable">
+            Recent
+          </a>
+          <Modal show={showModal} onHide={this.close} dialogClassName="modal-lg modal-fullscreen">
+            <Modal.Header closeButton={true}>
+              <Modal.Title>Recent logs</Modal.Title>
+              <h5>
+                CloudFoundry {this.props.logsType.valueOf()} name: {this.props.resourceDisplayName}
+              </h5>
+            </Modal.Header>
+            <Modal.Body>
+              {logs.length > 0 && (
+                <>
+                  <pre className="body-small">{logs}</pre>
+                </>
+              )}
+
+              {logs.length === 0 && <>No logs returned.</>}
+
+              {errorMessage && <pre className="body-small">{errorMessage}</pre>}
+            </Modal.Body>
+            <Modal.Footer>
+              <Button onClick={this.close}>Close</Button>
+            </Modal.Footer>
+          </Modal>
+        </div>
+      );
+    } else {
+      return null;
+    }
+  }
+}

package/src/routeDomains/index.ts

@@ -0,0 +1 @@
+export * from './routeDomainSelectField';

package/src/routeDomains/routeDomainSelectField.tsx

@@ -0,0 +1,48 @@
+import React from 'react';
+
+import type { ICloudFoundryDomain } from '../domain';
+
+export interface IRouteDomainSelectFieldProps {
+  account: string;
+  component: { [key: string]: any };
+  field: string;
+  fieldColumns?: number;
+  labelColumns: number;
+  onChange: (domain: string) => void;
+  readOnly?: boolean;
+  domains: ICloudFoundryDomain[];
+}
+
+export function RouteDomainSelectField(props: IRouteDomainSelectFieldProps) {
+  return (
+    <div className="form-group">
+      <div className={`col-md-${props.labelColumns} sm-label-right`}>Domain</div>
+      {!props.account && <div className={`col-md-${props.fieldColumns || 7}`}>(Select an account)</div>}
+      <div className={`col-md-${props.fieldColumns || 7}`}>
+        {props.account && !props.readOnly && (
+          <select
+            className="form-control input-sm"
+            value={props.component[props.field]}
+            onChange={(event) => {
+              props.component[props.field] = event.target.value;
+              props.onChange(event.target.value);
+            }}
+            required={true}
+          >
+            <option value="" disabled={true}>
+              Select...
+            </option>
+            {props.domains.map((domain) => {
+              return (
+                <option key={domain.name} value={domain.name}>
+                  {domain.name}
+                </option>
+              );
+            })}
+          </select>
+        )}
+        {props.readOnly && <p className="form-control-static">{props.component[props.field]}</p>}
+      </div>
+    </div>
+  );
+}

package/src/serverGroup/configure/index.ts

@@ -0,0 +1,4 @@
+export * from './serverGroupConfigurationModel.cf';
+export * from './serverGroupCommandBuilder.service.cf';
+export * from './serverGroupCommandBuilderShim.service.cf';
+export * from './wizard/CreateServerGroupModal';

package/src/serverGroup/configure/serverGroupCommandBuilder.service.cf.ts

@@ -0,0 +1,168 @@
+import type { Application, IPipeline, IStage } from '@spinnaker/core';
+import type { ICloudFoundryApplication, ICloudFoundryEnvVar, ICloudFoundryServerGroup } from '../../domain';
+
+import type {
+  ICloudFoundryCreateServerGroupCommand,
+  ICloudFoundryDeployConfiguration,
+} from './serverGroupConfigurationModel.cf';
+
+export class CloudFoundryServerGroupCommandBuilder {
+  private static envVarsFromObject(someObject: any): ICloudFoundryEnvVar[] {
+    const envVars = [];
+    for (const property in someObject) {
+      if (someObject.hasOwnProperty(property)) {
+        const envVar = { key: property, value: someObject[property] };
+        envVars.push(envVar);
+      }
+    }
+    return envVars;
+  }
+
+  private static getSubmitButtonLabel(mode: string) {
+    switch (mode) {
+      case 'createPipeline':
+        return 'Add';
+      case 'editPipeline':
+      case 'editClonePipeline':
+        return 'Done';
+      case 'clone':
+        return 'Clone';
+      default:
+        return 'Create';
+    }
+  }
+
+  public static buildNewServerGroupCommand(app: Application, defaults: any): ICloudFoundryCreateServerGroupCommand {
+    defaults = defaults || {};
+    return {
+      application: app.name,
+      stack: '',
+      freeFormDetails: '',
+      region: '',
+      strategy: '',
+      credentials: '',
+      viewState: {
+        mode: defaults.mode || 'create',
+        submitButtonLabel: CloudFoundryServerGroupCommandBuilder.getSubmitButtonLabel(defaults.mode || 'create'),
+      },
+      selectedProvider: 'cloudfoundry',
+      startApplication: true,
+    } as ICloudFoundryCreateServerGroupCommand;
+  }
+
+  public static buildServerGroupCommandFromExisting(
+    app: Application,
+    serverGroup: ICloudFoundryServerGroup,
+    mode = 'clone',
+  ): ICloudFoundryCreateServerGroupCommand {
+    const command: ICloudFoundryCreateServerGroupCommand = this.buildNewServerGroupCommand(app, { mode });
+    command.credentials = '';
+    command.manifest = {
+      direct: {
+        memory: serverGroup.memory ? serverGroup.memory + 'M' : '1024M',
+        diskQuota: serverGroup.diskQuota ? serverGroup.diskQuota + 'M' : '1024M',
+        buildpacks:
+          serverGroup.droplet && serverGroup.droplet.buildpacks
+            ? serverGroup.droplet.buildpacks.map((item) => item.name)
+            : [],
+        instances: serverGroup.instances ? serverGroup.instances.length : 1,
+        routes: serverGroup.loadBalancers || [],
+        environment: CloudFoundryServerGroupCommandBuilder.envVarsFromObject(serverGroup.env),
+        services: (serverGroup.serviceInstances || []).map((serviceInstance) => serviceInstance.name),
+        healthCheckType: 'port',
+      },
+    };
+    command.region = '';
+    command.stack = serverGroup.stack;
+    command.freeFormDetails = serverGroup.detail;
+    command.source = {
+      asgName: serverGroup.name,
+      region: serverGroup.region,
+      account: serverGroup.account,
+    };
+    return command;
+  }
+
+  public static buildNewServerGroupCommandForPipeline(
+    stage: IStage,
+    pipeline: IPipeline,
+  ): ICloudFoundryCreateServerGroupCommand {
+    const command: ICloudFoundryCreateServerGroupCommand = this.buildNewServerGroupCommand(
+      { name: pipeline.application } as Application,
+      { mode: 'editPipeline' },
+    );
+    command.viewState = {
+      ...command.viewState,
+      pipeline,
+      requiresTemplateSelection: true,
+      stage,
+    };
+    return command;
+  }
+
+  public static buildServerGroupCommandFromPipeline(
+    application: ICloudFoundryApplication,
+    originalCluster: ICloudFoundryDeployConfiguration,
+    stage: IStage,
+    pipeline: IPipeline,
+  ): ICloudFoundryCreateServerGroupCommand {
+    const command = this.buildNewServerGroupCommand(application, { mode: 'editPipeline' });
+    command.credentials = originalCluster.account;
+    command.applicationArtifact = originalCluster.applicationArtifact;
+    command.delayBeforeDisableSec = originalCluster.delayBeforeDisableSec;
+    command.manifest = originalCluster.manifest;
+    command.maxRemainingAsgs = originalCluster.maxRemainingAsgs;
+    command.region = originalCluster.region;
+    command.rollback = originalCluster.rollback;
+    command.strategy = originalCluster.strategy;
+    command.startApplication = originalCluster.startApplication;
+    command.targetPercentages = originalCluster.targetPercentages;
+    command.delayBeforeScaleDownSec = originalCluster.delayBeforeScaleDownSec;
+    if (originalCluster.stack) {
+      command.stack = originalCluster.stack;
+    }
+
+    if (originalCluster.freeFormDetails) {
+      command.freeFormDetails = originalCluster.freeFormDetails;
+    }
+
+    command.viewState = {
+      ...command.viewState,
+      pipeline,
+      stage,
+    };
+
+    return command;
+  }
+
+  public static buildCloneServerGroupCommandFromPipeline(
+    stage: IStage,
+    pipeline: IPipeline,
+  ): ICloudFoundryCreateServerGroupCommand {
+    const command = this.buildNewServerGroupCommand({ name: pipeline.application } as Application, {
+      mode: 'editClonePipeline',
+    });
+    command.credentials = stage.credentials;
+    command.capacity = stage.capacity;
+    command.account = stage.account;
+    command.delayBeforeDisableSec = stage.delayBeforeDisableSec;
+    command.freeFormDetails = stage.freeFormDetails || command.freeFormDetails;
+    command.maxRemainingAsgs = stage.maxRemainingAsgs;
+    command.region = stage.region;
+    command.startApplication = stage.startApplication === undefined || stage.startApplication;
+    command.stack = stage.stack || command.stack;
+    command.strategy = stage.strategy;
+    command.target = stage.target;
+    command.targetCluster = stage.targetCluster;
+    command.manifest = stage.manifest || command.manifest;
+    command.source = stage.source;
+
+    command.viewState = {
+      ...command.viewState,
+      pipeline,
+      stage,
+    };
+
+    return command;
+  }
+}

package/src/serverGroup/configure/serverGroupCommandBuilderShim.service.cf.ts

@@ -0,0 +1,64 @@
+import type { IQService } from 'angular';
+
+import type { Application, IPipeline, IStage } from '@spinnaker/core';
+import type { ICloudFoundryApplication, ICloudFoundryServerGroup } from '../../domain';
+
+import { CloudFoundryServerGroupCommandBuilder } from './serverGroupCommandBuilder.service.cf';
+import type {
+  ICloudFoundryCreateServerGroupCommand,
+  ICloudFoundryDeployConfiguration,
+} from './serverGroupConfigurationModel.cf';
+
+export class CloudFoundryServerGroupCommandBuilderShim {
+  public static $inject = ['$q'];
+  constructor(private $q: IQService) {}
+
+  public buildNewServerGroupCommand(
+    app: Application,
+    defaults: any,
+  ): PromiseLike<ICloudFoundryCreateServerGroupCommand> {
+    return this.$q.when(CloudFoundryServerGroupCommandBuilder.buildNewServerGroupCommand(app, defaults));
+  }
+
+  public buildServerGroupCommandFromExisting(
+    app: Application,
+    serverGroup: ICloudFoundryServerGroup,
+    mode = 'clone',
+  ): PromiseLike<ICloudFoundryCreateServerGroupCommand> {
+    return this.$q.when(
+      CloudFoundryServerGroupCommandBuilder.buildServerGroupCommandFromExisting(app, serverGroup, mode),
+    );
+  }
+
+  public buildNewServerGroupCommandForPipeline(
+    stage: IStage,
+    pipeline: IPipeline,
+  ): PromiseLike<ICloudFoundryCreateServerGroupCommand> {
+    return this.$q.when(CloudFoundryServerGroupCommandBuilder.buildNewServerGroupCommandForPipeline(stage, pipeline));
+  }
+
+  public buildServerGroupCommandFromPipeline(
+    application: ICloudFoundryApplication,
+    originalCluster: ICloudFoundryDeployConfiguration,
+    stage: IStage,
+    pipeline: IPipeline,
+  ): PromiseLike<ICloudFoundryCreateServerGroupCommand> {
+    return this.$q.when(
+      CloudFoundryServerGroupCommandBuilder.buildServerGroupCommandFromPipeline(
+        application,
+        originalCluster,
+        stage,
+        pipeline,
+      ),
+    );
+  }
+
+  public buildCloneServerGroupCommandFromPipeline(
+    stage: IStage,
+    pipeline: IPipeline,
+  ): PromiseLike<ICloudFoundryCreateServerGroupCommand> {
+    return this.$q.when(
+      CloudFoundryServerGroupCommandBuilder.buildCloneServerGroupCommandFromPipeline(stage, pipeline),
+    );
+  }
+}

package/src/serverGroup/configure/serverGroupConfigurationModel.cf.ts

@@ -0,0 +1,77 @@
+import type { IArtifact, IPipeline, IServerGroupCommand, IStage } from '@spinnaker/core';
+import type { ICloudFoundryEnvVar } from '../../domain';
+
+export interface ICloudFoundryCreateServerGroupCommand extends IServerGroupCommand {
+  // clone server group model
+  account?: string;
+  delayBeforeScaleDownSec?: number;
+  rollback?: boolean;
+  source?: ICloudFoundrySource;
+  target?: string;
+  targetCluster?: string;
+  targetPercentages?: number[];
+
+  // deploy server group model
+  applicationArtifact?: ICloudFoundryArtifact;
+  delayBeforeDisableSec?: number;
+  manifest?: ICloudFoundryManifest;
+  maxRemainingAsgs?: number;
+  startApplication: boolean;
+}
+
+export interface IViewState {
+  mode?: string;
+  pipeline?: IPipeline;
+  requiresTemplateSelection?: boolean;
+  stage?: IStage;
+  submitButtonLabel?: string;
+}
+
+export interface ICloudFoundryArtifact {
+  // one of these two are required
+  artifact?: IArtifact;
+  artifactId?: string;
+}
+
+export interface ICloudFoundryManifest {
+  // one of these three are required
+  direct: ICloudFoundryManifestDirectSource;
+  artifactId?: string;
+  artifact?: IArtifact;
+}
+
+export interface ICloudFoundrySource {
+  asgName: string;
+  region: string;
+  account: string;
+  clusterName?: string;
+}
+
+export interface ICloudFoundryManifestDirectSource {
+  memory: string;
+  diskQuota: string;
+  instances: number;
+  buildpacks: string[];
+  healthCheckType?: string;
+  healthCheckHttpEndpoint?: string;
+  routes: string[];
+  environment: ICloudFoundryEnvVar[];
+  services: string[];
+}
+
+export interface ICloudFoundryDeployConfiguration {
+  account: string;
+  application: string;
+  applicationArtifact: ICloudFoundryArtifact;
+  delayBeforeDisableSec?: number;
+  delayBeforeScaleDownSec?: number;
+  freeFormDetails?: string;
+  manifest: ICloudFoundryManifest;
+  maxRemainingAsgs?: number;
+  region: string;
+  rollback?: boolean;
+  stack?: string;
+  startApplication: boolean;
+  strategy?: string;
+  targetPercentages?: number[];
+}