@spinnaker/appengine 0.0.0-2025.1-0

package/src/serverGroup/configure/wizard/ConfigFileArtifactList.tsx

@@ -0,0 +1,81 @@
+import classNames from 'classnames';
+import React from 'react';
+
+import type { IArtifact, IArtifactAccountPair, IExpectedArtifact, IPipeline, IStage } from '@spinnaker/core';
+import { StageArtifactSelector } from '@spinnaker/core';
+
+interface IConfigFileArtifactListProps {
+  configArtifacts: IArtifactAccountPair[];
+  pipeline: IPipeline;
+  stage: IStage;
+  updateConfigArtifacts: (configArtifacts: any[]) => void;
+}
+
+export const ConfigFileArtifactList = (props: IConfigFileArtifactListProps) => {
+  const addConfigArtifact = () => {
+    props.updateConfigArtifacts(props.configArtifacts.concat([{ id: '', account: '' }]));
+  };
+
+  const deleteConfigArtifact = (index: number) => {
+    const newConfigArtifacts = [...props.configArtifacts];
+    newConfigArtifacts.splice(index, 1);
+    props.updateConfigArtifacts(newConfigArtifacts);
+  };
+
+  const onExpectedArtifactEdited = (artifact: IArtifact, index: number): void => {
+    const newConfigArtifacts = [...props.configArtifacts];
+    newConfigArtifacts.splice(index, 1, { ...newConfigArtifacts[index], id: null, artifact });
+    props.updateConfigArtifacts(newConfigArtifacts);
+  };
+
+  const onExpectedArtifactSelected = (expectedArtifact: IExpectedArtifact, index: number): void => {
+    onChangeExpectedArtifactId(expectedArtifact.id, index);
+  };
+
+  const onChangeExpectedArtifactId = (id: string, index: number): void => {
+    const newConfigArtifacts = [...props.configArtifacts];
+    newConfigArtifacts.splice(index, 1, { ...newConfigArtifacts[index], id, artifact: null });
+    props.updateConfigArtifacts(newConfigArtifacts);
+  };
+
+  return (
+    <>
+      {props.configArtifacts.map((a, i) => {
+        return (
+          <div
+            key={a.id}
+            className={classNames('artifact-configuration-section col-md-12', {
+              'last-entry': props.configArtifacts.length - 1 === i,
+            })}
+          >
+            <div className="col-md-9">
+              <StageArtifactSelector
+                artifact={a.artifact}
+                excludedArtifactTypePatterns={[]}
+                expectedArtifactId={a.artifact == null ? a.id : null}
+                onArtifactEdited={(artifact: IArtifact) => {
+                  onExpectedArtifactEdited(artifact, i);
+                }}
+                onExpectedArtifactSelected={(expectedArtifact: IExpectedArtifact) => {
+                  onExpectedArtifactSelected(expectedArtifact, i);
+                }}
+                pipeline={props.pipeline}
+                stage={props.stage}
+              />
+            </div>
+            <div className="col-md-1">
+              <button type="button" className="btn btn-sm btn-default" onClick={() => deleteConfigArtifact(i)}>
+                <span className="glyphicon glyphicon-trash" /> Delete
+              </button>
+            </div>
+          </div>
+        );
+      })}
+      <div className="col-md-7 col-md-offset-3">
+        <button className="btn btn-block btn-add-trigger add-new" onClick={() => addConfigArtifact()}>
+          <span className="glyphicon glyphicon-plus-sign" /> Add Config Artifact
+        </button>
+      </div>
+    </>
+  );
+};

package/src/serverGroup/configure/wizard/advancedSettings.html

@@ -0,0 +1,33 @@
+<div class="form-horizontal container-fluid">
+  <div class="form-group">
+    <div class="col-md-4 sm-label-right">Promote <help-field key="appengine.serverGroup.promote"></help-field></div>
+    <div class="col-md-7">
+      <input type="checkbox" ng-model="command.promote" />
+    </div>
+  </div>
+
+  <div class="form-group">
+    <div class="col-md-4 sm-label-right">
+      Stop Previous Version <help-field key="appengine.serverGroup.stopPreviousVersion"></help-field>
+    </div>
+    <div class="col-md-7">
+      <input type="checkbox" ng-model="command.stopPreviousVersion" />
+    </div>
+  </div>
+  <div class="form-group" ng-if="showPlatformHealthOnlyOverride">
+    <div class="col-md-4 sm-label-right">Task Completion</div>
+    <div class="col-md-7">
+      <platform-health-override command="command" platform-health-type="platformHealth"> </platform-health-override>
+    </div>
+  </div>
+
+  <div class="form-group">
+    <div class="col-md-4 sm-label-right">
+      Suppress Version String
+      <help-field key="appengine.serverGroup.suppress-version-string"></help-field>
+    </div>
+    <div class="col-md-7">
+      <input type="checkbox" ng-model="command.suppressVersionString" />
+    </div>
+  </div>
+</div>

package/src/serverGroup/configure/wizard/basicSettings.controller.ts

@@ -0,0 +1,151 @@
+import type { StateService } from '@uirouter/angularjs';
+import type { IController, IControllerService, IScope } from 'angular';
+import { extend, module } from 'angular';
+import { set } from 'lodash';
+
+import type { IArtifact, IExpectedArtifact } from '@spinnaker/core';
+import {
+  ArtifactTypePatterns,
+  excludeAllTypesExcept,
+  ExpectedArtifactSelectorViewController,
+  NgAppEngineDeployArtifactDelegate,
+} from '@spinnaker/core';
+import type { GitCredentialType, IAppengineAccount } from '../../../domain/index';
+
+import type { IAppengineServerGroupCommand } from '../serverGroupCommandBuilder.service';
+import { AppengineSourceType } from '../serverGroupCommandBuilder.service';
+
+interface IAppengineBasicSettingsScope extends IScope {
+  command: IAppengineServerGroupCommand;
+}
+
+class AppengineServerGroupBasicSettingsCtrl implements IController {
+  public static $inject = ['$scope', '$state', '$controller', '$uibModalStack'];
+
+  constructor(
+    public $scope: IAppengineBasicSettingsScope,
+    $state: StateService,
+    $controller: IControllerService,
+    $uibModalStack: any,
+  ) {
+    extend(
+      this,
+      $controller('BasicSettingsMixin', {
+        $scope,
+        imageReader: null,
+        $uibModalStack,
+        $state,
+      }),
+    );
+
+    if (!this.$scope.command.gitCredentialType) {
+      this.onAccountChange();
+    }
+
+    this.$scope.containerArtifactDelegate = new NgAppEngineDeployArtifactDelegate($scope, [
+      ArtifactTypePatterns.DOCKER_IMAGE,
+    ]);
+    this.$scope.containerArtifactController = new ExpectedArtifactSelectorViewController(
+      this.$scope.containerArtifactDelegate,
+    );
+    this.$scope.gcsArtifactDelegate = new NgAppEngineDeployArtifactDelegate($scope, [ArtifactTypePatterns.GCS_OBJECT]);
+    this.$scope.gcsArtifactController = new ExpectedArtifactSelectorViewController(this.$scope.gcsArtifactDelegate);
+  }
+
+  public isGitSource(): boolean {
+    return this.$scope.command.sourceType === AppengineSourceType.GIT;
+  }
+
+  public isGcsSource(): boolean {
+    return this.$scope.command.sourceType === AppengineSourceType.GCS;
+  }
+
+  public isContainerImageSource(): boolean {
+    return this.$scope.command.sourceType === AppengineSourceType.CONTAINER_IMAGE;
+  }
+
+  public toggleResolveViaTrigger(): void {
+    this.$scope.command.fromTrigger = !this.$scope.command.fromTrigger;
+    delete this.$scope.command.trigger;
+    delete this.$scope.command.branch;
+  }
+
+  public onTriggerChange(): void {
+    set(this, '$scope.command.trigger.matchBranchOnRegex', undefined);
+  }
+
+  public onAccountChange(): void {
+    const account = this.findAccountInBackingData();
+    if (account) {
+      this.$scope.command.gitCredentialType = this.getSupportedGitCredentialTypes()[0];
+      this.$scope.command.region = account.region;
+    } else {
+      this.$scope.command.gitCredentialType = 'NONE';
+      delete this.$scope.command.region;
+    }
+  }
+
+  public getSupportedGitCredentialTypes(): GitCredentialType[] {
+    const account = this.findAccountInBackingData();
+    if (account && account.supportedGitCredentialTypes) {
+      return account.supportedGitCredentialTypes;
+    } else {
+      return ['NONE'];
+    }
+  }
+
+  public humanReadableGitCredentialType(type: GitCredentialType): string {
+    switch (type) {
+      case 'HTTPS_USERNAME_PASSWORD':
+        return 'HTTPS with username and password';
+      case 'HTTPS_GITHUB_OAUTH_TOKEN':
+        return 'HTTPS with Github OAuth token';
+      case 'SSH':
+        return 'SSH';
+      case 'NONE':
+        return 'No credentials';
+      default:
+        return 'No credentials';
+    }
+  }
+
+  public readonly excludedGcsArtifactTypes = excludeAllTypesExcept(ArtifactTypePatterns.GCS_OBJECT);
+  public readonly excludedContainerArtifactTypes = excludeAllTypesExcept(ArtifactTypePatterns.DOCKER_IMAGE);
+
+  public onExpectedArtifactEdited = (artifact: IArtifact): void => {
+    this.$scope.$applyAsync(() => {
+      this.$scope.command.expectedArtifactId = null;
+      this.$scope.command.expectedArtifact = artifact;
+    });
+  };
+
+  public onExpectedArtifactSelected = (expectedArtifact: IExpectedArtifact): void => {
+    this.onChangeExpectedArtifactId(expectedArtifact.id);
+  };
+
+  public onChangeExpectedArtifactId = (artifactId: string): void => {
+    this.$scope.$applyAsync(() => {
+      this.$scope.command.expectedArtifactId = artifactId;
+      this.$scope.command.expectedArtifact = null;
+    });
+  };
+
+  public onExpectedArtifactAccountSelected = (accountName: string): void => {
+    this.$scope.$applyAsync(() => {
+      this.$scope.command.storageAccountName = accountName;
+    });
+  };
+
+  private findAccountInBackingData(): IAppengineAccount {
+    return this.$scope.command.backingData.accounts.find((account: IAppengineAccount) => {
+      return this.$scope.command.credentials === account.name;
+    });
+  }
+}
+
+export const APPENGINE_SERVER_GROUP_BASIC_SETTINGS_CTRL = 'spinnaker.appengine.basicSettings.controller';
+
+module(APPENGINE_SERVER_GROUP_BASIC_SETTINGS_CTRL, []).controller(
+  'appengineServerGroupBasicSettingsCtrl',
+  AppengineServerGroupBasicSettingsCtrl,
+);

package/src/serverGroup/configure/wizard/basicSettings.html

@@ -0,0 +1,287 @@
+<div class="container-fluid form-horizontal" ng-controller="appengineServerGroupBasicSettingsCtrl as basicSettingsCtrl">
+  <ng-form name="basicSettings">
+    <div class="form-group">
+      <div class="col-md-3 sm-label-right">Account</div>
+      <div class="col-md-7">
+        <account-select-field
+          read-only="command.viewState.readOnlyFields.credentials"
+          component="command"
+          field="credentials"
+          on-change="basicSettingsCtrl.onAccountChange()"
+          accounts="command.backingData.accounts"
+          provider="'appengine'"
+        ></account-select-field>
+      </div>
+    </div>
+
+    <div class="form-group">
+      <div class="col-md-3 sm-label-right">Region</div>
+      <div class="col-md-7">
+        <input type="text" readonly class="form-control input-sm" name="region" ng-model="command.region" />
+      </div>
+    </div>
+
+    <div class="form-group">
+      <div class="col-md-3 sm-label-right">
+        Stack
+        <help-field key="aws.serverGroup.stack"></help-field>
+      </div>
+      <div class="col-md-7">
+        <input
+          type="text"
+          class="form-control input-sm no-spel"
+          ng-pattern="basicSettingsCtrl.stackPattern"
+          name="stack"
+          ng-model="command.stack"
+        />
+      </div>
+    </div>
+    <div class="form-group row slide-in" ng-if="basicSettings.stack.$error.pattern">
+      <div class="col-sm-9 col-sm-offset-2 error-message">
+        <span>Only dot(.) and underscore(_) special characters are allowed in the Stack field.</span>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="col-md-3 sm-label-right">
+        Detail
+        <help-field key="aws.serverGroup.detail"></help-field>
+      </div>
+      <div class="col-md-7">
+        <input
+          type="text"
+          class="form-control input-sm no-spel"
+          ng-pattern="basicSettingsCtrl.detailPattern"
+          name="details"
+          ng-model="command.freeFormDetails"
+        />
+      </div>
+    </div>
+
+    <div class="form-group row slide-in" ng-if="basicSettings.details.$error.pattern">
+      <div class="col-sm-9 col-sm-offset-2 error-message">
+        <span>Only dot(.), underscore(_), and dash(-) special characters are allowed in the Detail field.</span>
+      </div>
+    </div>
+
+    <div class="form-group row">
+      <label class="col-md-3 sm-label-right">Source Type</label>
+      <div class="col-md-7">
+        <div class="radio radio-inline">
+          <label> <input type="radio" ng-model="command.sourceType" value="git" /> Git </label>
+        </div>
+        <div class="radio radio-inline">
+          <label> <input type="radio" ng-model="command.sourceType" value="gcs" /> GCS </label>
+        </div>
+        <div class="radio radio-inline">
+          <label> <input type="radio" ng-model="command.sourceType" value="containerImage" /> Container Image </label>
+        </div>
+      </div>
+    </div>
+
+    <div ng-if="basicSettingsCtrl.isGcsSource()">
+      <div class="form-group row">
+        <label class="col-md-3 sm-label-right">Resolve URL</label>
+        <div class="col-md-7">
+          <div class="radio radio-inline">
+            <label> <input type="radio" ng-model="command.fromArtifact" ng-value="false" /> via text input </label>
+          </div>
+          <div class="radio radio-inline" ng-if="command.viewState.pipeline">
+            <label>
+              <input type="radio" ng-model="command.fromArtifact" ng-value="true" /> via pipeline artifact
+            </label>
+          </div>
+        </div>
+      </div>
+      <stage-artifact-selector-delegate
+        ng-if="command.fromArtifact"
+        artifact="command.expectedArtifact"
+        excluded-artifact-type-patterns="basicSettingsCtrl.excludedGcsArtifactTypes"
+        expected-artifact-id="command.expectedArtifactId"
+        field-columns="7"
+        label="'Expected Artifact'"
+        on-artifact-edited="basicSettingsCtrl.onExpectedArtifactEdited"
+        on-expected-artifact-selected="basicSettingsCtrl.onExpectedArtifactSelected"
+        pipeline="command.viewState.pipeline"
+        stage="command.viewState.stage"
+      >
+      </stage-artifact-selector-delegate>
+      <div class="form-group" ng-if="!command.fromArtifact">
+        <div class="col-md-3 sm-label-right">
+          GCS URL
+          <help-field class="help-field-absolute" key="appengine.serverGroup.gcs.repositoryUrl"></help-field>
+        </div>
+        <div class="col-md-7">
+          <input type="text" required class="form-control input-sm" name="gcsUrl" ng-model="command.repositoryUrl" />
+        </div>
+      </div>
+    </div>
+
+    <div ng-if="basicSettingsCtrl.isGitSource()">
+      <div class="form-group">
+        <div class="col-md-3 sm-label-right">
+          Git Repository URL
+          <help-field class="help-field-absolute" key="appengine.serverGroup.git.repositoryUrl"></help-field>
+        </div>
+        <div class="col-md-7">
+          <input type="text" required class="form-control input-sm" name="gitRepo" ng-model="command.repositoryUrl" />
+        </div>
+      </div>
+
+      <div class="form-group">
+        <div class="col-md-3 sm-label-right">
+          Git Credential Type
+          <help-field class="help-field-absolute" key="appengine.serverGroup.gitCredentialType"></help-field>
+        </div>
+        <div class="col-md-7">
+          <select
+            class="form-control input-sm"
+            ng-options="basicSettingsCtrl.humanReadableGitCredentialType(type) for type in basicSettingsCtrl.getSupportedGitCredentialTypes()"
+            ng-model="command.gitCredentialType"
+          ></select>
+        </div>
+      </div>
+
+      <div class="form-group">
+        <div class="col-md-3 sm-label-right">Branch <help-field key="appengine.serverGroup.branch"></help-field></div>
+        <div class="col-md-7">
+          <input
+            ng-if="!command.fromTrigger"
+            type="text"
+            required
+            class="form-control input-sm"
+            name="branch"
+            ng-model="command.branch"
+          />
+
+          <ui-select
+            ng-if="command.fromTrigger"
+            ng-model="command.trigger"
+            class="form-control input-sm"
+            on-select="basicSettingsCtrl.onTriggerChange()"
+            required
+          >
+            <ui-select-match allow-clear>
+              <appengine-dynamic-branch-label trigger="command.trigger"></appengine-dynamic-branch-label>
+            </ui-select-match>
+            <ui-select-choices repeat="trigger in command.backingData.triggerOptions">
+              <appengine-dynamic-branch-label trigger="trigger"></appengine-dynamic-branch-label>
+            </ui-select-choices>
+          </ui-select>
+        </div>
+
+        <div
+          class="col-md-7 col-md-offset-3"
+          ng-if="command.viewState.mode === 'createPipeline' || command.viewState.mode === 'editPipeline'"
+        >
+          <span class="pull-right small" ng-if="!command.fromTrigger">
+            <a href ng-click="basicSettingsCtrl.toggleResolveViaTrigger()">Resolve via trigger</a>
+          </span>
+          <span class="pull-right small" ng-if="command.fromTrigger">
+            <a href ng-click="basicSettingsCtrl.toggleResolveViaTrigger()">Click for text input</a>
+          </span>
+        </div>
+      </div>
+    </div>
+
+    <div ng-if="basicSettingsCtrl.isContainerImageSource()">
+      <div class="form-group">
+        <label class="col-md-3 sm-label-right">Resolve URL</label>
+        <div class="col-md-7">
+          <div class="radio radio-inline">
+            <label> <input type="radio" ng-model="command.fromArtifact" ng-value="false" /> via text input </label>
+          </div>
+          <div class="radio radio-inline" ng-if="command.viewState.pipeline">
+            <label>
+              <input type="radio" ng-model="command.fromArtifact" ng-value="true" /> via pipeline artifact
+            </label>
+          </div>
+        </div>
+      </div>
+      <stage-artifact-selector-delegate
+        ng-if="command.fromArtifact"
+        artifact="command.expectedArtifact"
+        excluded-artifact-type-patterns="basicSettingsCtrl.excludedContainerArtifactTypes"
+        expected-artifact-id="command.expectedArtifactId"
+        field-columns="7"
+        label="'Expected Artifact'"
+        on-artifact-edited="basicSettingsCtrl.onExpectedArtifactEdited"
+        on-expected-artifact-selected="basicSettingsCtrl.onExpectedArtifactSelected"
+        pipeline="command.viewState.pipeline"
+        stage="command.viewState.stage"
+      >
+      </stage-artifact-selector-delegate>
+      <div class="form-group" ng-if="!command.fromArtifact">
+        <div class="col-md-3 sm-label-right">
+          Image URL
+          <help-field key="appengine.serverGroup.containerImageUrl"></help-field>
+        </div>
+        <div class="col-md-7">
+          <input
+            type="text"
+            required
+            class="form-control input-sm"
+            name="containerImageUrl"
+            ng-model="command.containerImageUrl"
+          />
+        </div>
+      </div>
+    </div>
+
+    <div ng-if="command.trigger.type === 'jenkins'" class="form-group">
+      <div class="col-md-7 col-md-offset-3">
+        <div class="form-inline">
+          <small>Match branch from trigger on regex</small>
+          <help-field key="appengine.serverGroup.matchBranchOnRegex"></help-field>
+          <input
+            type="text"
+            style="width: 140px"
+            class="form-control input-sm pull-right"
+            name="matchOnRegex"
+            ng-model="command.trigger.matchBranchOnRegex"
+          />
+        </div>
+      </div>
+    </div>
+
+    <deployment-strategy-selector
+      field-columns="7"
+      ng-if="!command.viewState.disableStrategySelection"
+      command="command"
+    ></deployment-strategy-selector>
+
+    <div class="form-group" ng-if="!command.viewState.hideClusterNamePreview">
+      <div class="col-md-12">
+        <div class="well-compact" ng-class="basicSettingsCtrl.showPreviewAsWarning() ? 'alert alert-warning' : 'well'">
+          <h5 class="text-center">
+            <p>Your server group will be in the cluster:</p>
+            <p>
+              <strong>
+                {{basicSettingsCtrl.getNamePreview()}}
+                <span ng-if="basicSettingsCtrl.createsNewCluster()"> (new cluster)</span>
+              </strong>
+            </p>
+            <div
+              class="text-left"
+              ng-if="!basicSettingsCtrl.createsNewCluster() && command.viewState.mode === 'create' && latestServerGroup"
+            >
+              <p>There is already a server group in this cluster. Do you want to clone it?</p>
+              <p>
+                Cloning copies the entire configuration from the selected server group, allowing you to modify whichever
+                fields (e.g. image) you need to change in the new server group.
+              </p>
+              <p>
+                To clone a server group, select "Clone" from the "Server Group Actions" menu in the details view of the
+                server group.
+              </p>
+              <p>
+                <a href ng-click="basicSettingsCtrl.navigateToLatestServerGroup()">
+                  Go to details for {{latestServerGroup.name}}
+                </a>
+              </p>
+            </div>
+          </h5>
+        </div>
+      </div>
+    </div>
+  </ng-form>
+</div>

package/src/serverGroup/configure/wizard/cloneServerGroup.controller.ts

@@ -0,0 +1,103 @@
+import type { IController, IScope } from 'angular';
+import { copy, module } from 'angular';
+import type { IModalInstanceService } from 'angular-ui-bootstrap';
+import { get, merge } from 'lodash';
+
+import type { Application, ServerGroupWriter } from '@spinnaker/core';
+import { SERVER_GROUP_WRITER, TaskMonitor } from '@spinnaker/core';
+import { AppengineHealth } from '../../../common/appengineHealth';
+
+import { APPENGINE_CONFIG_FILE_CONFIGURER } from './configFiles.component';
+import { APPENGINE_DYNAMIC_BRANCH_LABEL } from './dynamicBranchLabel.component';
+import type {
+  AppengineServerGroupCommandBuilder,
+  IAppengineServerGroupCommand,
+} from '../serverGroupCommandBuilder.service';
+
+import './serverGroupWizard.less';
+
+class AppengineCloneServerGroupCtrl implements IController {
+  public pages: { [pageKey: string]: string } = {
+    basicSettings: require('./basicSettings.html'),
+    advancedSettings: require('./advancedSettings.html'),
+  };
+  public state = {
+    loading: true,
+  };
+  public taskMonitor: TaskMonitor;
+
+  public static $inject = [
+    '$scope',
+    '$uibModalInstance',
+    'serverGroupCommand',
+    'application',
+    'serverGroupWriter',
+    'appengineServerGroupCommandBuilder',
+  ];
+  constructor(
+    public $scope: IScope,
+    private $uibModalInstance: IModalInstanceService,
+    public serverGroupCommand: IAppengineServerGroupCommand,
+    private application: Application,
+    private serverGroupWriter: ServerGroupWriter,
+    appengineServerGroupCommandBuilder: AppengineServerGroupCommandBuilder,
+  ) {
+    if (['create', 'clone', 'editPipeline'].includes(get<string>(serverGroupCommand, 'viewState.mode'))) {
+      this.$scope.command = serverGroupCommand;
+      this.state.loading = false;
+      this.initialize();
+    } else {
+      appengineServerGroupCommandBuilder
+        .buildNewServerGroupCommand(application, 'appengine', 'createPipeline')
+        .then((constructedCommand) => {
+          this.$scope.command = merge(constructedCommand, serverGroupCommand);
+          // Re-establish references to the original pipeline and stage objects so that
+          // we don't mutate copies of them when assigning expected artifacts.
+          this.$scope.command.viewState.pipeline = serverGroupCommand.viewState.pipeline;
+          this.$scope.command.viewState.stage = serverGroupCommand.viewState.stage;
+          this.state.loading = false;
+          this.initialize();
+        });
+    }
+  }
+
+  public cancel(): void {
+    this.$uibModalInstance.dismiss();
+  }
+
+  public submit(): void {
+    const mode = this.$scope.command.viewState.mode;
+    if (['editPipeline', 'createPipeline'].includes(mode)) {
+      return this.$uibModalInstance.close(this.$scope.command);
+    } else {
+      const command = copy(this.$scope.command);
+      // Make sure we're sending off a create operation, because there's no such thing as clone for App Engine.
+      command.viewState.mode = 'create';
+      const submitMethod = () => this.serverGroupWriter.cloneServerGroup(command, this.$scope.application);
+      this.taskMonitor.submit(submitMethod);
+
+      return null;
+    }
+  }
+
+  private initialize(): void {
+    this.$scope.application = this.application;
+    this.taskMonitor = new TaskMonitor({
+      application: this.application,
+      title: 'Creating your server group',
+      modalInstance: this.$uibModalInstance,
+    });
+    this.$scope.showPlatformHealthOnlyOverride = this.application.attributes.platformHealthOnlyShowOverride;
+    this.$scope.platformHealth = AppengineHealth.PLATFORM;
+    if (this.application.attributes.platformHealthOnly) {
+      this.$scope.command.interestingHealthProviderNames = [AppengineHealth.PLATFORM];
+    }
+  }
+}
+
+export const APPENGINE_CLONE_SERVER_GROUP_CTRL = 'spinnaker.appengine.cloneServerGroup.controller';
+module(APPENGINE_CLONE_SERVER_GROUP_CTRL, [
+  SERVER_GROUP_WRITER,
+  APPENGINE_DYNAMIC_BRANCH_LABEL,
+  APPENGINE_CONFIG_FILE_CONFIGURER,
+]).controller('appengineCloneServerGroupCtrl', AppengineCloneServerGroupCtrl);

package/src/serverGroup/configure/wizard/configFileArtifactList.module.ts

@@ -0,0 +1,18 @@
+import { module } from 'angular';
+import { react2angular } from 'react2angular';
+
+import { withErrorBoundary } from '@spinnaker/core';
+
+import { ConfigFileArtifactList } from './ConfigFileArtifactList';
+
+export const CONFIG_FILE_ARTIFACT_LIST = 'spinnaker.appengine.configFileArtifactList.component';
+
+module(CONFIG_FILE_ARTIFACT_LIST, []).component(
+  'configFileArtifactList',
+  react2angular(withErrorBoundary(ConfigFileArtifactList, 'configFileArtifactList'), [
+    'configArtifacts',
+    'pipeline',
+    'stage',
+    'updateConfigArtifacts',
+  ]),
+);