@spinnaker/kayenta 0.0.0-2025.1-0

package/src/kayenta/domain/IKayentaStageConfig.ts

@@ -0,0 +1,58 @@
+export interface IKayentaStage {
+  canaryConfig: IKayentaStageCanaryConfig;
+  analysisType: KayentaAnalysisType;
+  deployments: IKayentaStageDeployments;
+  isNew: boolean;
+}
+
+export interface IKayentaStageCanaryConfig {
+  beginCanaryAnalysisAfterMins?: string;
+  canaryAnalysisIntervalMins: string;
+  canaryConfigId: string;
+  scopes: IKayentaStageCanaryConfigScope[];
+  combinedCanaryResultStrategy: string;
+  lifetimeHours?: string;
+  lifetimeDuration?: string; // String to be converted to Java.time.Duration in Orca (https://github.com/spinnaker/orca/blob/master/orca-kayenta/src/main/kotlin/com/netflix/spinnaker/orca/kayenta/model/KayentaCanaryContext.kt#L32)
+  lookbackMins?: string;
+  metricsAccountName: string;
+  scoreThresholds: {
+    pass: string;
+    marginal: string;
+  };
+  siteLocal?: { notificationEmail?: string[] | string };
+  storageAccountName: string;
+}
+
+export interface IKayentaStageCanaryConfigScope {
+  scopeName: string;
+  controlScope?: string;
+  controlLocation?: string;
+  experimentScope?: string;
+  experimentLocation?: string;
+  startTimeIso?: string;
+  endTimeIso?: string;
+  step?: number;
+  extendedScopeParams: { [key: string]: string };
+}
+
+export interface IKayentaStageDeployments {
+  baseline: {
+    cloudProvider: string;
+    application: string;
+    account: string;
+    cluster: string;
+  };
+  serverGroupPairs: IKayentaServerGroupPair[];
+  delayBeforeCleanup: string; // String to be converted to Java.time.Duration in Orca (https://github.com/spinnaker/orca/blob/master/orca-kayenta/src/main/kotlin/com/netflix/spinnaker/orca/kayenta/model/Deployments.kt#L33)
+}
+
+export interface IKayentaServerGroupPair {
+  control: any;
+  experiment: any;
+}
+
+export enum KayentaAnalysisType {
+  RealTimeAutomatic = 'realTimeAutomatic',
+  RealTime = 'realTime',
+  Retrospective = 'retrospective',
+}

package/src/kayenta/domain/IMetricSetPair.ts

@@ -0,0 +1,17 @@
+export interface IMetricSetPair {
+  name: string;
+  id: string;
+  tags: { [key: string]: string };
+  attributes: {
+    control: { [key: string]: string };
+    experiment: { [key: string]: string };
+  };
+  values: { [key: string]: number[] };
+  scopes: { [key: string]: IMetricSetScope };
+}
+
+export interface IMetricSetScope {
+  startTimeIso: string;
+  startTimeMillis: number;
+  stepMillis: number;
+}

package/src/kayenta/domain/IMetricsServiceMetadata.ts

@@ -0,0 +1,2 @@
+// Marker for metric descriptor metadata.
+export interface IMetricsServiceMetadata {}

package/src/kayenta/domain/ISetupCanaryStage.ts

@@ -0,0 +1,11 @@
+import { IExecutionStage } from '@spinnaker/core';
+import { ICanaryConfig } from './ICanaryConfig';
+
+export interface ISetupCanaryStage extends IExecutionStage {
+  context: {
+    canaryConfigId: string;
+  };
+  outputs: {
+    canaryConfig: ICanaryConfig;
+  };
+}

package/src/kayenta/domain/MetricClassificationLabel.ts

@@ -0,0 +1,8 @@
+export enum MetricClassificationLabel {
+  Pass = 'Pass',
+  High = 'High',
+  Low = 'Low',
+  Nodata = 'Nodata',
+  NodataFailMetric = 'NodataFailMetric',
+  Error = 'Error',
+}

package/src/kayenta/domain/ScoreClassificationLabel.ts

@@ -0,0 +1,7 @@
+export enum ScoreClassificationLabel {
+  Pass = 'Pass',
+  Marginal = 'Marginal',
+  Fail = 'Fail',
+  Nodata = 'Nodata',
+  Error = 'Error',
+}

package/src/kayenta/domain/index.ts

@@ -0,0 +1,15 @@
+export * from './ICanaryConfig';
+export * from './ICanaryScoreThresholds';
+export * from './ICanaryConfigSummary';
+export * from './ICanaryJudgeResult';
+export * from './ICanaryJudgeResultSummary';
+export * from './IJudge';
+export * from './IKayentaAccount';
+export * from './IMetricSetPair';
+export * from './ISetupCanaryStage';
+export * from './ICanaryExecutionStatusResult';
+export * from './IMetricsServiceMetadata';
+export * from './ICanaryConfigUpdateResponse';
+export * from './IKayentaStageConfig';
+export * from './MetricClassificationLabel';
+export * from './ScoreClassificationLabel';

package/src/kayenta/edit/changeMetricGroupModal.tsx

@@ -0,0 +1,107 @@
+import * as Creators from 'kayenta/actions/creators';
+import { CanarySettings } from 'kayenta/canary.settings';
+import { ICanaryMetricConfig } from 'kayenta/domain/ICanaryConfig';
+import { DISABLE_EDIT_CONFIG, DisableableSelect } from 'kayenta/layout/disableable';
+import Styleguide from 'kayenta/layout/styleguide';
+import { ICanaryState } from 'kayenta/reducers';
+import * as React from 'react';
+import { Modal } from 'react-bootstrap';
+import { connect } from 'react-redux';
+import { Action } from 'redux';
+
+import { noop } from '@spinnaker/core';
+
+interface IChangeMetricGroupModalOwnProps {
+  metric: ICanaryMetricConfig;
+}
+
+interface IChangeMetricGroupModalStateProps {
+  groups: string[];
+  toGroup: string;
+}
+
+interface IChangeMetricGroupModalDispatchProps {
+  select: (event: any) => void;
+  clear: () => void;
+  confirm: () => void;
+}
+
+function ChangeMetricGroupModal({
+  groups,
+  toGroup,
+  confirm,
+  clear,
+  select,
+}: IChangeMetricGroupModalStateProps & IChangeMetricGroupModalDispatchProps) {
+  return (
+    <Modal show={true} onHide={noop}>
+      <Styleguide>
+        <Modal.Header>
+          <Modal.Title>Change Metric Group</Modal.Title>
+        </Modal.Header>
+        <Modal.Body>
+          <DisableableSelect
+            value={toGroup || ''}
+            onChange={select}
+            className="form-control input-sm"
+            disabled={CanarySettings.disableConfigEdit}
+            disabledStateKeys={[DISABLE_EDIT_CONFIG]}
+          >
+            <option value={''}>-- select group --</option>
+            {groups.map((g) => (
+              <option key={g} value={g}>
+                {g}
+              </option>
+            ))}
+          </DisableableSelect>
+        </Modal.Body>
+        <Modal.Footer>
+          <ul className="list-inline pull-right">
+            <li>
+              <button className="passive" onClick={clear}>
+                Cancel
+              </button>
+            </li>
+            <li>
+              <button className="primary" disabled={!toGroup} onClick={confirm}>
+                OK
+              </button>
+            </li>
+          </ul>
+        </Modal.Footer>
+      </Styleguide>
+    </Modal>
+  );
+}
+
+function mapStateToProps(
+  state: ICanaryState,
+  { metric }: IChangeMetricGroupModalOwnProps,
+): IChangeMetricGroupModalStateProps {
+  // If a metric belongs to more than one group, allow a move into one of those groups.
+  // e.g., a [system, requests] -> [requests] move should be allowed, but
+  // don't offer a [system] -> [system] move.
+  return {
+    groups: state.selectedConfig.group.list.filter((g) => metric.groups.length > 1 || !metric.groups.includes(g)),
+    toGroup: state.selectedConfig.changeMetricGroup.toGroup,
+  };
+}
+
+function mapDispatchToProps(
+  dispatch: (action: Action & any) => void,
+  { metric }: IChangeMetricGroupModalOwnProps,
+): IChangeMetricGroupModalDispatchProps {
+  return {
+    select: (event: any) => {
+      dispatch(Creators.changeMetricGroupSelect({ group: event.target.value || null }));
+    },
+    clear: () => {
+      dispatch(Creators.changeMetricGroupConfirm({ metricId: null }));
+    },
+    confirm: () => {
+      dispatch(Creators.changeMetricGroupConfirm({ metricId: metric.id }));
+    },
+  };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(ChangeMetricGroupModal);

package/src/kayenta/edit/configDetail.tsx

@@ -0,0 +1,31 @@
+import * as React from 'react';
+
+import ConfigDetailHeader from './configDetailHeader';
+import EditMetricModal from './editMetricModal';
+import GroupTabs from './groupTabs';
+import TitledSection from '../layout/titledSection';
+import MetricList from './metricList';
+import NameAndDescription from './nameAndDescription';
+import Scoring from './scoring';
+
+/*
+ * Top-level config detail layout
+ */
+export default function ConfigDetail() {
+  return (
+    <section className="config-detail">
+      <ConfigDetailHeader />
+      <TitledSection title="Name and Description">
+        <NameAndDescription />
+      </TitledSection>
+      <TitledSection title="Metrics">
+        <GroupTabs />
+        <MetricList />
+        <EditMetricModal />
+      </TitledSection>
+      <TitledSection title="Scoring">
+        <Scoring />
+      </TitledSection>
+    </section>
+  );
+}

package/src/kayenta/edit/configDetailActionButtons.tsx

@@ -0,0 +1,24 @@
+import * as React from 'react';
+
+import CopyConfigButton from './copyConfigButton';
+import OpenEditConfigJsonModalButton from './openConfigJsonModalButton';
+import OpenDeleteModalButton from './openDeleteModalButton';
+
+/*
+ * Layout for canary config action buttons.
+ */
+export default function ConfigDetailActionButtons() {
+  return (
+    <ul className="list-inline pull-right">
+      <li>
+        <OpenEditConfigJsonModalButton />
+      </li>
+      <li>
+        <CopyConfigButton />
+      </li>
+      <li>
+        <OpenDeleteModalButton />
+      </li>
+    </ul>
+  );
+}

package/src/kayenta/edit/configDetailHeader.tsx

@@ -0,0 +1,104 @@
+import { UISref } from '@uirouter/react';
+import { CanarySettings } from 'kayenta/canary.settings';
+import { ICanaryConfig } from 'kayenta/domain';
+import FormattedDate from 'kayenta/layout/formattedDate';
+import { ICanaryState } from 'kayenta/reducers';
+import { mapStateToConfig } from 'kayenta/service/canaryConfig.service';
+import * as React from 'react';
+import { connect } from 'react-redux';
+
+import ConfigDetailActionButtons from './configDetailActionButtons';
+
+interface IConfigDetailStateProps {
+  selectedConfig: ICanaryConfig;
+  editingDisabled: boolean;
+  disableConfigEdit: boolean;
+}
+
+const getOwnerAppLinks = (owners: string[]) => {
+  if (owners.length === 1) {
+    return (
+      <UISref to="." params={{ application: owners[0] }}>
+        <a>{owners[0]}</a>
+      </UISref>
+    );
+  } else {
+    // totally gross to read, but a somewhat-straightforward way of creating
+    // a 'one, two, or three' sentence from this array of app names with some JSX in between
+    const lastIndex = owners.length - 1;
+    return owners.map((owner, index) => (
+      <React.Fragment key={owner}>
+        {index === lastIndex ? 'or ' : ''}
+        <UISref to="." params={{ application: owner }}>
+          <a>{owner}</a>
+        </UISref>
+        {index < lastIndex && owners.length === 2 ? ' ' : ''}
+        {index < lastIndex && owners.length > 2 ? ', ' : ''}
+      </React.Fragment>
+    ));
+  }
+};
+
+const EditingDisabledWarning = ({ owners }: { owners: string[] }) => {
+  return (
+    <div className="horizontal middle well-compact alert alert-warning config-detail-edit-warning">
+      <i className="fa fa-exclamation-triangle sp-margin-m-right" />
+      <span>
+        <b>
+          Editing is disabled because this config is owned by{' '}
+          {owners.length > 1 ? `${owners.length} other applications` : 'another application'}.
+        </b>{' '}
+        To edit, view in {getOwnerAppLinks(owners)}
+      </span>
+    </div>
+  );
+};
+
+const ConfigEditingDisabledWarning = () => {
+  return (
+    <div className="horizontal middle well-compact alert alert-warning config-detail-edit-warning">
+      <i className="fa fa-exclamation-triangle sp-margin-m-right" />
+      <span>
+        <b>Canary config is locked and does not allow modification</b>
+      </span>
+    </div>
+  );
+};
+
+/*
+ * Config detail header layout.
+ */
+function ConfigDetailHeader({ selectedConfig, editingDisabled, disableConfigEdit }: IConfigDetailStateProps) {
+  return (
+    <div className="vertical">
+      <div className="horizontal config-detail-header">
+        <div className="flex-3">
+          <h1 className="heading-1 color-text-primary">{selectedConfig ? selectedConfig.name : ''}</h1>
+        </div>
+        <div className="flex-1">
+          <h5 className="heading-5">
+            <strong>Edited:</strong>{' '}
+            <FormattedDate dateIso={selectedConfig ? selectedConfig.updatedTimestampIso : ''} />
+          </h5>
+        </div>
+        <div className="flex-2">
+          <ConfigDetailActionButtons />
+        </div>
+      </div>
+      {selectedConfig && editingDisabled && !disableConfigEdit && (
+        <EditingDisabledWarning owners={selectedConfig.applications} />
+      )}
+      {selectedConfig && disableConfigEdit && <ConfigEditingDisabledWarning />}
+    </div>
+  );
+}
+
+function mapStateToProps(state: ICanaryState): IConfigDetailStateProps {
+  return {
+    selectedConfig: mapStateToConfig(state),
+    editingDisabled: state.app.disableConfigEdit,
+    disableConfigEdit: CanarySettings.disableConfigEdit,
+  };
+}
+
+export default connect(mapStateToProps)(ConfigDetailHeader);

package/src/kayenta/edit/configDetailLoadStates.tsx

@@ -0,0 +1,36 @@
+import LoadStatesBuilder from 'kayenta/components/loadStates';
+import * as React from 'react';
+import { connect } from 'react-redux';
+
+import ConfigDetail from './configDetail';
+import CenteredDetail from '../layout/centeredDetail';
+import { AsyncRequestState } from '../reducers/asyncRequest';
+import { ICanaryState } from '../reducers/index';
+
+interface IConfigLoadStatesProps {
+  configLoadState: AsyncRequestState;
+}
+
+/*
+ * Renders appropriate view given the configuration detail's load state.
+ */
+function ConfigDetailLoadStates({ configLoadState }: IConfigLoadStatesProps) {
+  const LoadStates = new LoadStatesBuilder()
+    .onFulfilled(<ConfigDetail />)
+    .onFailed(
+      <CenteredDetail>
+        <h3 className="heading-3">Could not load canary config.</h3>
+      </CenteredDetail>,
+    )
+    .build();
+
+  return <LoadStates state={configLoadState} />;
+}
+
+function mapStateToProps(state: ICanaryState): IConfigLoadStatesProps {
+  return {
+    configLoadState: state.selectedConfig.load.state,
+  };
+}
+
+export default connect(mapStateToProps)(ConfigDetailLoadStates);

package/src/kayenta/edit/configDetailLoader.tsx

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Action } from 'redux';
+import { Observable } from 'rxjs/Observable';
+import { Subscription } from 'rxjs/Subscription';
+
+import * as Creators from '../actions/creators';
+import ConfigDetailLoadStates from './configDetailLoadStates';
+
+interface IConfigLoaderStateParamsProps {
+  configNameStream: Observable<IConfigDetailStateParams>;
+}
+
+interface IConfigLoaderDispatchProps {
+  loadConfig: (stateParams: IConfigDetailStateParams) => void;
+}
+
+interface IConfigDetailStateParams {
+  id: string;
+  copy: boolean;
+  new: boolean;
+}
+
+/*
+ * Top-level .configDetail state component.
+ * Loads config details on changes to /canary/:configName path parameter, renders load states.
+ */
+class ConfigDetailLoader extends React.Component<IConfigLoaderDispatchProps & IConfigLoaderStateParamsProps> {
+  private subscription: Subscription;
+
+  constructor(props: IConfigLoaderDispatchProps & IConfigLoaderStateParamsProps) {
+    const { configNameStream, loadConfig } = props;
+    super(props);
+    this.subscription = configNameStream.subscribe(loadConfig);
+  }
+
+  public componentWillUnmount(): void {
+    this.subscription.unsubscribe();
+  }
+
+  public render() {
+    return <ConfigDetailLoadStates />;
+  }
+}
+
+function mapDispatchToProps(dispatch: (action: Action & any) => void): IConfigLoaderDispatchProps {
+  return {
+    loadConfig: (stateParams: IConfigDetailStateParams) => {
+      if (stateParams.copy) {
+        dispatch(Creators.copySelectedConfig());
+      } else if (stateParams.new) {
+        dispatch(Creators.createNewConfig());
+      } else if (stateParams.id) {
+        dispatch(Creators.loadConfigRequest({ id: stateParams.id }));
+      }
+    },
+  };
+}
+
+export default connect(null, mapDispatchToProps)(ConfigDetailLoader);

package/src/kayenta/edit/configJson.less

@@ -0,0 +1,42 @@
+.ace-editor {
+  div,
+  span {
+    font-family: Menlo, Monaco, Consolas, 'Courier New', monospace;
+  }
+
+  > div.ace_gutter {
+    z-index: 0;
+  }
+}
+
+.kayenta-config-json {
+  textarea {
+    height: 65vh;
+    overflow: scroll;
+    padding: 2px 6px;
+    line-height: 1.4rem;
+    font-family: monospace;
+    font-size: 1rem;
+  }
+
+  pre.diff {
+    height: 65vh;
+    box-shadow: none;
+    width: 100%;
+    padding: 0;
+    .match,
+    .add,
+    .remove {
+      font-family: monospace;
+      font-size: 1rem;
+    }
+  }
+
+  .modal-show-history {
+    .show-history {
+      .summary-nav {
+        right: 7px;
+      }
+    }
+  }
+}