@spinnaker/kayenta 0.0.0-2025.1-0

package/src/kayenta/components/canaryScore.component.less

@@ -0,0 +1,77 @@
+.score.score-label {
+  font-size: 110%;
+  padding: 3px 6px;
+  display: inline-block;
+  height: 20px;
+  line-height: 14px;
+  color: white;
+  &.inverse {
+    padding: 0;
+  }
+  &.label-failing {
+    background-color: var(--color-alert-light);
+    &.inverse {
+      color: var(--color-alert-light);
+    }
+  }
+  &.label-healthy {
+    background-color: var(--color-success);
+    &.inverse {
+      color: var(--color-success);
+    }
+  }
+  &.label-unhealthy {
+    background-color: var(--color-danger);
+    &.inverse {
+      color: var(--color-danger);
+    }
+  }
+  &.label-unknown {
+    background-color: var(--color-text-caption);
+    &.inverse {
+      color: var(--color-text-caption);
+    }
+  }
+  &.inverse {
+    background-color: transparent;
+    font-size: 100%;
+    padding: 0;
+  }
+  .score-classification {
+    font-size: 45%;
+    display: block;
+    margin-top: 15px;
+    font-weight: 400;
+    text-transform: uppercase;
+  }
+}
+
+.score-large.score {
+  height: 48px;
+}
+
+.score-large .score.score-label {
+  height: auto;
+  line-height: 48px;
+  padding: 0 10px;
+  font-size: 28px;
+  font-weight: bold;
+  margin: 0;
+  border-radius: 0;
+  display: inline-block;
+}
+
+.score.score-report {
+  align-items: center;
+  padding: 12px 12px 6px;
+  font-size: 28px;
+  font-weight: bold;
+  margin-bottom: 10px;
+  height: 100%;
+}
+
+.table-row {
+  .score.score-report {
+    display: inline-block;
+  }
+}

package/src/kayenta/components/canaryScore.component.ts

@@ -0,0 +1,12 @@
+import { module } from 'angular';
+import { react2angular } from 'react2angular';
+
+import { withErrorBoundary } from '@spinnaker/core';
+
+import { CanaryScore } from './canaryScore';
+
+export const CANARY_SCORE_COMPONENT = 'spinnaker.kayenta.score.component';
+module(CANARY_SCORE_COMPONENT, []).component(
+  'kayentaCanaryScore',
+  react2angular(withErrorBoundary(CanaryScore, 'kayentaCanaryScore'), ['score', 'health', 'result', 'inverse']),
+);

package/src/kayenta/components/canaryScore.tsx

@@ -0,0 +1,63 @@
+import classNames from 'classnames';
+import * as React from 'react';
+
+import { ScoreClassificationLabel } from '../domain/ScoreClassificationLabel';
+import { getHealthLabel } from '../service/canaryRun.service';
+
+import './canaryScore.component.less';
+
+export interface ICanaryScoreProps {
+  score: number | string;
+  health?: string;
+  result: string;
+  inverse: boolean;
+  className?: string;
+  classification?: ScoreClassificationLabel;
+}
+
+export interface ICanaryScoreState {
+  score: number | string;
+  healthLabel: string;
+}
+
+export class CanaryScore extends React.Component<ICanaryScoreProps, ICanaryScoreState> {
+  public static defaultProps: Partial<ICanaryScoreProps> = {
+    health: '',
+  };
+
+  constructor(props: ICanaryScoreProps) {
+    super(props);
+    this.state = this.getLabelState(props);
+  }
+
+  private getLabelState(props: ICanaryScoreProps): ICanaryScoreState {
+    const score = props.score === 0 || (props.score && props.score > 0) ? props.score : 'N/A';
+
+    return {
+      score,
+      healthLabel: getHealthLabel(props.health, props.result),
+    };
+  }
+
+  public componentWillReceiveProps(props: ICanaryScoreProps) {
+    this.setState(this.getLabelState(props));
+  }
+
+  public render() {
+    const className = [
+      this.props.inverse ? 'inverse' : '',
+      'score',
+      'score-label',
+      'label-default',
+      `label-${this.state.healthLabel}`,
+    ].join(' ');
+    return (
+      <span className={classNames(className, this.props.className)}>
+        {this.state.score}
+        {this.props.classification && (
+          <span className="score-classification">{this.props.classification.toString()}</span>
+        )}
+      </span>
+    );
+  }
+}

package/src/kayenta/components/canaryScores.component.ts

@@ -0,0 +1,20 @@
+import { module } from 'angular';
+import { react2angular } from 'react2angular';
+
+import { withErrorBoundary } from '@spinnaker/core';
+
+import { CanaryScores } from './canaryScores';
+
+export const CANARY_SCORES_CONFIG_COMPONENT = 'spinnaker.kayenta.canaryScores.component';
+module(CANARY_SCORES_CONFIG_COMPONENT, []).component(
+  'kayentaCanaryScores',
+  react2angular(withErrorBoundary(CanaryScores, 'kayentaCanaryScores'), [
+    'onChange',
+    'successfulHelpFieldId',
+    'successfulLabel',
+    'successfulScore',
+    'unhealthyHelpFieldId',
+    'unhealthyLabel',
+    'unhealthyScore',
+  ]),
+);

package/src/kayenta/components/canaryScores.less

@@ -0,0 +1,22 @@
+div.canary-score {
+  div.progress {
+    border-radius: 0;
+    box-shadow: none;
+    -webkit-box-shadow: none;
+    height: 10px;
+    margin: 20px 0 10px;
+  }
+  div.progress-bar {
+    box-shadow: none;
+    -webkit-box-shadow: none;
+  }
+  div.progress-bar-danger {
+    background-color: var(--color-danger);
+  }
+  div.progress-bar.progress-bar-warning {
+    background-color: var(--color-alto);
+  }
+  div.progress-bar.progress-bar-success {
+    background-color: var(--color-success-light);
+  }
+}

package/src/kayenta/components/canaryScores.tsx

@@ -0,0 +1,163 @@
+import classNames from 'classnames';
+import { isString } from 'lodash';
+import * as React from 'react';
+
+import { HelpField } from '@spinnaker/core';
+
+import './canaryScores.less';
+
+export interface IScoreConfig {
+  successfulScore: string;
+  unhealthyScore: string;
+}
+
+export interface ICanaryScoresProps {
+  onChange: (scoreConfig: IScoreConfig) => void;
+  successfulHelpFieldId?: string;
+  successfulLabel?: string;
+  successfulScore: string;
+  unhealthyHelpFieldId?: string;
+  unhealthyLabel?: string;
+  unhealthyScore: string;
+  disabled?: boolean;
+}
+
+export interface ICanaryScoresState {
+  successfulTouched: boolean;
+  unhealthyTouched: boolean;
+}
+
+export function CanaryScores(props: ICanaryScoresProps) {
+  const [successfulTouched, setSuccessfulTouched] = React.useState(!!props.successfulScore);
+  const [unhealthyTouched, setUnhealthyTouched] = React.useState(!!props.unhealthyScore);
+
+  const { successfulScore, unhealthyScore } = props;
+
+  const isExpression = (scoreValue: string): boolean => {
+    return isString(scoreValue) && scoreValue.includes('${');
+  };
+
+  const hasExpressions = isExpression(unhealthyScore) || isExpression(successfulScore);
+
+  let successful: number;
+  let unhealthy: number;
+  if (!hasExpressions) {
+    successful = Number(successfulScore);
+    unhealthy = Number(unhealthyScore);
+  }
+
+  const handleSuccessfulChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
+    props.onChange({
+      successfulScore: event.target.value,
+      unhealthyScore,
+    });
+  };
+
+  const handleUnhealthyChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
+    props.onChange({
+      successfulScore,
+      unhealthyScore: event.target.value,
+    });
+  };
+
+  const errors = {
+    successful: '',
+    unhealthy: '',
+  };
+
+  if (successfulTouched) {
+    if (successful <= 0) {
+      errors.successful = 'Must be positive';
+    }
+    if (successful >= 100) {
+      errors.successful = 'Must be less than 100';
+    }
+  }
+
+  if (unhealthyTouched) {
+    if (unhealthy <= 0) {
+      errors.unhealthy = 'Must be positive';
+    }
+    if (unhealthy >= 100) {
+      errors.unhealthy = 'Must be less than 100';
+    }
+  }
+
+  if (successfulTouched && unhealthyTouched) {
+    if (successful <= unhealthy) {
+      errors.successful = `Must be greater than ${props.unhealthyLabel}`;
+    }
+  }
+
+  const invalid = !(successful && unhealthy);
+  return (
+    <div>
+      {hasExpressions && (
+        <div className="form-group">
+          <div className="col-md-2 col-md-offset-1 sm-label-right">Canary Scores</div>
+          <div className="col-md-9 form-control-static">Expressions are currently being used for canary scores.</div>
+        </div>
+      )}
+      {!hasExpressions && (
+        <div className="canary-score">
+          <div className="form-group">
+            <div className="col-md-2 col-md-offset-1 sm-label-right">
+              {props.unhealthyLabel || 'Unhealthy Score '}
+              <HelpField id={props.unhealthyHelpFieldId || 'pipeline.config.canary.unhealthyScore'} />
+            </div>
+            <div className="col-md-2">
+              <input
+                type="number"
+                required={true}
+                disabled={props.disabled}
+                onBlur={() => setUnhealthyTouched(true)}
+                value={Number.isNaN(unhealthy) ? '' : unhealthy}
+                onChange={handleUnhealthyChange}
+                className={classNames('form-control', 'input-sm', {
+                  'ng-invalid': !!errors.unhealthy,
+                  'ng-invalid-validate-min': !!errors.unhealthy,
+                })}
+              />
+              {errors.unhealthy && <div className="error-message">{errors.unhealthy}</div>}
+            </div>
+            <div className="col-md-2 col-md-offset-1 sm-label-right">
+              {props.successfulLabel || 'Successful Score '}
+              <HelpField id={props.successfulHelpFieldId || 'pipeline.config.canary.successfulScore'} />
+            </div>
+            <div className="col-md-2">
+              <input
+                type="number"
+                required={true}
+                disabled={props.disabled}
+                onBlur={() => setSuccessfulTouched(true)}
+                value={Number.isNaN(successful) ? '' : successful}
+                onChange={handleSuccessfulChange}
+                className={classNames('form-control', 'input-sm', {
+                  'ng-invalid': !!errors.successful,
+                  'ng-invalid-validate-max': !!errors.successful,
+                })}
+              />
+              {errors.successful && <div className="error-message">{errors.successful}</div>}
+            </div>
+          </div>
+          <div className="row">
+            <div className="col-md-offset-1 col-md-10">
+              <div className="progress">
+                <div className="progress-bar progress-bar-danger" style={{ width: `${invalid ? 0 : unhealthy}%` }} />
+                <div
+                  className="progress-bar progress-bar-warning"
+                  style={{ width: `${invalid ? 0 : 100 - (unhealthy + (100 - successful))}%` }}
+                />
+                <div
+                  className="progress-bar progress-bar-success"
+                  style={{ width: `${invalid ? 0 : 100 - successful}%` }}
+                />
+                <div className="progress-bar progress-bar-warning" style={{ width: `${invalid ? 100 : 0}%` }} />
+              </div>
+            </div>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}

package/src/kayenta/components/loadStates.tsx

@@ -0,0 +1,52 @@
+import { AsyncRequestState } from 'kayenta/reducers/asyncRequest';
+import * as React from 'react';
+
+import { Spinner } from '@spinnaker/core';
+
+export interface ILoadStatesProps {
+  state: AsyncRequestState;
+}
+
+/*
+ * Builder for rendering load states. Defaults to standard spinner during
+ * `Requesting` state.
+ * */
+export default class LoadStatesBuilder {
+  private requesting: JSX.Element;
+  private fulfilled: JSX.Element;
+  private failed: JSX.Element;
+
+  public onRequesting(requesting: JSX.Element): LoadStatesBuilder {
+    this.requesting = requesting;
+    return this;
+  }
+
+  public onFulfilled(fulfilled: JSX.Element): LoadStatesBuilder {
+    this.fulfilled = fulfilled;
+    return this;
+  }
+
+  public onFailed(failed: JSX.Element): LoadStatesBuilder {
+    this.failed = failed;
+    return this;
+  }
+
+  public build(): React.SFC<ILoadStatesProps> {
+    return ({ state }: ILoadStatesProps) => {
+      switch (state) {
+        case AsyncRequestState.Requesting:
+          return (
+            this.requesting || (
+              <div className="horizontal center middle spinner-container">
+                <Spinner />
+              </div>
+            )
+          );
+        case AsyncRequestState.Fulfilled:
+          return this.fulfilled;
+        case AsyncRequestState.Failed:
+          return this.failed;
+      }
+    };
+  }
+}

package/src/kayenta/domain/ICanaryConfig.ts

@@ -0,0 +1,57 @@
+export interface ICanaryConfig {
+  applications: string[];
+  id?: string;
+  createdTimestamp?: number;
+  updatedTimestamp?: number;
+  createdTimestampIso?: string;
+  updatedTimestampIso?: string;
+  isNew?: boolean;
+  name: string;
+  description: string;
+  configVersion: string;
+  metrics: ICanaryMetricConfig[];
+  templates: { [key: string]: string };
+  classifier: ICanaryClassifierConfig;
+  judge: ICanaryJudgeConfig;
+}
+
+export interface ICanaryMetricConfig<T extends ICanaryMetricSetQueryConfig = any> {
+  id: string;
+  name: string;
+  query: T;
+  groups: string[];
+  analysisConfigurations: {
+    [key: string]: any;
+    effectSize?: ICanaryMetricEffectSizeConfig;
+  };
+  scopeName: string;
+  isNew?: boolean;
+}
+
+export interface ICanaryMetricSetQueryConfig {
+  type: string;
+  serviceType: string;
+  customInlineTemplate?: string;
+  customFilterTemplate?: string;
+}
+
+export interface IGroupWeights {
+  [group: string]: number;
+}
+
+export interface ICanaryClassifierConfig {
+  groupWeights: IGroupWeights;
+}
+
+export interface ICanaryMetricEffectSizeConfig {
+  allowedIncrease?: number;
+  allowedDecrease?: number;
+  criticalIncrease?: number;
+  criticalDecrease?: number;
+  measure?: string;
+}
+
+export interface ICanaryJudgeConfig {
+  name: string;
+  judgeConfigurations: { [key: string]: any };
+}

package/src/kayenta/domain/ICanaryConfigSummary.ts

@@ -0,0 +1,7 @@
+export interface ICanaryConfigSummary {
+  updatedTimestampIso: string;
+  name: string;
+  id: string;
+  updatedTimestamp: number;
+  applications: string[];
+}

package/src/kayenta/domain/ICanaryConfigUpdateResponse.ts

@@ -0,0 +1,3 @@
+export interface ICanaryConfigUpdateResponse {
+  canaryConfigId: string;
+}

package/src/kayenta/domain/ICanaryExecutionStatusResult.ts

@@ -0,0 +1,72 @@
+import { ICanaryConfig } from './ICanaryConfig';
+import { ICanaryJudgeResult } from './ICanaryJudgeResult';
+import { ICanaryScoreThresholds } from './ICanaryScoreThresholds';
+
+export const CANARY_EXECUTION_NO_PIPELINE_STATUS = 'no-parent-pipeline-execution';
+
+export interface ICanaryExecutionStatusResult {
+  id: string; // Added by Deck on load.
+  canaryConfigId: string;
+  complete: boolean;
+  status: string;
+  result: ICanaryResult;
+  exception?: ICanaryExecutionException;
+  stageStatus: { [key: string]: string };
+  startTimeIso: string;
+  endTimeIso: string;
+  application: string;
+  pipelineId: string;
+  parentPipelineExecutionId: string;
+  metricSetPairListId: string;
+  metricsAccountName: string;
+  config: ICanaryConfig;
+  canaryExecutionRequest: ICanaryExecutionRequest;
+  storageAccountName: string;
+}
+
+export interface ICanaryExecutionException {
+  exceptionType: string;
+  operation: string;
+  details: { [key: string]: any };
+  timestamp: string;
+}
+
+export interface ICanaryResult {
+  judgeResult: ICanaryJudgeResult;
+}
+
+export interface ICanaryExecutionRequest {
+  thresholds: ICanaryScoreThresholds;
+  scopes: {
+    [scopeName: string]: ICanaryScopePair;
+  };
+}
+
+export interface ICanaryExecutionRequestParams {
+  application?: string;
+  parentPipelineExecutionId?: string;
+  metricsAccountName?: string;
+  storageAccountName?: string;
+  configurationAccountName?: string;
+}
+
+export interface ICanaryExecutionResponse {
+  canaryExecutionId: string;
+}
+
+export type ICanaryScopesByName = ICanaryExecutionRequest['scopes'];
+
+export interface ICanaryScopePair {
+  controlScope: ICanaryScope;
+  experimentScope: ICanaryScope;
+}
+
+export interface ICanaryScope {
+  scope: string;
+  location: string;
+  start: string;
+  end: string;
+  step: number;
+  extendedScopeParams?: { [param: string]: string };
+  resourceType?: string;
+}

package/src/kayenta/domain/ICanaryJudgeResult.ts

@@ -0,0 +1,51 @@
+import { MetricClassificationLabel } from './MetricClassificationLabel';
+import { ScoreClassificationLabel } from './ScoreClassificationLabel';
+
+export interface ICanaryJudgeResult {
+  judgeName: string;
+  results: ICanaryAnalysisResult[];
+  groupScores: ICanaryJudgeGroupScore[];
+  score: ICanaryJudgeScore;
+}
+
+export interface ICanaryAnalysisResult {
+  name: string;
+  id: string;
+  tags: { [key: string]: string };
+  classification: MetricClassificationLabel;
+  classificationReason: string;
+  groups: string[];
+  // TODO: is every judge going to implement the stats interface for
+  // experiment and control metadata (which would make the reporting UI much easier),
+  // or just the Netflix judge?
+  experimentMetadata: {
+    [key: string]: any;
+    stats: ICanaryAnalysisResultsStats;
+  };
+  controlMetadata: {
+    [key: string]: any;
+    stats: ICanaryAnalysisResultsStats;
+  };
+  resultMetadata?: { [key: string]: any };
+}
+
+export interface ICanaryAnalysisResultsStats {
+  count: number;
+  mean: number;
+  min: number;
+  max: number;
+  median: number;
+}
+
+export interface ICanaryJudgeGroupScore {
+  name: string;
+  score: number;
+  classification: string;
+  classificationReason: string;
+}
+
+export interface ICanaryJudgeScore {
+  score: number;
+  classification: ScoreClassificationLabel;
+  classificationReason: string;
+}

package/src/kayenta/domain/ICanaryJudgeResultSummary.ts

@@ -0,0 +1,5 @@
+export interface ICanaryJudgeResultSummary {
+  updatedTimestampIso: string;
+  name: string;
+  updatedTimestamp: number;
+}

package/src/kayenta/domain/ICanaryScoreThresholds.ts

@@ -0,0 +1,4 @@
+export interface ICanaryScoreThresholds {
+  pass: number;
+  marginal: number;
+}

package/src/kayenta/domain/IJudge.ts

@@ -0,0 +1,5 @@
+export interface IJudge {
+  // Easy to imagine that this could be extended soon, e.g., with a description or other metadata.
+  name: string;
+  visible: boolean;
+}

package/src/kayenta/domain/IKayentaAccount.ts

@@ -0,0 +1,14 @@
+export interface IKayentaAccount {
+  name: string;
+  type: string;
+  supportedTypes: KayentaAccountType[];
+  metricsStoreType?: string;
+  locations?: string[];
+  recommendedLocations?: string[];
+}
+
+export enum KayentaAccountType {
+  MetricsStore = 'METRICS_STORE',
+  ObjectStore = 'OBJECT_STORE',
+  ConfigurationStore = 'CONFIGURATION_STORE',
+}