@spinnaker/google 2026.2.2 → 2026.3.0

package/src/serverGroup/details/GceInstanceFlexibilityPolicyDetails.spec.tsx

@@ -0,0 +1,32 @@
+import { shallow } from 'enzyme';
+import React from 'react';
+
+import { GceInstanceFlexibilityPolicyDetails } from './GceInstanceFlexibilityPolicyDetails';
+
+describe('GceInstanceFlexibilityPolicyDetails', () => {
+  it('renders selection names, optional ranks, and machine types without duplicating target shape', () => {
+    const wrapper = shallow(
+      <GceInstanceFlexibilityPolicyDetails
+        instanceFlexibilityPolicy={{
+          instanceSelections: {
+            preferred: { machineTypes: ['n2-standard-8'] },
+            fallback: { rank: 1, machineTypes: ['e2-standard-8', 'c3-standard-8'] },
+          },
+        }}
+      />,
+    );
+
+    const text = wrapper.text();
+    expect(text).toContain('preferred');
+    expect(text).toContain('n2-standard-8');
+    expect(text).toContain('fallback');
+    expect(text).toContain('1');
+    expect(text).toContain('e2-standard-8, c3-standard-8');
+    expect(text).not.toContain('Target Shape');
+  });
+
+  it('renders nothing when the policy is absent', () => {
+    const wrapper = shallow(<GceInstanceFlexibilityPolicyDetails />);
+    expect(wrapper.type()).toBeNull();
+  });
+});

package/src/serverGroup/details/GceInstanceFlexibilityPolicyDetails.tsx

@@ -0,0 +1,36 @@
+import { isEmpty } from 'lodash';
+import React from 'react';
+
+import type { IGceInstanceFlexibilityPolicy } from '../../domain/serverGroup';
+
+export interface IGceInstanceFlexibilityPolicyDetailsProps {
+  instanceFlexibilityPolicy?: IGceInstanceFlexibilityPolicy;
+}
+
+export function GceInstanceFlexibilityPolicyDetails({
+  instanceFlexibilityPolicy,
+}: IGceInstanceFlexibilityPolicyDetailsProps) {
+  const selections = instanceFlexibilityPolicy?.instanceSelections;
+  if (isEmpty(selections)) {
+    return null;
+  }
+
+  return (
+    <dl className="dl-horizontal dl-narrow">
+      {Object.entries(selections).map(([name, selection]) => (
+        <React.Fragment key={name}>
+          <dt>Selection</dt>
+          <dd>{name}</dd>
+          {selection.rank != null && (
+            <>
+              <dt>Rank</dt>
+              <dd>{selection.rank}</dd>
+            </>
+          )}
+          <dt>Machine types</dt>
+          <dd>{(selection.machineTypes || []).join(', ')}</dd>
+        </React.Fragment>
+      ))}
+    </dl>
+  );
+}

package/src/serverGroup/details/autoHealingPolicy/GceAutoHealingPolicyDetails.spec.tsx

@@ -0,0 +1,192 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+
+import { ConfirmationModalService } from '@spinnaker/core';
+
+import { GceAutoscalingPolicyWriter } from '../../../autoscalingPolicy';
+import { GceAutoHealingPolicyDetails } from './GceAutoHealingPolicyDetails';
+import { GceUpsertAutoHealingPolicyModal } from './modal/GceUpsertAutoHealingPolicyModal';
+
+describe('GceAutoHealingPolicyDetails', () => {
+  const application = { name: 'my-app' } as any;
+  const serverGroup = { account: 'my-account', name: 'my-app-main-v001', region: 'us-central1' } as any;
+  const managedServerGroup = {
+    ...serverGroup,
+    isManaged: true,
+    managedResourceSummary: {
+      id: 'managed-resource-id',
+      isPaused: false,
+      locations: { account: 'my-account', regions: [] },
+    },
+  } as any;
+  const policy = { healthCheck: 'web', initialDelaySec: 0, maxUnavailable: { fixed: 0 } } as any;
+
+  it('summarizes zero-valued delay without rendering legacy max unavailable data', () => {
+    const wrapper = shallow(
+      <GceAutoHealingPolicyDetails
+        application={application}
+        mutationsEnabled={true}
+        serverGroup={serverGroup}
+        policy={policy}
+      />,
+    );
+
+    expect(wrapper.text()).toContain('web');
+    expect(wrapper.text()).toContain('0 seconds');
+    expect(wrapper.text()).not.toContain('Max Unavailable');
+    expect(wrapper.text()).not.toContain('0 fixed');
+  });
+
+  it('opens edit after managed-resource confirmation proceeds', async () => {
+    const show = spyOn(GceUpsertAutoHealingPolicyModal, 'show');
+    const confirm = spyOn(ConfirmationModalService, 'confirm').and.returnValue(Promise.resolve() as any);
+    const wrapper = shallow(
+      <GceAutoHealingPolicyDetails
+        application={application}
+        mutationsEnabled={true}
+        serverGroup={managedServerGroup}
+        policy={policy}
+      />,
+    );
+
+    wrapper.find('[data-testid="edit-auto-healing-policy"]').simulate('click');
+    expect(show).not.toHaveBeenCalled();
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(confirm).toHaveBeenCalledWith(jasmine.objectContaining({ header: 'Pause Management?' }));
+    expect(show).toHaveBeenCalledWith({ application, serverGroup: managedServerGroup, policy });
+  });
+
+  it('does not open edit when managed-resource confirmation is cancelled', async () => {
+    const show = spyOn(GceUpsertAutoHealingPolicyModal, 'show');
+    spyOn(ConfirmationModalService, 'confirm').and.returnValue(Promise.reject() as any);
+    const wrapper = shallow(
+      <GceAutoHealingPolicyDetails
+        application={application}
+        mutationsEnabled={true}
+        serverGroup={managedServerGroup}
+        policy={policy}
+      />,
+    );
+
+    wrapper.find('[data-testid="edit-auto-healing-policy"]').simulate('click');
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(show).not.toHaveBeenCalled();
+  });
+
+  it('opens add after managed-resource confirmation proceeds', async () => {
+    const show = spyOn(GceUpsertAutoHealingPolicyModal, 'show');
+    const confirm = spyOn(ConfirmationModalService, 'confirm').and.returnValue(Promise.resolve() as any);
+    const wrapper = shallow(
+      <GceAutoHealingPolicyDetails
+        application={application}
+        mutationsEnabled={true}
+        serverGroup={managedServerGroup}
+        policy={undefined as any}
+      />,
+    );
+
+    wrapper.find('[data-testid="add-auto-healing-policy"]').simulate('click');
+    expect(show).not.toHaveBeenCalled();
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(confirm).toHaveBeenCalledWith(jasmine.objectContaining({ header: 'Pause Management?' }));
+    expect(show).toHaveBeenCalledWith({ application, serverGroup: managedServerGroup });
+  });
+
+  it('does not open add when managed-resource confirmation is cancelled', async () => {
+    const show = spyOn(GceUpsertAutoHealingPolicyModal, 'show');
+    spyOn(ConfirmationModalService, 'confirm').and.returnValue(Promise.reject() as any);
+    const wrapper = shallow(
+      <GceAutoHealingPolicyDetails
+        application={application}
+        mutationsEnabled={true}
+        serverGroup={managedServerGroup}
+        policy={undefined as any}
+      />,
+    );
+
+    wrapper.find('[data-testid="add-auto-healing-policy"]').simulate('click');
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(show).not.toHaveBeenCalled();
+  });
+
+  it('offers delete confirmation after managed-resource confirmation proceeds', async () => {
+    const confirm = spyOn(ConfirmationModalService, 'confirm').and.returnValues(
+      Promise.resolve() as any,
+      Promise.resolve() as any,
+    );
+    const deletePolicy = spyOn(GceAutoscalingPolicyWriter, 'deleteAutoHealingPolicy');
+    const wrapper = shallow(
+      <GceAutoHealingPolicyDetails
+        application={application}
+        mutationsEnabled={true}
+        serverGroup={managedServerGroup}
+        policy={policy}
+      />,
+    );
+
+    wrapper.find('[data-testid="delete-auto-healing-policy"]').simulate('click');
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(confirm.calls.count()).toBe(2);
+    const deleteConfirmation = confirm.calls.mostRecent().args[0];
+    deleteConfirmation.submitMethod();
+
+    expect(deletePolicy).toHaveBeenCalledWith(application, managedServerGroup);
+  });
+
+  it('does not offer delete confirmation when managed-resource confirmation is cancelled', async () => {
+    const cancelledConfirmation = {
+      then: (_onProceed: () => void, onCancel: () => void) => Promise.resolve(onCancel()),
+    } as any;
+    const confirm = spyOn(ConfirmationModalService, 'confirm').and.returnValue(cancelledConfirmation);
+    const deletePolicy = spyOn(GceAutoscalingPolicyWriter, 'deleteAutoHealingPolicy');
+    const wrapper = shallow(
+      <GceAutoHealingPolicyDetails
+        application={application}
+        mutationsEnabled={true}
+        serverGroup={managedServerGroup}
+        policy={policy}
+      />,
+    );
+
+    wrapper.find('[data-testid="delete-auto-healing-policy"]').simulate('click');
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(confirm.calls.count()).toBe(1);
+    expect(confirm).toHaveBeenCalledWith(jasmine.objectContaining({ header: 'Pause Management?' }));
+    expect(deletePolicy).not.toHaveBeenCalled();
+  });
+
+  it('hides all mutation actions when mutations are disabled', () => {
+    const details = shallow(
+      <GceAutoHealingPolicyDetails
+        application={application}
+        mutationsEnabled={false}
+        serverGroup={serverGroup}
+        policy={policy}
+      />,
+    );
+    const emptyDetails = shallow(
+      <GceAutoHealingPolicyDetails
+        application={application}
+        mutationsEnabled={false}
+        serverGroup={serverGroup}
+        policy={undefined as any}
+      />,
+    );
+
+    expect(details.find('[data-testid="edit-auto-healing-policy"]').exists()).toBe(false);
+    expect(details.find('[data-testid="delete-auto-healing-policy"]').exists()).toBe(false);
+    expect(emptyDetails.isEmptyRender()).toBe(true);
+  });
+});

package/src/serverGroup/details/autoHealingPolicy/GceAutoHealingPolicyDetails.tsx

@@ -0,0 +1,83 @@
+import React from 'react';
+
+import type { Application, IManagedResource } from '@spinnaker/core';
+import { ConfirmationModalService, confirmNotManaged } from '@spinnaker/core';
+
+import type { IGcePolicyServerGroup } from '../../../autoscalingPolicy';
+import { GceAutoscalingPolicyWriter } from '../../../autoscalingPolicy';
+import type { IGceAutoHealingPolicy } from '../../../domain';
+import { GceUpsertAutoHealingPolicyModal } from './modal/GceUpsertAutoHealingPolicyModal';
+
+export interface IGceAutoHealingPolicyDetailsProps {
+  application: Application;
+  mutationsEnabled: boolean;
+  serverGroup: IGcePolicyServerGroup & IManagedResource;
+  policy?: IGceAutoHealingPolicy;
+}
+
+export function GceAutoHealingPolicyDetails({
+  application,
+  mutationsEnabled,
+  serverGroup,
+  policy,
+}: IGceAutoHealingPolicyDetailsProps): JSX.Element | null {
+  const runIfNotManaged = (action: () => void): void => {
+    confirmNotManaged(serverGroup, application).then((notManaged) => notManaged && action());
+  };
+
+  if (!policy) {
+    return mutationsEnabled ? (
+      <button
+        className="btn btn-link"
+        data-testid="add-auto-healing-policy"
+        type="button"
+        onClick={() => runIfNotManaged(() => GceUpsertAutoHealingPolicyModal.show({ application, serverGroup }))}
+      >
+        Add auto-healing policy
+      </button>
+    ) : null;
+  }
+
+  const deletePolicy = (): void => {
+    ConfirmationModalService.confirm({
+      header: `Really delete autohealer for ${serverGroup.name}?`,
+      buttonText: 'Delete autohealer',
+      account: serverGroup.account,
+      taskMonitorConfig: { application, title: `Deleting autohealing policy for ${serverGroup.name}` },
+      submitMethod: () => GceAutoscalingPolicyWriter.deleteAutoHealingPolicy(application, serverGroup),
+    });
+  };
+
+  return (
+    <div className="gce-auto-healing-policy-details">
+      <dl className="horizontal-when-filters-collapsed">
+        <dt>Health Check</dt>
+        <dd>{policy.healthCheck || policy.healthCheckUrl || '-'}</dd>
+        <dt>Initial Delay</dt>
+        <dd>{policy.initialDelaySec ?? '-'} seconds</dd>
+      </dl>
+      {mutationsEnabled && (
+        <div className="text-right">
+          <button
+            className="btn btn-link"
+            data-testid="edit-auto-healing-policy"
+            type="button"
+            onClick={() =>
+              runIfNotManaged(() => GceUpsertAutoHealingPolicyModal.show({ application, serverGroup, policy }))
+            }
+          >
+            Edit
+          </button>
+          <button
+            className="btn btn-link"
+            data-testid="delete-auto-healing-policy"
+            type="button"
+            onClick={() => runIfNotManaged(deletePolicy)}
+          >
+            Delete
+          </button>
+        </div>
+      )}
+    </div>
+  );
+}

package/src/serverGroup/details/autoHealingPolicy/index.ts

@@ -0,0 +1,2 @@
+export * from './GceAutoHealingPolicyDetails';
+export * from './modal/GceUpsertAutoHealingPolicyModal';

package/src/serverGroup/details/autoHealingPolicy/modal/GceUpsertAutoHealingPolicyModal.spec.tsx

@@ -0,0 +1,94 @@
+import { SubmitButton } from '@spinnaker/core';
+
+import { GceAutoscalingPolicyWriter } from '../../../../autoscalingPolicy';
+import { IGceHealthCheckKind } from '../../../../domain';
+import { GceUpsertAutoHealingPolicyModal } from './GceUpsertAutoHealingPolicyModal';
+
+describe('GceUpsertAutoHealingPolicyModal', () => {
+  const application = { name: 'my-app' } as any;
+  const serverGroup = { account: 'my-account', name: 'my-app-main-v001', region: 'us-central1' } as any;
+
+  function isDisabled(policy: any): boolean {
+    const modal = new GceUpsertAutoHealingPolicyModal({ application, serverGroup, policy } as any);
+    modal.state.policy = policy;
+    const modalContents = (modal.render() as any).props.children;
+    const footer = modalContents.find((child: any) => child?.props?.className === 'modal-footer');
+    const submitButton = footer.props.children.find((child: any) => child?.type === SubmitButton);
+    return submitButton.props.isDisabled;
+  }
+
+  async function flush(): Promise<void> {
+    await Promise.resolve();
+    await Promise.resolve();
+  }
+
+  it('retains edited policy state when task creation is rejected', async () => {
+    spyOn(GceAutoscalingPolicyWriter, 'upsertAutoHealingPolicy').and.returnValue(
+      Promise.reject({ failureMessage: 'No permission' }),
+    );
+    const modal = new GceUpsertAutoHealingPolicyModal({
+      application: { name: 'my-app' },
+      serverGroup: { account: 'my-account', name: 'my-app-main-v001', region: 'us-central1' },
+      policy: { healthCheck: 'web', initialDelaySec: 300 },
+      closeModal: jasmine.createSpy('closeModal'),
+      dismissModal: jasmine.createSpy('dismissModal'),
+    } as any);
+    const editedPolicy = { healthCheck: 'web', initialDelaySec: 0 };
+    modal.state.policy = editedPolicy;
+
+    (modal as any).submit();
+    await flush();
+
+    expect(modal.state.policy).toBe(editedPolicy);
+    expect(modal.state.taskMonitor.error).toBe(true);
+  });
+
+  it('requires a health check name and kind pair', () => {
+    expect(isDisabled({ healthCheck: 'web', initialDelaySec: 0 })).toBe(true);
+    expect(
+      isDisabled({
+        healthCheck: 'web',
+        healthCheckKind: IGceHealthCheckKind.healthCheck,
+        initialDelaySec: 0,
+      }),
+    ).toBe(false);
+  });
+
+  it('requires a finite nonnegative initial delay within the backend range', () => {
+    const policy = { healthCheck: 'web', healthCheckKind: IGceHealthCheckKind.healthCheck };
+
+    expect(isDisabled({ ...policy, initialDelaySec: -1 })).toBe(true);
+    expect(isDisabled({ ...policy, initialDelaySec: Number.POSITIVE_INFINITY })).toBe(true);
+    expect(isDisabled({ ...policy, initialDelaySec: 2147483648 })).toBe(true);
+  });
+
+  it('does not validate legacy max unavailable data retained in permissive input', () => {
+    const policy = {
+      healthCheck: 'web',
+      healthCheckKind: IGceHealthCheckKind.healthCheck,
+      initialDelaySec: 0,
+    };
+
+    expect(isDisabled({ ...policy, maxUnavailable: { percent: 101 } })).toBe(false);
+    expect(isDisabled({ ...policy, maxUnavailable: { fixed: -1, percent: 1 } })).toBe(false);
+  });
+
+  it('does not hydrate legacy max unavailable data into editable modal state', () => {
+    const modal = new GceUpsertAutoHealingPolicyModal({
+      application,
+      serverGroup,
+      policy: {
+        healthCheck: 'web',
+        healthCheckKind: IGceHealthCheckKind.healthCheck,
+        initialDelaySec: 0,
+        maxUnavailable: { fixed: 2 },
+      } as any,
+    } as any);
+
+    expect(modal.state.policy).toEqual({
+      healthCheck: 'web',
+      healthCheckKind: IGceHealthCheckKind.healthCheck,
+      initialDelaySec: 0,
+    });
+  });
+});

package/src/serverGroup/details/autoHealingPolicy/modal/GceUpsertAutoHealingPolicyModal.tsx

@@ -0,0 +1,102 @@
+import { cloneDeep } from 'lodash';
+import React from 'react';
+
+import type { Application, IModalComponentProps } from '@spinnaker/core';
+import { ModalClose, ReactModal, SubmitButton, TaskMonitor, TaskMonitorWrapper } from '@spinnaker/core';
+
+import { GceAutoHealingPolicyEditor } from '../../../../autoHealingPolicy';
+import type { IGcePolicyServerGroup } from '../../../../autoscalingPolicy';
+import { GceAutoscalingPolicyWriter } from '../../../../autoscalingPolicy';
+import type { IGceAutoHealingPolicy } from '../../../../domain';
+
+export interface IGceUpsertAutoHealingPolicyModalProps extends IModalComponentProps {
+  application: Application;
+  serverGroup: IGcePolicyServerGroup;
+  policy?: IGceAutoHealingPolicy;
+}
+
+interface IGceUpsertAutoHealingPolicyModalState {
+  policy: IGceAutoHealingPolicy;
+  taskMonitor: TaskMonitor;
+}
+
+const MAX_INT = 2147483647;
+
+function isIntegerInRange(value: unknown, maximum = MAX_INT): value is number {
+  return (
+    typeof value === 'number' && Number.isFinite(value) && Number.isInteger(value) && value >= 0 && value <= maximum
+  );
+}
+
+function isValidPolicy(policy: IGceAutoHealingPolicy): boolean {
+  return Boolean(policy.healthCheck?.trim() && policy.healthCheckKind && isIntegerInRange(policy.initialDelaySec));
+}
+
+export class GceUpsertAutoHealingPolicyModal extends React.Component<
+  IGceUpsertAutoHealingPolicyModalProps,
+  IGceUpsertAutoHealingPolicyModalState
+> {
+  public static show(props: IGceUpsertAutoHealingPolicyModalProps): Promise<void> {
+    return ReactModal.show(GceUpsertAutoHealingPolicyModal, props, { dialogClassName: 'modal-md' });
+  }
+
+  public constructor(props: IGceUpsertAutoHealingPolicyModalProps) {
+    super(props);
+    const action = props.policy ? 'Edit' : 'New';
+    const policy = cloneDeep(props.policy || { initialDelaySec: 300 });
+    Reflect.deleteProperty(policy, 'maxUnavailable');
+    this.state = {
+      policy,
+      taskMonitor: new TaskMonitor({
+        application: props.application,
+        title: `${action} autohealing policy for ${props.serverGroup.name}`,
+        onDismiss: () => props.dismissModal?.(),
+        onTaskComplete: () => {
+          props.application.serverGroups?.refresh?.();
+          props.closeModal?.();
+        },
+      }),
+    };
+  }
+
+  private submit = (): void => {
+    this.state.taskMonitor.submit(() =>
+      GceAutoscalingPolicyWriter.upsertAutoHealingPolicy(
+        this.props.application,
+        this.props.serverGroup,
+        this.state.policy,
+      ),
+    );
+  };
+
+  public render(): JSX.Element {
+    const isNew = !this.props.policy;
+    return (
+      <>
+        <TaskMonitorWrapper monitor={this.state.taskMonitor} />
+        <ModalClose dismiss={this.props.dismissModal} />
+        <div className="modal-header">
+          <h4 className="modal-title">{isNew ? 'New' : 'Edit'} autohealing policy</h4>
+        </div>
+        <div className="modal-body">
+          <GceAutoHealingPolicyEditor
+            account={this.props.serverGroup.account}
+            policy={this.state.policy}
+            onChange={(policy) => this.setState({ policy })}
+          />
+        </div>
+        <div className="modal-footer">
+          <button className="btn btn-default" type="button" onClick={() => this.props.dismissModal?.()}>
+            Cancel
+          </button>
+          <SubmitButton
+            isDisabled={!isValidPolicy(this.state.policy)}
+            label={isNew ? 'Create' : 'Update'}
+            onClick={this.submit}
+            submitting={this.state.taskMonitor.submitting}
+          />
+        </div>
+      </>
+    );
+  }
+}