@spinnaker/amazon 0.13.0 → 0.13.2

package/src/serverGroup/configure/AmazonImageSelectInput.tsx

@@ -59,7 +59,7 @@ export class AmazonImageSelectInput extends React.Component<IAmazonImageSelector
 
     // assume that the specific image exists in the selected region
     const amis = { [region]: [imageId] };
-    const attributes = { virtualizationType: '*', creationDate: new Date().toISOString() };
+    const attributes = { virtualizationType: '*', architecture: '*', creationDate: new Date().toISOString() };
 
     return { imageName, amis, attributes } as IAmazonImage;
   }

package/src/serverGroup/configure/serverGroupConfiguration.service.ts

@@ -54,6 +54,7 @@ import type {
   IScalingProcess,
 } from '../../domain';
 import { AMAZON_INSTANCE_AWSINSTANCETYPE_SERVICE } from '../../instance/awsInstanceType.service';
+import type { IAmazonInstanceType } from '../../instance/awsInstanceType.service';
 import { KeyPairsReader } from '../../keyPairs';
 
 export type IBlockDeviceMappingSource = 'source' | 'ami' | 'default';
@@ -69,6 +70,7 @@ export interface IAmazonServerGroupCommandResult extends IServerGroupCommandResu
 export interface IAmazonServerGroupCommandBackingDataFiltered extends IServerGroupCommandBackingDataFiltered {
   keyPairs: string[];
   targetGroups: string[];
+  instanceTypesInfo: IAmazonInstanceType[];
 }
 
 export interface IAmazonServerGroupCommandBackingData extends IServerGroupCommandBackingData {
@@ -77,6 +79,7 @@ export interface IAmazonServerGroupCommandBackingData extends IServerGroupComman
   keyPairs: IKeyPair[];
   targetGroups: string[];
   scalingProcesses: IScalingProcess[];
+  instanceTypesInfo: IAmazonInstanceType[];
 }
 
 export interface IAmazonServerGroupCommandViewState extends IServerGroupCommandViewState {
@@ -145,6 +148,7 @@ export interface IAmazonServerGroupCommand extends IServerGroupCommand {
   spotAllocationStrategy?: string;
   spotInstancePools?: number;
   launchTemplateOverridesForInstanceType?: IAmazonInstanceTypeOverride[];
+  amiArchitecture: string;
 
   getBlockDeviceMappingsSource: (command: IServerGroupCommand) => IBlockDeviceMappingSource;
   selectBlockDeviceMappingsSource: (command: IServerGroupCommand, selection: string) => void;
@@ -274,7 +278,7 @@ export class AwsServerGroupConfigurationService {
           subnets,
           preferredZones,
           keyPairs,
-          instanceTypes,
+          instanceTypesInfo,
           enabledMetrics,
           healthCheckTypes,
           terminationPolicies,
@@ -285,7 +289,7 @@ export class AwsServerGroupConfigurationService {
             subnets,
             preferredZones,
             keyPairs,
-            instanceTypes,
+            instanceTypesInfo,
             enabledMetrics,
             healthCheckTypes,
             terminationPolicies,
@@ -373,23 +377,29 @@ export class AwsServerGroupConfigurationService {
   public configureInstanceTypes(command: IAmazonServerGroupCommand): IServerGroupCommandResult {
     const result: IAmazonServerGroupCommandResult = { dirty: {} };
     if (command.region && (command.virtualizationType || command.viewState.disableImageSelection)) {
-      let filtered = this.awsInstanceTypeService.getAvailableTypesForRegions(command.backingData.instanceTypes, [
-        command.region,
-      ]);
-      if (command.virtualizationType) {
-        filtered = this.awsInstanceTypeService.filterInstanceTypes(
-          filtered,
+      let filteredTypesInfo: IAmazonInstanceType[] = this.awsInstanceTypeService.getAvailableTypesForRegions(
+        command.backingData.instanceTypesInfo,
+        [command.region],
+      );
+      if (command.virtualizationType || command.amiArchitecture) {
+        filteredTypesInfo = this.awsInstanceTypeService.filterInstanceTypes(
+          filteredTypesInfo,
           command.virtualizationType,
           !!command.vpcId,
+          command.amiArchitecture,
         );
       }
-      if (command.instanceType && !filtered.includes(command.instanceType)) {
+
+      const filteredTypes: string[] = map(filteredTypesInfo, 'name');
+      if (command.instanceType && !filteredTypes.includes(command.instanceType)) {
         result.dirty.instanceType = command.instanceType;
         command.instanceType = null;
       }
-      command.backingData.filtered.instanceTypes = filtered;
+      command.backingData.filtered.instanceTypes = filteredTypes;
+      command.backingData.filtered.instanceTypesInfo = filteredTypesInfo;
     } else {
       command.backingData.filtered.instanceTypes = [];
+      command.backingData.filtered.instanceTypesInfo = [];
     }
     extend(command.viewState.dirty, result.dirty);
     return result;
@@ -399,6 +409,7 @@ export class AwsServerGroupConfigurationService {
     const result: IAmazonServerGroupCommandResult = { dirty: {} };
     if (!command.amiName) {
       command.virtualizationType = null;
+      command.amiArchitecture = null;
     }
     if (command.viewState.disableImageSelection) {
       return result;

package/src/serverGroup/configure/wizard/instanceType/InstanceTypeSelector.tsx

@@ -71,7 +71,7 @@ export function InstanceTypeSelector(props: IInstanceTypeSelectorProps) {
       <div className="container-fluid form-horizontal" style={{ padding: '0 15px' }}>
         <div>
           <p>
-            To configure a single instance type, use
+            Switch to
             <a className="clickable" onClick={() => handleModeChange(true)}>
               <span> Simple Mode</span>
             </a>
@@ -94,7 +94,7 @@ export function InstanceTypeSelector(props: IInstanceTypeSelectorProps) {
   return (
     <div className="container-fluid form-horizontal" style={{ padding: '0 15px' }}>
       <div>
-        <span>To configure mixed server groups with multiple instance types,</span>
+        <span>To configure mixed server groups and/or multiple instance types,</span>
         {!isLaunchTemplatesEnabled && (
           <span>
             <a

package/src/serverGroup/configure/wizard/instanceType/advancedMode/AdvancedModeSelector.tsx

@@ -89,7 +89,7 @@ export function AdvancedModeSelector(props: IAdvancedModeSelectorProps) {
         unlimitedCpuCreditsInCmd={command.unlimitedCpuCredits}
         profileDetails={instanceTypeDetails.find((p) => p.type === instanceProfile)}
         availableInstanceTypesList={
-          (command.backingData && command.backingData.filtered && command.backingData.filtered.instanceTypes) || []
+          (command.backingData && command.backingData.filtered && command.backingData.filtered.instanceTypesInfo) || []
         }
         handleInstanceTypesChange={handleInstanceTypesChange}
         setUnlimitedCpuCredits={setUnlimitedCpuCredits}

package/src/serverGroup/configure/wizard/instanceType/advancedMode/AmazonInstanceTypeInfoRenderer.tsx

@@ -0,0 +1,59 @@
+import _ from 'lodash';
+import React from 'react';
+
+import type { IAmazonInstanceType } from '../../../../../instance/awsInstanceType.service';
+
+export function AmazonInstanceTypeInfoRenderer(props: { instanceType: IAmazonInstanceType }) {
+  const spotSupport = props.instanceType.supportedUsageClasses.includes('spot') ? '| SPOT supported' : '';
+  const CpuMem = `${props.instanceType.defaultVCpus} vCPU | ${props.instanceType.memoryInGiB} Gib Memory ${spotSupport}`;
+  const instanceStorageInfo = props.instanceType.instanceStorageSupported && (
+    <span>
+      <br />
+      <span className={`select-option-label-attributes`}>
+        {`Instance Storage: ${_.toUpper(props.instanceType.instanceStorageInfo.storageTypes)} | ${
+          props.instanceType.instanceStorageInfo.totalSizeInGB
+        } Gib total size`}
+      </span>
+    </span>
+  );
+  const ebsInfo = props.instanceType.ebsInfo && (
+    <span>
+      <br />
+      <span className={`select-option-label-attributes`}>
+        {`EBS: optimization ${props.instanceType.ebsInfo.ebsOptimizedSupport} | NVMe ${props.instanceType.ebsInfo.nvmeSupport} | Encryption ${props.instanceType.ebsInfo.encryptionSupport}`}
+      </span>
+    </span>
+  );
+  const gpuInfo = props.instanceType.gpuInfo && (
+    <span>
+      <br />
+      <span className={`select-option-label-attributes`}>
+        {`GPU: ${props.instanceType.gpuInfo.totalGpuMemoryInMiB} MiB total memory`}
+        {props.instanceType.gpuInfo.gpus.map(
+          (g) => ` | ${g.count} ${g.manufacturer} ${g.name} GPUs, size: ${g.gpuSizeInMiB} MiB`,
+        )}
+      </span>
+    </span>
+  );
+  const generationInfo = typeof props.instanceType.currentGeneration !== 'undefined' &&
+    props.instanceType.currentGeneration !== null && (
+      <span>
+        <br />
+        <span className={`select-option-label-attributes`}>
+          {props.instanceType.currentGeneration ? 'Current Generation' : 'Previous Generation'}
+        </span>
+      </span>
+    );
+
+  return (
+    <span>
+      <span className={`select-option-label`}>{props.instanceType.name}</span>
+      <br />
+      <span className={`select-option-label-attributes`}>{CpuMem}</span>
+      {instanceStorageInfo}
+      {ebsInfo}
+      {gpuInfo}
+      {generationInfo}
+    </span>
+  );
+}

package/src/serverGroup/configure/wizard/instanceType/advancedMode/InstanceTypeRow.tsx

@@ -1,14 +1,19 @@
 import React, { useState } from 'react';
 import { Checkbox } from 'react-bootstrap';
 import { SortableHandle } from 'react-sortable-hoc';
-import { TextInput, Tooltip } from '@spinnaker/core';
+
+import { HoverablePopover, TextInput, Tooltip } from '@spinnaker/core';
+
+import { AmazonInstanceTypeInfoRenderer } from './AmazonInstanceTypeInfoRenderer';
 import type { IAmazonPreferredInstanceType } from '../../../../../instance/awsInstanceType.service';
+import type { IAmazonInstanceType } from '../../../../../instance/awsInstanceType.service';
 import { CostFactor } from '../../../../../instance/details/CostFactor';
 import type { IAmazonInstanceTypeOverride } from '../../../serverGroupConfiguration.service';
 
 export interface IRowProps {
   isCustom: boolean;
   selectedType?: IAmazonInstanceTypeOverride;
+  selectedTypeInfo?: IAmazonInstanceType;
   instanceTypeDetails?: IAmazonPreferredInstanceType;
   removeInstanceType?: (typeToRemove: string) => void;
   addOrUpdateInstanceType: (instanceType: string, weight: string) => void;
@@ -38,12 +43,20 @@ export function InstanceTypeRow(props: IRowProps) {
 
   let row;
   if (props.isCustom) {
+    const instanceTypeInfo = <AmazonInstanceTypeInfoRenderer instanceType={props.selectedTypeInfo} />;
     row = (
       <tr key={instanceType} className={'sortable clickable'}>
         <td>
           <DragHandle />
         </td>
-        <td>{instanceType}</td>
+        <td>
+          {`${instanceType} `}
+          <HoverablePopover placement={'right'} template={instanceTypeInfo} className={'custom-profile'}>
+            <span className="clickable help-field">
+              <i className="small glyphicon glyphicon-info-sign" />
+            </span>
+          </HoverablePopover>
+        </td>
         <td title={'Enter optional weight (allowed values: 1 to 999).'}>
           <TextInput
             className={'form-control input input-sm'}

package/src/serverGroup/configure/wizard/instanceType/advancedMode/InstanceTypeSelect.tsx

@@ -0,0 +1,78 @@
+import _ from 'lodash';
+import React from 'react';
+import type { Option } from 'react-select';
+import Select from 'react-select';
+
+import { HelpField } from '@spinnaker/core';
+
+import { AmazonInstanceTypeInfoRenderer } from './AmazonInstanceTypeInfoRenderer';
+import type { IAmazonInstanceType } from '../../../../../instance/awsInstanceType.service';
+
+export interface InstanceTypeSelectProps {
+  availableInstanceTypesList: IAmazonInstanceType[];
+  addOrUpdateInstanceType: (type: string, weight: string) => void;
+}
+
+export function InstanceTypeSelect(props: InstanceTypeSelectProps) {
+  /**
+   * Filters implemented:
+   * - instance family / size / type e.g. c3/ large/ c3.large
+   * - min vcpu e.g. 16vcpu
+   * - min memory e.g 32gib
+   * - instance storage type e.g. ssd, hdd
+   * - spot support
+   * - ebs support
+   * - gpu support
+   * - current generation v/s old generation like 'currentGen' / 'oldGen'
+   */
+  const filterOption = (option: IAmazonInstanceType, inputValue: string) => {
+    const {
+      name,
+      defaultVCpus,
+      memoryInGiB,
+      instanceStorageInfo,
+      ebsInfo,
+      gpuInfo,
+      supportedUsageClasses,
+      currentGeneration,
+    } = option;
+
+    return inputValue.split(',').every((inputVal: string) => {
+      const searchVal = _.toLower(inputVal.trim());
+      return (
+        (searchVal.match(/\d+\s*vcpu/) && defaultVCpus >= _.toNumber(searchVal.split('vcpu')[0].trim())) ||
+        (searchVal.match(/\d+\s*gib/) && memoryInGiB >= _.toNumber(searchVal.split('gib')[0].trim())) ||
+        (searchVal.match(/\b(ssd|hdd)\b/) && instanceStorageInfo?.storageTypes.includes(searchVal)) ||
+        (searchVal === 'spot' && supportedUsageClasses?.includes(searchVal)) ||
+        (searchVal === 'ebs' && ebsInfo) ||
+        (searchVal === 'gpu' && gpuInfo) ||
+        (searchVal === 'currentgen' && currentGeneration) ||
+        (searchVal === 'oldgen' && !currentGeneration) ||
+        name.match(searchVal)
+      );
+    });
+  };
+
+  const optionRenderer = (option: IAmazonInstanceType) => {
+    return <AmazonInstanceTypeInfoRenderer instanceType={option} />;
+  };
+
+  return (
+    <div className={'custom-profile'}>
+      <Select
+        className={`select`}
+        clearable={false}
+        multi={false}
+        placeholder={'Filter like 16vcpu, 32gib, spot, oldGen or Select an instance type to add'}
+        removeSelected={true}
+        searchable={true}
+        options={props.availableInstanceTypesList}
+        optionRenderer={optionRenderer}
+        filterOption={filterOption}
+        valueRenderer={(o) => <>{o.name}</>}
+        onChange={(o: Option<IAmazonInstanceType>) => props.addOrUpdateInstanceType(o.name, undefined)}
+      />{' '}
+      <HelpField id="aws.serverGroup.instanceTypesSelect" />
+    </div>
+  );
+}

package/src/serverGroup/configure/wizard/instanceType/advancedMode/InstanceTypeTable.tsx

@@ -8,6 +8,7 @@ import { Header, Heading } from './InstanceTypeTableParts';
 import { Footer } from './InstanceTypeTableParts';
 import { AWSProviderSettings } from '../../../../../aws.settings';
 import type { IAmazonInstanceTypeCategory } from '../../../../../instance/awsInstanceType.service';
+import type { IAmazonInstanceType } from '../../../../../instance/awsInstanceType.service';
 import type { IAmazonInstanceTypeOverride } from '../../../serverGroupConfiguration.service';
 
 import './advancedMode.less';
@@ -17,7 +18,7 @@ export interface IInstanceTypeTableProps {
   selectedInstanceTypesMap: Map<string, IAmazonInstanceTypeOverride>;
   unlimitedCpuCreditsInCmd: boolean;
   profileDetails: IAmazonInstanceTypeCategory;
-  availableInstanceTypesList: string[];
+  availableInstanceTypesList: IAmazonInstanceType[];
   handleInstanceTypesChange: (instanceTypes: IAmazonInstanceTypeOverride[]) => void;
   setUnlimitedCpuCredits: (unlimitedCpuCredits: boolean | undefined) => void;
 }
@@ -120,6 +121,9 @@ export function InstanceTypeTable(props: IInstanceTypeTableProps) {
           <InstanceTypeTableBody
             isCustom={isCustom}
             selectedInstanceTypesMap={selectedInstanceTypesMap}
+            selectedInstanceTypesInfo={props.availableInstanceTypesList.filter((it) =>
+              selectedInstanceTypeNames.includes(it.name),
+            )}
             addOrUpdateInstanceType={addOrUpdateInstanceType}
             removeInstanceType={removeInstanceType}
             handleSortEnd={handleSortEnd}
@@ -127,7 +131,7 @@ export function InstanceTypeTable(props: IInstanceTypeTableProps) {
           <Footer
             isCustom={isCustom}
             availableInstanceTypesList={props.availableInstanceTypesList.filter(
-              (it) => !selectedInstanceTypeNames.includes(it),
+              (it) => !selectedInstanceTypeNames.includes(it.name),
             )}
             addOrUpdateInstanceType={addOrUpdateInstanceType}
           />

package/src/serverGroup/configure/wizard/instanceType/advancedMode/InstanceTypeTableBody.tsx

@@ -6,13 +6,17 @@ import { SortableContainer, SortableElement } from 'react-sortable-hoc';
 import type { IInstanceTypeFamily } from '@spinnaker/core';
 
 import { InstanceTypeRow } from './InstanceTypeRow';
-import type { IAmazonPreferredInstanceType } from '../../../../../instance/awsInstanceType.service';
+import type {
+  IAmazonInstanceType,
+  IAmazonPreferredInstanceType,
+} from '../../../../../instance/awsInstanceType.service';
 import type { IAmazonInstanceTypeOverride } from '../../../serverGroupConfiguration.service';
 
 export function InstanceTypeTableBody(props: {
   isCustom: boolean;
   profileFamiliesDetails?: IInstanceTypeFamily[];
   selectedInstanceTypesMap: Map<string, IAmazonInstanceTypeOverride>;
+  selectedInstanceTypesInfo?: IAmazonInstanceType[];
   addOrUpdateInstanceType: (instanceType: string, weight: string) => void;
   removeInstanceType: (instanceType: string) => void;
   handleSortEnd: (sortEnd: SortEnd) => void;
@@ -21,6 +25,7 @@ export function InstanceTypeTableBody(props: {
     <TableRows
       isCustom={props.isCustom}
       selectedInstanceTypesMap={props.selectedInstanceTypesMap}
+      selectedInstanceTypesInfo={props.selectedInstanceTypesInfo}
       removeInstanceType={props.removeInstanceType}
       addOrUpdateInstanceType={props.addOrUpdateInstanceType}
       instanceTypeDetails={
@@ -43,6 +48,7 @@ const TableRows = SortableContainer(
     isCustom: boolean;
     instanceTypeDetails?: Map<string, IAmazonPreferredInstanceType>;
     selectedInstanceTypesMap: Map<string, IAmazonInstanceTypeOverride>;
+    selectedInstanceTypesInfo?: IAmazonInstanceType[];
     removeInstanceType: (typeToRemove: string) => void;
     addOrUpdateInstanceType: (instanceType: string, weight: string) => void;
   }) => {
@@ -60,6 +66,7 @@ const TableRows = SortableContainer(
               index={index}
               isCustom={true}
               selectedType={selectedType}
+              selectedTypeInfo={props.selectedInstanceTypesInfo.find((it) => it.name === selectedType.instanceType)}
               removeInstanceType={props.removeInstanceType}
               addOrUpdateInstanceType={props.addOrUpdateInstanceType}
             />
@@ -119,6 +126,7 @@ const SortableRow = SortableElement(
   (props: {
     isCustom: boolean;
     selectedType: IAmazonInstanceTypeOverride;
+    selectedTypeInfo?: IAmazonInstanceType;
     instanceTypeDetails?: Map<string, IAmazonPreferredInstanceType>;
     removeInstanceType: (typeToRemove: string) => void;
     addOrUpdateInstanceType: (instanceType: string, weight: string) => void;
@@ -127,6 +135,7 @@ const SortableRow = SortableElement(
       key={props.selectedType.instanceType}
       isCustom={props.isCustom}
       selectedType={props.selectedType}
+      selectedTypeInfo={props.selectedTypeInfo}
       instanceTypeDetails={!props.isCustom ? props.instanceTypeDetails.get(props.selectedType.instanceType) : null}
       removeInstanceType={props.removeInstanceType}
       addOrUpdateInstanceType={props.addOrUpdateInstanceType}

package/src/serverGroup/configure/wizard/instanceType/advancedMode/InstanceTypeTableParts.tsx

@@ -1,9 +1,12 @@
 import React from 'react';
-import type { Option } from 'react-select';
-import Select from 'react-select';
 
 import { HelpField } from '@spinnaker/core';
 
+import { InstanceTypeSelect } from './InstanceTypeSelect';
+import type { IAmazonInstanceType } from '../../../../../instance/awsInstanceType.service';
+
+import './advancedMode.less';
+
 export function Heading(props: { isCustom: boolean; profileLabel?: string; profileDescriptionArr?: string[] }) {
   let description;
   if (props.isCustom) {
@@ -28,6 +31,16 @@ export function Heading(props: { isCustom: boolean; profileLabel?: string; profi
       <h4>Instance Types</h4>
       <div className={'description'}>
         {description}
+        <p>
+          Learn about AWS recommended best practices in{' '}
+          <a
+            target="_blank"
+            href="https://spinnaker.io/docs/setup/other_config/server-group-launch-settings/aws-ec2/launch-templates/#create-a-server-group-with-aws-recommended-best-practices-for-ec2-spot"
+          >
+            examples and docs
+          </a>
+          .
+        </p>
         <i>
           <b>Note:</b>
           <ul>
@@ -94,7 +107,7 @@ export function Header(props: { isCustom: boolean; showCpuCredits?: boolean }) {
 
 export function Footer(props: {
   isCustom: boolean;
-  availableInstanceTypesList: string[];
+  availableInstanceTypesList: IAmazonInstanceType[];
   addOrUpdateInstanceType: (type: string, weight: string) => void;
 }) {
   return props.isCustom ? (
@@ -114,24 +127,3 @@ export function Footer(props: {
     </tfoot>
   ) : null;
 }
-
-const InstanceTypeSelect = (props: {
-  availableInstanceTypesList: string[];
-  addOrUpdateInstanceType: (type: string, weight: string) => void;
-}): JSX.Element => {
-  const instanceTypeListOptions = props.availableInstanceTypesList.map((instanceType) => {
-    return { label: instanceType, value: instanceType };
-  });
-
-  return (
-    <Select
-      clearable={false}
-      multi={false}
-      placeholder={'Select an instance type to add...'}
-      removeSelected={true}
-      searchable={true}
-      options={instanceTypeListOptions}
-      onChange={(o: Option<string>) => props.addOrUpdateInstanceType(o.value, undefined)}
-    />
-  );
-};

package/src/serverGroup/configure/wizard/instanceType/advancedMode/InstancesDistribution.tsx

@@ -99,7 +99,10 @@ export function InstancesDistribution(props: IInstancesDistributionProps) {
         help={<HelpField id={'aws.serverGroup.spotMaxPrice'} />}
         input={(inputProps) => (
           <Tooltip value={'Recommended to leave empty and use AWS default i.e. On-Demand price'}>
-            <TextInput {...inputProps} />
+            <TextInput
+              {...inputProps}
+              placeholder={'Recommended to leave empty and use AWS default i.e. On-Demand price'}
+            />
           </Tooltip>
         )}
       />

package/src/serverGroup/configure/wizard/instanceType/advancedMode/advancedMode.less

@@ -47,7 +47,19 @@
 
 .custom-profile {
   .select {
-    width: 80%;
+    width: 97%;
+    display: inline-flex;
+  }
+
+  .select-option-label {
+    font-size: 100%;
+    font-weight: bold;
+  }
+
+  .select-option-label-attributes {
+    font-size: 90%;
+    font-weight: normal;
+    font-style: italic;
   }
 }
 

package/src/serverGroup/configure/wizard/pages/ServerGroupBasicSettings.tsx

@@ -82,9 +82,12 @@ export class ServerGroupBasicSettings
     this.setState({ selectedImage: image });
 
     const virtualizationType = image && image.attributes.virtualizationType;
+    const amiArchitecture = image && image.attributes.architecture;
     const imageName = image && image.imageName;
     values.virtualizationType = virtualizationType;
+    values.amiArchitecture = amiArchitecture;
     values.amiName = imageName;
+    setFieldValue('amiArchitecture', amiArchitecture);
     setFieldValue('virtualizationType', virtualizationType);
     setFieldValue('amiName', imageName);
     values.imageChanged(values);