@spinnaker/amazon 0.0.0-main-2

package/src/logo/aws.icon.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="130px" height="130px" viewBox="0 0 27 27">
+<g>
+	<polygon fill="#000000" stroke="#FFFFFF" stroke-width="0" points="13.2,27 2.4,23.1 2.4,8.5 13.2,12.5 "/>
+	<polygon fill="#000000" stroke="#FFFFFF" stroke-width="0" points="26.5,23.1 15.2,27 15.2,12.5 26.5,8 "/>
+	<polygon fill="#000000" stroke="#FFFFFF" stroke-width="0" points="14.2,3.4 25.5,7 14.2,11.0 2.9,7 "/>
+</g>
+</svg>

package/src/logo/aws.logo.less

@@ -0,0 +1,5 @@
+.cloud-provider-logo {
+  .icon-aws {
+    mask-image: url('aws.icon.svg');
+  }
+}

package/src/pipeline/stages/bake/awsBakeStage.js

@@ -0,0 +1,219 @@
+'use strict';
+
+import { module } from 'angular';
+import _ from 'lodash';
+
+import { AuthenticationService } from '@spinnaker/core';
+import { BakeExecutionLabel, BakeryReader, PipelineTemplates, Registry, SETTINGS } from '@spinnaker/core';
+import { AWSProviderSettings } from '../../../aws.settings';
+
+import { AMAZON_PIPELINE_STAGES_BAKE_BAKEEXECUTIONDETAILS_CONTROLLER } from './bakeExecutionDetails.controller';
+
+export const AMAZON_PIPELINE_STAGES_BAKE_AWSBAKESTAGE = 'spinnaker.amazon.pipeline.stage.bakeStage';
+export const name = AMAZON_PIPELINE_STAGES_BAKE_AWSBAKESTAGE; // for backwards compatibility
+module(AMAZON_PIPELINE_STAGES_BAKE_AWSBAKESTAGE, [AMAZON_PIPELINE_STAGES_BAKE_BAKEEXECUTIONDETAILS_CONTROLLER])
+  .config(function () {
+    Registry.pipeline.registerStage({
+      provides: 'bake',
+      cloudProvider: 'aws',
+      label: 'Bake',
+      description: 'Bakes an image',
+      templateUrl: require('./bakeStage.html'),
+      executionDetailsUrl: require('./bakeExecutionDetails.html'),
+      executionLabelComponent: BakeExecutionLabel,
+      extraLabelLines: (stage) => {
+        return stage.masterStage.context.allPreviouslyBaked || stage.masterStage.context.somePreviouslyBaked ? 1 : 0;
+      },
+      supportsCustomTimeout: true,
+      validators: [
+        { type: 'requiredField', fieldName: 'package' },
+        { type: 'requiredField', fieldName: 'regions' },
+        {
+          type: 'upstreamVersionProvided',
+          checkParentTriggers: true,
+          getMessage: (labels) =>
+            'Bake stages should always have a stage or trigger preceding them that provides version information: ' +
+            '<ul>' +
+            labels.map((label) => `<li>${label}</li>`).join('') +
+            '</ul>' +
+            'Otherwise, Spinnaker will bake and deploy the most-recently built package.',
+        },
+      ],
+      restartable: true,
+    });
+  })
+  .controller('awsBakeStageCtrl', [
+    '$scope',
+    '$q',
+    '$uibModal',
+    function ($scope, $q, $uibModal) {
+      $scope.stage.extendedAttributes = $scope.stage.extendedAttributes || {};
+      $scope.stage.regions = ($scope.stage.regions && $scope.stage.regions.sort()) || [];
+
+      if (!$scope.stage.user) {
+        $scope.stage.user = AuthenticationService.getAuthenticatedUser().name;
+      }
+
+      $scope.viewState = {
+        loading: true,
+        roscoMode:
+          SETTINGS.feature.roscoMode ||
+          (typeof SETTINGS.feature.roscoSelector === 'function' && SETTINGS.feature.roscoSelector($scope.stage)),
+        minRootVolumeSize: AWSProviderSettings.minRootVolumeSize,
+        showVmTypeSelector: true,
+        bakeWarning: AWSProviderSettings.bakeWarning,
+        dockerBakeWarning: AWSProviderSettings.dockerBakeWarning,
+        showDockerPreview: AWSProviderSettings.dockerBakeryDeprecated && $scope.stage.storeType === 'docker',
+        showMigrationFields: $scope.pipeline.migrationStatus !== 'Started',
+        showStoreType: !AWSProviderSettings.dockerBakeryDeprecated,
+      };
+
+      function initialize() {
+        $q.all([
+          BakeryReader.getRegions('aws'),
+          BakeryReader.getBaseOsOptions('aws'),
+          BakeryReader.getBaseLabelOptions(),
+          ['ebs', 'docker'],
+        ]).then(function ([regions, baseOsOptions, baseLabelOptions, storeTypes]) {
+          $scope.regions = [...regions].sort();
+          $scope.storeTypes = storeTypes;
+          if (!$scope.stage.storeType && $scope.storeTypes && $scope.storeTypes.length) {
+            $scope.stage.storeType = $scope.storeTypes[0];
+          }
+          if ($scope.regions.length === 1) {
+            $scope.stage.region = $scope.regions[0];
+          } else if (!$scope.regions.includes($scope.stage.region)) {
+            delete $scope.stage.region;
+          }
+          if (!$scope.stage.regions.length && $scope.application.defaultRegions.aws) {
+            $scope.stage.regions.push(...Object.keys($scope.application.defaultRegions.aws).sort());
+          }
+          $scope.baseOsOptions = baseOsOptions.baseImages;
+          $scope.baseLabelOptions = baseLabelOptions;
+
+          if (!$scope.stage.baseOs && $scope.baseOsOptions && $scope.baseOsOptions.length) {
+            $scope.stage.baseOs = $scope.baseOsOptions[0].id;
+          } else if (
+            $scope.stage.baseOs &&
+            !($scope.baseOsOptions || []).find((baseOs) => baseOs.id === $scope.stage.baseOs)
+          ) {
+            $scope.baseOsOptions.push({
+              id: $scope.stage.baseOs,
+              detailedDescription: 'Custom',
+              vmTypes: ['hvm', 'pv'],
+            });
+          }
+          if (!$scope.stage.baseLabel && $scope.baseLabelOptions && $scope.baseLabelOptions.length) {
+            $scope.stage.baseLabel = $scope.baseLabelOptions[0];
+          }
+          setVmTypes();
+          if (!$scope.stage.vmType && $scope.vmTypes && $scope.vmTypes.length) {
+            $scope.stage.vmType = $scope.vmTypes[0];
+          }
+          $scope.showAdvancedOptions = showAdvanced();
+          $scope.viewState.loading = false;
+        });
+      }
+
+      function stageUpdated() {
+        deleteEmptyProperties();
+        if ($scope.stage.storeType === 'ebs' && $scope.stage.cloudProviderType !== 'aws') {
+          $scope.stage.cloudProviderType = 'aws';
+        }
+        // Since the selector computes using stage as an input, it needs to be able to recompute roscoMode on updates
+        if (typeof SETTINGS.feature.roscoSelector === 'function') {
+          $scope.viewState.roscoMode = SETTINGS.feature.roscoSelector($scope.stage);
+        }
+      }
+
+      function deleteEmptyProperties() {
+        _.forOwn($scope.stage, function (val, key) {
+          if (val === '') {
+            delete $scope.stage[key];
+          }
+        });
+      }
+
+      function showAdvanced() {
+        const stg = $scope.stage;
+        return !!(
+          stg.templateFileName ||
+          (stg.extendedAttributes && _.size(stg.extendedAttributes) > 0) ||
+          stg.varFileName ||
+          stg.baseName ||
+          stg.baseAmi ||
+          stg.amiName ||
+          stg.amiSuffix ||
+          stg.rootVolumeSize
+        );
+      }
+
+      function setVmTypes() {
+        if ($scope.baseOsOptions.length && $scope.baseOsOptions.every(({ vmTypes }) => vmTypes)) {
+          const allVmTypes =
+            $scope.baseOsOptions.length &&
+            new Set($scope.baseOsOptions.reduce((types, { vmTypes }) => types.concat(vmTypes), []));
+          const baseOs = $scope.baseOsOptions.find(({ id }) => id === $scope.stage.baseOs);
+
+          $scope.viewState.showVmTypeSelector = allVmTypes.size > 1;
+          $scope.vmTypes = baseOs.vmTypes;
+        } else {
+          $scope.viewState.showVmTypeSelector = true;
+          $scope.vmTypes = ['hvm', 'pv'];
+        }
+      }
+
+      this.addExtendedAttribute = function () {
+        if (!$scope.stage.extendedAttributes) {
+          $scope.stage.extendedAttributes = {};
+        }
+        $uibModal
+          .open({
+            templateUrl: PipelineTemplates.addExtendedAttributes,
+            controller: 'bakeStageAddExtendedAttributeController',
+            controllerAs: 'addExtendedAttribute',
+            resolve: {
+              extendedAttribute: function () {
+                return {
+                  key: '',
+                  value: '',
+                };
+              },
+            },
+          })
+          .result.then(function (extendedAttribute) {
+            $scope.stage.extendedAttributes[extendedAttribute.key] = extendedAttribute.value;
+          })
+          .catch(() => {});
+      };
+
+      this.removeExtendedAttribute = function (key) {
+        delete $scope.stage.extendedAttributes[key];
+      };
+
+      this.showTemplateFileName = function () {
+        return $scope.viewState.roscoMode || $scope.stage.templateFileName;
+      };
+
+      this.showExtendedAttributes = function () {
+        return (
+          $scope.viewState.roscoMode || ($scope.stage.extendedAttributes && _.size($scope.stage.extendedAttributes) > 0)
+        );
+      };
+
+      this.showVarFileName = function () {
+        return $scope.viewState.roscoMode || $scope.stage.varFileName;
+      };
+
+      this.handleBaseOsChange = function () {
+        setVmTypes();
+        if ($scope.vmTypes && $scope.vmTypes.length && !$scope.vmTypes.includes($scope.stage.vmType)) {
+          $scope.stage.vmType = $scope.vmTypes[0];
+        }
+      };
+
+      $scope.$watch('stage', stageUpdated, true);
+
+      initialize();
+    },
+  ]);

package/src/pipeline/stages/bake/bakeExecutionDetails.controller.js

@@ -0,0 +1,43 @@
+'use strict';
+
+import UIROUTER_ANGULARJS from '@uirouter/angularjs';
+import { module } from 'angular';
+import { get } from 'lodash';
+
+import { SETTINGS } from '@spinnaker/core';
+
+export const AMAZON_PIPELINE_STAGES_BAKE_BAKEEXECUTIONDETAILS_CONTROLLER =
+  'spinnaker.amazon.pipeline.stage.bake.executionDetails.controller';
+export const name = AMAZON_PIPELINE_STAGES_BAKE_BAKEEXECUTIONDETAILS_CONTROLLER; // for backwards compatibility
+module(AMAZON_PIPELINE_STAGES_BAKE_BAKEEXECUTIONDETAILS_CONTROLLER, [UIROUTER_ANGULARJS]).controller(
+  'awsBakeExecutionDetailsCtrl',
+  [
+    '$scope',
+    '$stateParams',
+    'executionDetailsSectionService',
+    '$interpolate',
+    function ($scope, $stateParams, executionDetailsSectionService, $interpolate) {
+      $scope.configSections = ['bakeConfig', 'taskStatus'];
+
+      const initialized = () => {
+        $scope.detailsSection = $stateParams.details;
+        $scope.provider = $scope.stage.context.cloudProviderType || 'aws';
+        $scope.roscoMode =
+          SETTINGS.feature.roscoMode ||
+          (typeof SETTINGS.feature.roscoSelector === 'function' &&
+            SETTINGS.feature.roscoSelector($scope.stage.context));
+        $scope.bakeryDetailUrl = $interpolate(
+          $scope.roscoMode && SETTINGS.roscoDetailUrl ? SETTINGS.roscoDetailUrl : SETTINGS.bakeryDetailUrl,
+        );
+        $scope.bakeFailedNoError =
+          get($scope.stage, 'context.status.result') === 'FAILURE' && !$scope.stage.failureMessage;
+      };
+
+      const initialize = () => executionDetailsSectionService.synchronizeSection($scope.configSections, initialized);
+
+      initialize();
+
+      $scope.$on('$stateChangeSuccess', initialize);
+    },
+  ],
+);

package/src/pipeline/stages/bake/bakeExecutionDetails.html

@@ -0,0 +1,65 @@
+<div ng-controller="awsBakeExecutionDetailsCtrl">
+  <execution-details-section-nav sections="configSections"></execution-details-section-nav>
+  <div class="step-section-details" ng-if="detailsSection === 'bakeConfig'">
+    <div class="row">
+      <div class="col-md-6">
+        <dl class="dl-narrow dl-horizontal">
+          <dt if-multiple-providers>Provider</dt>
+          <dd if-multiple-providers>Amazon</dd>
+          <dt>Image</dt>
+          <dd>{{stage.context.ami}}</dd>
+          <dt>Region</dt>
+          <dd>{{stage.context.region}}</dd>
+          <dt>Package</dt>
+          <dd>{{stage.context.package}}</dd>
+        </dl>
+      </div>
+      <div class="col-md-6">
+        <dl class="dl-narrow dl-horizontal">
+          <dt>Base OS</dt>
+          <dd>{{stage.context.baseOs}}</dd>
+          <dt>VM Type</dt>
+          <dd>{{stage.context.vmType | uppercase}}</dd>
+          <dt ng-if="!roscoMode">Store Type</dt>
+          <dd ng-if="!roscoMode">{{stage.context.storeType | uppercase}}</dd>
+          <dt ng-if="!roscoMode">Label</dt>
+          <dd ng-if="!roscoMode">{{stage.context.baseLabel}}</dd>
+          <dt ng-if="roscoMode || execution.trigger.rebake || stage.context.rebake">Rebake</dt>
+          <dd ng-if="roscoMode || execution.trigger.rebake || stage.context.rebake">
+            {{execution.trigger.rebake || stage.context.rebake || false}}
+          </dd>
+          <dt ng-if="stage.context.templateFileName">Template</dt>
+          <dd ng-if="stage.context.templateFileName">{{stage.context.templateFileName}}</dd>
+          <dt ng-if="stage.context.varFileName">Var File</dt>
+          <dd ng-if="stage.context.varFileName">{{stage.context.varFileName}}</dd>
+        </dl>
+      </div>
+    </div>
+    <stage-failure-message
+      stage="stage"
+      message="stage.failureMessage"
+      ng-if="stage.failureMessage"
+    ></stage-failure-message>
+
+    <div class="row" ng-if="stage.context.region && stage.context.status.resourceId">
+      <div class="col-md-12">
+        <div class="alert alert-{{stage.isFailed ? 'danger' : 'info'}}">
+          <div ng-if="stage.context.previouslyBaked">No changes detected; reused existing bake</div>
+          <div ng-if="stage.context.imageName">
+            <strong>Image:</strong>
+            <div select-on-dbl-click>{{stage.context.imageName}}</div>
+            <div>({{stage.context.ami}})</div>
+          </div>
+          <span ng-if="bakeFailedNoError">Bake failed. </span>
+          <a target="_blank" href="{{ bakeryDetailUrl(stage) }}">View Bakery Details</a>
+          <span ng-if="bakeFailedNoError"> for more info.</span>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="step-section-details" ng-if="detailsSection === 'taskStatus'">
+    <div class="row">
+      <execution-step-details item="stage"></execution-step-details>
+    </div>
+  </div>
+</div>

package/src/pipeline/stages/bake/bakeStage.html

@@ -0,0 +1,205 @@
+<div ng-controller="awsBakeStageCtrl as bakeStageCtrl">
+  <div ng-if="viewState.loading" class="horizontal center middle">
+    <loading-spinner size="'small'"></loading-spinner>
+  </div>
+  <div ng-if="!viewState.loading && viewState.showDockerPreview">
+    <div ng-if="viewState.dockerBakeWarning" class="alert alert-warning sp-margin-s-top horizontal middle">
+      <i class="fa fa-exclamation-triangle"></i>
+      <div class="sp-margin-s-left">
+        <markdown message="viewState.dockerBakeWarning"></markdown>
+      </div>
+    </div>
+    <div>
+      <div class="alert alert-info horizontal middle">
+        <i class="fa fa-info-circle"></i>
+        <div class="sp-margin-s-left">
+          <markdown
+            message="'To edit bake configuration or view advanced options, migrate to EBS store type.'"
+          ></markdown>
+        </div>
+      </div>
+      <stage-config-field label="Store Type" ng-if="!viewState.roscoMode && viewState.showMigrationFields">
+        <label class="radio-inline" ng-repeat="storeType in storeTypes">
+          <input type="radio" ng-model="stage.storeType" ng-value="storeType" />
+          {{storeType | uppercase}}
+        </label>
+      </stage-config-field>
+      <stage-config-field label="Regions">
+        <span class="sp-margin-xs-right" ng-repeat="region in stage.regions">{{region}}</span>
+      </stage-config-field>
+      <stage-config-field label="Skip Region Detection">{{!!stage.skipRegionDetection}}</stage-config-field>
+      <stage-config-field label="Repo Path">{{stage.package}}</stage-config-field>
+      <stage-config-field label="Base OS">{{stage.baseOs}}</stage-config-field>
+      <stage-config-field label="VM Type">{{stage.vmType}}</stage-config-field>
+      <stage-config-field label="Store Type">{{stage.storeType}}</stage-config-field>
+      <stage-config-field label="Base Label">{{stage.baseLabel}}</stage-config-field>
+    </div>
+  </div>
+  <div ng-if="!viewState.loading && !viewState.showDockerPreview">
+    <div
+      ng-if="pipeline.migrationStatus === 'Started' && viewState.bakeWarning"
+      class="alert alert-warning sp-margin-s-top horizontal middle"
+    >
+      <i class="fa fa-exclamation-triangle"></i>
+      <div class="sp-margin-s-left">
+        <markdown message="viewState.bakeWarning"></markdown>
+      </div>
+    </div>
+    <stage-config-field label="Regions">
+      <checklist items="regions" model="stage.regions" inline="true" include-select-all-button="true"></checklist>
+    </stage-config-field>
+    <stage-config-field label="Skip Region Detection" help-key="pipeline.config.bake.skipRegionDetection">
+      <div class="checkbox" style="margin-bottom: 0">
+        <label>
+          <input type="checkbox" ng-model="stage.skipRegionDetection" />
+          Only bake explicitly selected regions
+        </label>
+      </div>
+    </stage-config-field>
+    <stage-config-field
+      label="{{stage.storeType === 'docker' ? 'Repo Path' : 'Package'}}"
+      help-key="pipeline.config.bake.package"
+    >
+      <input type="text" class="form-control input-sm" ng-model="stage.package" />
+    </stage-config-field>
+    <stage-config-field label="Base OS">
+      <bake-stage-choose-os
+        model="stage.baseOs"
+        base-os-options="baseOsOptions"
+        on-change="bakeStageCtrl.handleBaseOsChange()"
+      ></bake-stage-choose-os>
+    </stage-config-field>
+    <stage-config-field label="VM Type" ng-if="viewState.showVmTypeSelector && viewState.showMigrationFields">
+      <label class="radio-inline" ng-repeat="vmType in vmTypes">
+        <input type="radio" ng-model="stage.vmType" ng-value="vmType" />
+        {{vmType | uppercase}}
+      </label>
+    </stage-config-field>
+    <stage-config-field
+      label="Store Type"
+      ng-if="!viewState.roscoMode && viewState.showMigrationFields && viewState.showStoreType"
+    >
+      <label class="radio-inline" ng-repeat="storeType in storeTypes">
+        <input type="radio" ng-model="stage.storeType" ng-value="storeType" />
+        {{storeType | uppercase}}
+      </label>
+    </stage-config-field>
+    <stage-config-field label="Base Label">
+      <label class="radio-inline" ng-repeat="baseLabel in baseLabelOptions">
+        <input type="radio" ng-model="stage.baseLabel" ng-value="baseLabel" />
+        {{baseLabel}}
+      </label>
+    </stage-config-field>
+    <!-- Even if the roscoMode flag is false, we should show the control if rebake is set. -->
+    <stage-config-field label="Rebake" ng-if="viewState.roscoMode || stage.rebake">
+      <div class="checkbox" style="margin-bottom: 0">
+        <label>
+          <input type="checkbox" ng-model="stage.rebake" />
+          Rebake image without regard to the status of any existing bake
+        </label>
+      </div>
+    </stage-config-field>
+    <div class="form-group">
+      <div class="col-md-9 col-md-offset-1">
+        <div class="checkbox">
+          <label>
+            <input type="checkbox" ng-model="showAdvancedOptions" />
+            <strong>Show Advanced Options</strong>
+          </label>
+        </div>
+      </div>
+    </div>
+    <div ng-class="{collapse: showAdvancedOptions !== true, 'collapse.in': !showAdvancedOptions === true}">
+      <stage-config-field
+        label="Template File Name"
+        help-key="pipeline.config.bake.templateFileName"
+        ng-if="bakeStageCtrl.showTemplateFileName() && viewState.showMigrationFields"
+      >
+        <input type="text" class="form-control input-sm" ng-model="stage.templateFileName" />
+      </stage-config-field>
+      <stage-config-field
+        label="Extended Attributes"
+        help-key="pipeline.config.bake.extendedAttributes"
+        ng-if="bakeStageCtrl.showExtendedAttributes()"
+      >
+        <table class="table table-condensed packed">
+          <thead>
+            <tr>
+              <th style="width: 40%">Key</th>
+              <th style="width: 60%">Value</th>
+              <th class="text-right">Actions</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr ng-repeat="(key,value) in stage.extendedAttributes">
+              <td>
+                <strong class="small">{{key}}</strong>
+              </td>
+              <td>
+                <input
+                  type="text"
+                  ng-model="stage.extendedAttributes[key]"
+                  value="{{value}}"
+                  class="form-control input-sm"
+                />
+              </td>
+              <td class="text-right">
+                <a class="small" href ng-click="bakeStageCtrl.removeExtendedAttribute(key)">Remove</a>
+              </td>
+            </tr>
+          </tbody>
+          <tfoot>
+            <tr>
+              <td colspan="7">
+                <button class="btn btn-block btn-sm add-new" ng-click="bakeStageCtrl.addExtendedAttribute()">
+                  <span class="glyphicon glyphicon-plus-sign"></span> Add Extended Attribute
+                </button>
+              </td>
+            </tr>
+          </tfoot>
+        </table>
+      </stage-config-field>
+      <stage-config-field
+        label="Var File Name"
+        help-key="pipeline.config.bake.varFileName"
+        ng-if="bakeStageCtrl.showVarFileName() && viewState.showMigrationFields"
+      >
+        <input type="text" class="form-control input-sm" ng-model="stage.varFileName" />
+      </stage-config-field>
+      <stage-config-field label="Root Volume Size" ng-if="viewState.minRootVolumeSize && viewState.showMigrationFields">
+        <input
+          type="number"
+          class="form-control input-sm"
+          style="width: 80px; display: inline-block"
+          ng-min="viewState.minRootVolumeSize"
+          ng-model="stage.rootVolumeSize"
+        />
+        GB <span class="small">(minimum: {{viewState.minRootVolumeSize}})</span>
+      </stage-config-field>
+      <stage-config-field label="Base Name" ng-if="stage.storeType !== 'docker' && viewState.showMigrationFields">
+        <input type="text" class="form-control input-sm" ng-model="stage.baseName" />
+      </stage-config-field>
+      <stage-config-field
+        label="Base AMI"
+        help-key="pipeline.config.bake.baseAmi"
+        ng-if="stage.storeType !== 'docker' && viewState.showMigrationFields"
+      >
+        <input type="text" class="form-control input-sm" ng-model="stage.baseAmi" />
+      </stage-config-field>
+      <stage-config-field
+        label="{{stage.storeType === 'docker' ? 'Docker Image Name' : 'AMI Name'}}"
+        help-key="pipeline.config.bake.amiName"
+        ng-if="viewState.showMigrationFields"
+      >
+        <input type="text" class="form-control input-sm" ng-model="stage.amiName" />
+      </stage-config-field>
+      <stage-config-field
+        label="{{stage.storeType === 'docker' ? 'Docker Image Prefix' : 'AMI Suffix'}}"
+        help-key="pipeline.config.bake.amiSuffix"
+        ng-if="viewState.showMigrationFields"
+      >
+        <input type="text" class="form-control input-sm" ng-model="stage.amiSuffix" />
+      </stage-config-field>
+    </div>
+  </div>
+</div>