@spinnaker/kayenta 0.0.0-2025.1-0

package/src/kayenta/metricStore/atlas/atlasMetricConfigurer.tsx

@@ -0,0 +1,130 @@
+import autoBindMethods from 'class-autobind-decorator';
+import { get } from 'lodash';
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import { connect } from 'react-redux';
+import { Action } from 'redux';
+
+import { UPDATE_ATLAS_QUERY } from '../../actions/index';
+import { CanarySettings } from '../../canary.settings';
+import { ICanaryMetricConfig } from '../../domain/ICanaryConfig';
+import { ICanaryState } from '../../reducers/index';
+
+interface IAtlasMetricConfigurerStateProps {
+  editingMetric: ICanaryMetricConfig;
+}
+
+interface IAtlasMetricConfigurerDispatchProps {
+  updateQuery: (event: any) => void;
+}
+
+type IAtlasMetricConfigurerProps = IAtlasMetricConfigurerStateProps & IAtlasMetricConfigurerDispatchProps;
+
+interface IAtlasMetricConfigurerState {
+  webComponent: Element;
+}
+
+export interface IAtlasQuerySelector {
+  class: string;
+  backends: string;
+  query: string;
+  hide: string;
+  ref: (webComponent: Element) => void;
+}
+
+interface IChangeQueryStringEvent extends CustomEvent {
+  detail: string;
+}
+
+if (CanarySettings.atlasWebComponentsUrl) {
+  // make React available to components
+  const global = window as any;
+  global['React'] = React;
+  global['ReactDOM'] = ReactDOM;
+
+  if (CanarySettings.atlasWebComponentsPolyfillUrl) {
+    const polyfillScript = document.createElement('script');
+    polyfillScript.src = CanarySettings.atlasWebComponentsPolyfillUrl;
+    document.head.appendChild(polyfillScript);
+  }
+  // download components; they will register when the script executes
+  const componentScript = document.createElement('script');
+  componentScript.src = CanarySettings.atlasWebComponentsUrl;
+  document.head.appendChild(componentScript);
+}
+
+// Add <atlas-query-selector> to the elements allowed in TSX, using the IAtlasQuerySelector interface.
+declare global {
+  // eslint-disable-next-line @typescript-eslint/no-namespace
+  namespace JSX {
+    interface IntrinsicElements {
+      'atlas-query-selector': IAtlasQuerySelector;
+    }
+  }
+}
+
+const queryFinder = (metric: ICanaryMetricConfig) => get(metric, 'query.q', '');
+
+/*
+ * Component for configuring an Atlas metric via the <atlas-query-selector> web component.
+ */
+@autoBindMethods
+class AtlasMetricConfigurer extends React.Component<IAtlasMetricConfigurerProps, IAtlasMetricConfigurerState> {
+  constructor(props: IAtlasMetricConfigurerProps) {
+    super(props);
+    this.state = { webComponent: null };
+  }
+
+  private bindComponent(ref: Element) {
+    this.setState({ webComponent: ref });
+    if (ref) {
+      ref.addEventListener('change.queryString', (event: IChangeQueryStringEvent) => {
+        this.props.updateQuery(event.detail);
+      });
+      // This gets passed down to the inner React rendering beyond the web-component wrapper. Simply setting it in
+      // the render() method, it will not get passed to the web-component. Given that it doesn't change, why is it
+      // necessary? It seems to have something to do with the way React renders the component to the DOM; it triggers
+      // the web-component layer early, before the query is ready, and <atlas-query-selector> ignores all changes to
+      // the query after it's rendered. Adding a key after it's all set causes the inner React to re-render the
+      // component with the correct query.
+      ref.setAttribute('key', 'react');
+    }
+  }
+
+  public render() {
+    const editingMetric = this.props.editingMetric;
+    const query = queryFinder(editingMetric);
+    // TODO: select correct Atlas backend for app
+    const atlasBackend = 'https://atlas-global.prod.netflix.net';
+    return (
+      <atlas-query-selector
+        class="spinnaker-theme"
+        backends={atlasBackend}
+        hide="add_scope,comparison,timeOffset,lineStyle,des,trend,lineWidth,axis,color,alpha,multi"
+        query={query}
+        ref={this.bindComponent}
+      />
+    );
+  }
+}
+
+function mapStateToProps(state: ICanaryState): IAtlasMetricConfigurerStateProps {
+  return {
+    editingMetric: state.selectedConfig.editingMetric,
+  };
+}
+
+function mapDispatchToProps(dispatch: (action: Action & any) => void): IAtlasMetricConfigurerDispatchProps {
+  return {
+    updateQuery: (query: string): void => {
+      dispatch({
+        type: UPDATE_ATLAS_QUERY,
+        query,
+      });
+    },
+  };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(AtlasMetricConfigurer);
+
+export { queryFinder };

package/src/kayenta/metricStore/atlas/index.ts

@@ -0,0 +1,8 @@
+import AtlasMetricConfigurer, { queryFinder } from './atlasMetricConfigurer';
+import metricStoreConfigStore from '../metricStoreConfig.service';
+
+metricStoreConfigStore.register({
+  name: 'atlas',
+  metricConfigurer: AtlasMetricConfigurer,
+  queryFinder,
+});

package/src/kayenta/metricStore/datadog/domain/IDatadogMetricDescriptor.ts

@@ -0,0 +1,5 @@
+import { IMetricsServiceMetadata } from 'kayenta/domain/IMetricsServiceMetadata';
+
+export interface IDatadogMetricDescriptor extends IMetricsServiceMetadata {
+  name: string;
+}

package/src/kayenta/metricStore/datadog/index.ts

@@ -0,0 +1,9 @@
+import DatadogMetricConfigurer, { queryFinder } from './metricConfigurer';
+import metricStoreConfigStore from '../metricStoreConfig.service';
+
+metricStoreConfigStore.register({
+  name: 'datadog',
+  metricConfigurer: DatadogMetricConfigurer,
+  queryFinder,
+  useTemplates: true,
+});

package/src/kayenta/metricStore/datadog/metricConfigurer.tsx

@@ -0,0 +1,90 @@
+import * as Creators from 'kayenta/actions/creators';
+import { ICanaryMetricConfig } from 'kayenta/domain';
+import FormRow from 'kayenta/layout/formRow';
+import RadioChoice from 'kayenta/layout/radioChoice';
+import { ICanaryState } from 'kayenta/reducers';
+import { get } from 'lodash';
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Option } from 'react-select';
+import { Action } from 'redux';
+
+import DatadogMetricTypeSelector from './metricTypeSelector';
+
+interface IDatadogMetricConfigurerStateProps {
+  editingMetric: ICanaryMetricConfig;
+}
+
+interface IDatadogMetricConfigurerDispatchProps {
+  changeMetricName: (agg: string, name: string) => void;
+}
+
+type DatadogMetricConfigurerProps = IDatadogMetricConfigurerStateProps & IDatadogMetricConfigurerDispatchProps;
+
+export const queryFinder = (metric: ICanaryMetricConfig) => get(metric, 'query.metricName', ':');
+
+export const nameFinder = (metric: ICanaryMetricConfig) => queryFinder(metric).split(':', 2)[1];
+export const aggFinder = (metric: ICanaryMetricConfig) => queryFinder(metric).split(':', 2)[0];
+
+/*
+ * Component for configuring a Datadog metric.
+ * */
+function DatadogMetricConfigurer({ changeMetricName, editingMetric }: DatadogMetricConfigurerProps) {
+  return (
+    <>
+      <FormRow label="Datadog Metric" inputOnly={true}>
+        <DatadogMetricTypeSelector
+          value={nameFinder(editingMetric)}
+          onChange={(option: Option<string>) => changeMetricName(aggFinder(editingMetric), get(option, 'value'))}
+        />
+      </FormRow>
+      <FormRow label="Metric Aggregation">
+        <RadioChoice
+          value="avg"
+          label="Average"
+          name="aggregator"
+          current={aggFinder(editingMetric)}
+          action={() => changeMetricName('avg', nameFinder(editingMetric))}
+        />
+        <RadioChoice
+          value="sum"
+          label="Sum"
+          name="aggregator"
+          current={aggFinder(editingMetric)}
+          action={() => changeMetricName('sum', nameFinder(editingMetric))}
+        />
+        <RadioChoice
+          value="max"
+          label="Max"
+          name="aggregator"
+          current={aggFinder(editingMetric)}
+          action={() => changeMetricName('max', nameFinder(editingMetric))}
+        />
+        <RadioChoice
+          value="min"
+          label="Min"
+          name="aggregator"
+          current={aggFinder(editingMetric)}
+          action={() => changeMetricName('min', nameFinder(editingMetric))}
+        />
+      </FormRow>
+    </>
+  );
+}
+
+function mapStateToProps(state: ICanaryState): IDatadogMetricConfigurerStateProps {
+  return {
+    editingMetric: state.selectedConfig.editingMetric,
+  };
+}
+
+function mapDispatchToProps(dispatch: (action: Action & any) => void): IDatadogMetricConfigurerDispatchProps {
+  return {
+    changeMetricName: (agg: string, name: string): void => {
+      const metricName = agg + ':' + name;
+      dispatch(Creators.updateDatadogMetricName({ metricName }));
+    },
+  };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(DatadogMetricConfigurer);

package/src/kayenta/metricStore/datadog/metricTypeSelector.spec.tsx

@@ -0,0 +1,59 @@
+import { mountWithState, mountWithStore } from 'enzyme-redux';
+import * as Actions from 'kayenta/actions';
+import * as React from 'react';
+import { connect } from 'react-redux';
+import Select, { Option, ReactSelectProps } from 'react-select';
+import { createMockStore } from 'redux-test-utils';
+
+import { noop } from '@spinnaker/core';
+
+import { DatadogMetricTypeSelector, mapDispatchToProps, mapStateToProps } from './metricTypeSelector';
+
+describe('<DatadogMetricTypeSelector />', () => {
+  let Component: any;
+  let state: any;
+
+  beforeEach(() => {
+    state = {
+      data: {
+        metricsServiceMetadata: {
+          data: [
+            {
+              name: 'datadog.agent.running',
+            },
+            {
+              name: 'datadog.trace_agent.heartbeat',
+            },
+          ],
+        },
+      },
+    };
+
+    Component = connect(mapStateToProps, mapDispatchToProps)(DatadogMetricTypeSelector);
+  });
+
+  it('builds options from input descriptors', () => {
+    const component = mountWithState(<Component value="" onChange={noop} />, state);
+    const allProps: any = component.find(Select).first().props();
+
+    expect(allProps.options.map((o: Option) => o.value)).toEqual([
+      'datadog.agent.running',
+      'datadog.trace_agent.heartbeat',
+    ]);
+  });
+
+  it('queries for metric descriptors on input change', () => {
+    const store = createMockStore(state);
+    const component = mountWithStore(<Component value="" onChange={noop} />, store);
+
+    const allProps: ReactSelectProps = component.find(Select).props();
+    allProps.onInputChange('heartbeat');
+
+    expect(
+      store.isActionDispatched({
+        type: Actions.UPDATE_DATADOG_METRIC_DESCRIPTOR_FILTER,
+        payload: { filter: 'heartbeat' },
+      }),
+    ).toEqual(true);
+  });
+});

package/src/kayenta/metricStore/datadog/metricTypeSelector.tsx

@@ -0,0 +1,73 @@
+import * as Creators from 'kayenta/actions/creators';
+import { DISABLE_EDIT_CONFIG, DisableableReactSelect } from 'kayenta/layout/disableable';
+import { ICanaryState } from 'kayenta/reducers';
+import { AsyncRequestState } from 'kayenta/reducers/asyncRequest';
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Option } from 'react-select';
+import { Dispatch } from 'redux';
+
+import { IDatadogMetricDescriptor } from './domain/IDatadogMetricDescriptor';
+
+interface IDatadogMetricTypeSelectorDispatchProps {
+  load: (filter: string) => void;
+}
+
+interface IDatadogMetricTypeSelectorStateProps {
+  options: Option[];
+  loading: boolean;
+}
+
+interface IDatadogMetricTypeSelectorOwnProps {
+  value: string;
+  onChange: (option: Option) => void;
+}
+
+export const DatadogMetricTypeSelector = ({
+  loading,
+  load,
+  options,
+  value,
+  onChange,
+}: IDatadogMetricTypeSelectorDispatchProps &
+  IDatadogMetricTypeSelectorStateProps &
+  IDatadogMetricTypeSelectorOwnProps) => {
+  if (value && options.every((o) => o.value !== value)) {
+    options = options.concat({ label: value, value });
+  }
+
+  return (
+    <DisableableReactSelect
+      isLoading={loading}
+      options={options}
+      onChange={onChange}
+      value={value}
+      placeholder={'Enter at least three characters to search.'}
+      onInputChange={(input: string) => {
+        load(input);
+        return input;
+      }}
+      disabledStateKeys={[DISABLE_EDIT_CONFIG]}
+    />
+  );
+};
+
+export const mapStateToProps = (state: ICanaryState, ownProps: IDatadogMetricTypeSelectorOwnProps) => {
+  const descriptors = state.data.metricsServiceMetadata.data as IDatadogMetricDescriptor[];
+  const options: Option[] = descriptors.map((d) => ({ label: d.name, value: d.name }));
+  return {
+    options,
+    loading: state.data.metricsServiceMetadata.load === AsyncRequestState.Requesting,
+    ...ownProps,
+  };
+};
+
+export const mapDispatchToProps = (dispatch: Dispatch<ICanaryState>) => {
+  return {
+    load: (filter: string) => {
+      dispatch(Creators.updateDatadogMetricDescriptorFilter({ filter }));
+    },
+  };
+};
+
+export default connect(mapStateToProps, mapDispatchToProps)(DatadogMetricTypeSelector);

package/src/kayenta/metricStore/graphite/domain/IGraphiteMetricDescriptor.ts

@@ -0,0 +1,5 @@
+import { IMetricsServiceMetadata } from 'kayenta/domain';
+
+export interface IGraphiteMetricDescriptor extends IMetricsServiceMetadata {
+  name: string;
+}

package/src/kayenta/metricStore/graphite/index.ts

@@ -0,0 +1,8 @@
+import GraphiteMetricConfigurer, { queryFinder } from './metricConfigurer';
+import metricStoreConfigStore from '../metricStoreConfig.service';
+
+metricStoreConfigStore.register({
+  name: 'graphite',
+  metricConfigurer: GraphiteMetricConfigurer,
+  queryFinder,
+});

package/src/kayenta/metricStore/graphite/metricConfigurer.tsx

@@ -0,0 +1,54 @@
+import * as Creators from 'kayenta/actions/creators';
+import { ICanaryMetricConfig } from 'kayenta/domain';
+import FormRow from 'kayenta/layout/formRow';
+import { ICanaryState } from 'kayenta/reducers';
+import { get } from 'lodash';
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Action } from 'redux';
+
+import GraphiteMetricTypeSelector from './metricTypeSelector';
+
+interface IGraphiteMetricConfigurerDispatchProps {
+  changeMetricName: (name: string) => void;
+}
+
+interface IGraphiteMetricConfigurerStateProps {
+  editingMetric: ICanaryMetricConfig;
+}
+
+type GraphiteMetricConfigurerProps = IGraphiteMetricConfigurerStateProps & IGraphiteMetricConfigurerDispatchProps;
+
+export const queryFinder = (metric: ICanaryMetricConfig) => get(metric, 'query.metricName', '');
+
+/*
+ * Component for configuring a Graphite metric.
+ * */
+function GraphiteMetricConfigurer({ changeMetricName, editingMetric }: GraphiteMetricConfigurerProps) {
+  return (
+    <FormRow label="Graphite Metric" inputOnly={true}>
+      <GraphiteMetricTypeSelector
+        value={queryFinder(editingMetric)}
+        onChange={(option: string[]) => {
+          changeMetricName(option[0]);
+        }}
+      />
+    </FormRow>
+  );
+}
+
+function mapStateToProps(state: ICanaryState): IGraphiteMetricConfigurerStateProps {
+  return {
+    editingMetric: state.selectedConfig.editingMetric,
+  };
+}
+
+function mapDispatchToProps(dispatch: (action: Action & any) => void): IGraphiteMetricConfigurerDispatchProps {
+  return {
+    changeMetricName: (metricName: string): void => {
+      dispatch(Creators.updateGraphiteMetricName({ metricName }));
+    },
+  };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(GraphiteMetricConfigurer);

package/src/kayenta/metricStore/graphite/metricTypeSelector.tsx

@@ -0,0 +1,80 @@
+import * as Creators from 'kayenta/actions/creators';
+import { DISABLE_EDIT_CONFIG, DisableableReactTypeahead } from 'kayenta/layout/disableable';
+import { ICanaryState } from 'kayenta/reducers';
+import { AsyncRequestState } from 'kayenta/reducers/asyncRequest';
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Dispatch } from 'redux';
+
+import { IGraphiteMetricDescriptor } from './domain/IGraphiteMetricDescriptor';
+
+import './typeahead.less';
+
+interface IGraphiteMetricTypeSelectorDispatchProps {
+  load: (filter: string) => void;
+}
+
+interface IGraphiteMetricTypeSelectorStateProps {
+  options: string[];
+  loading: boolean;
+}
+
+interface IGraphiteMetricTypeSelectorOwnProps {
+  value: string;
+  onChange: (option: string[]) => void;
+}
+
+export const GraphiteMetricTypeSelector = ({
+  loading,
+  load,
+  options,
+  value,
+  onChange,
+}: IGraphiteMetricTypeSelectorDispatchProps &
+  IGraphiteMetricTypeSelectorStateProps &
+  IGraphiteMetricTypeSelectorOwnProps) => {
+  options = options.concat(value);
+
+  return (
+    <DisableableReactTypeahead
+      options={options}
+      isLoading={loading}
+      onChange={(option: string[]) => {
+        onChange(option);
+        load(option[0]);
+      }}
+      defaultInputValue={value}
+      renderMenuItemChildren={(option) => (
+        <a style={{ pointerEvents: 'all', textDecoration: 'none', color: '#000000' }}>{option}</a>
+      )}
+      placeholder={'Enter at least three characters to search.'}
+      onInputChange={(input) => {
+        onChange([input]);
+        load(input);
+        return input;
+      }}
+      disabledStateKeys={[DISABLE_EDIT_CONFIG]}
+    />
+  );
+};
+
+export const mapStateToProps = (state: ICanaryState, ownProps: IGraphiteMetricTypeSelectorOwnProps) => {
+  const descriptors = state.data.metricsServiceMetadata.data as IGraphiteMetricDescriptor[];
+  const options: string[] = descriptors.map((d) => d.name);
+
+  return {
+    options,
+    loading: state.data.metricsServiceMetadata.load === AsyncRequestState.Requesting,
+    ...ownProps,
+  };
+};
+
+export const mapDispatchToProps = (dispatch: Dispatch<ICanaryState>) => {
+  return {
+    load: (filter: string) => {
+      dispatch(Creators.updateGraphiteMetricDescriptorFilter({ filter }));
+    },
+  };
+};
+
+export default connect(mapStateToProps, mapDispatchToProps)(GraphiteMetricTypeSelector);

package/src/kayenta/metricStore/graphite/typeahead.less

@@ -0,0 +1,3 @@
+li[id^='rbt-menu-item'] {
+  pointer-events: none;
+}

package/src/kayenta/metricStore/index.ts

@@ -0,0 +1,8 @@
+import './atlas';
+import './datadog';
+import './graphite';
+import './newrelic';
+import './prometheus';
+import './signalfx';
+import './stackdriver';
+export { default as metricStoreConfigStore } from './metricStoreConfig.service';

package/src/kayenta/metricStore/metricStoreConfig.service.ts

@@ -0,0 +1,12 @@
+import { ICanaryMetricConfig } from 'kayenta/domain';
+import { buildDelegateService } from 'kayenta/service/delegateFactory';
+import * as React from 'react';
+
+export interface IMetricStoreConfig {
+  name: string;
+  metricConfigurer: React.ComponentClass;
+  queryFinder: (metric: ICanaryMetricConfig) => string;
+  useTemplates?: boolean;
+}
+
+export default buildDelegateService<IMetricStoreConfig>();

package/src/kayenta/metricStore/newrelic/domain/INewRelicMetricDescriptor.ts

@@ -0,0 +1,5 @@
+import { IMetricsServiceMetadata } from 'kayenta/domain/IMetricsServiceMetadata';
+
+export interface INewRelicMetricDescriptor extends IMetricsServiceMetadata {
+  name: string;
+}

package/src/kayenta/metricStore/newrelic/index.ts

@@ -0,0 +1,8 @@
+import NewRelicMetricConfigurer, { queryFinder } from './metricConfigurer';
+import metricStoreConfigStore from '../metricStoreConfig.service';
+
+metricStoreConfigStore.register({
+  name: 'newrelic',
+  metricConfigurer: NewRelicMetricConfigurer,
+  queryFinder,
+});

package/src/kayenta/metricStore/newrelic/metricConfigurer.tsx

@@ -0,0 +1,58 @@
+import * as Creators from 'kayenta/actions/creators';
+import { ICanaryMetricConfig } from 'kayenta/domain';
+import { DISABLE_EDIT_CONFIG, DisableableInput } from 'kayenta/layout/disableable';
+import FormRow from 'kayenta/layout/formRow';
+import { ICanaryState } from 'kayenta/reducers';
+import { get } from 'lodash';
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Action } from 'redux';
+
+interface INewRelicMetricConfigurerStateProps {
+  editingMetric: ICanaryMetricConfig;
+}
+
+interface INewRelicMetricConfigurerDispatchProps {
+  changeSelect: (event: any) => void;
+}
+
+type INewRelicMetricConfigurerProps = INewRelicMetricConfigurerStateProps & INewRelicMetricConfigurerDispatchProps;
+
+export const queryFinder = (metric: ICanaryMetricConfig) => get(metric, 'query.select', '');
+
+/*
+ * Component for configuring a New Relic metric
+ */
+function NewRelicMetricConfigurer({ changeSelect, editingMetric }: INewRelicMetricConfigurerProps) {
+  return (
+    <>
+      <FormRow label="NRQL Select" inputOnly={true}>
+        <DisableableInput
+          type="text"
+          value={queryFinder(editingMetric)}
+          onChange={changeSelect}
+          disabledStateKeys={[DISABLE_EDIT_CONFIG]}
+        />
+        <span className="body-small color-text-caption" style={{ marginTop: '5px' }}>
+          Enter the NRQL query only up to, but not including, the WHERE clause
+        </span>
+      </FormRow>
+    </>
+  );
+}
+
+function mapStateToProps(state: ICanaryState): INewRelicMetricConfigurerStateProps {
+  return {
+    editingMetric: state.selectedConfig.editingMetric,
+  };
+}
+
+function mapDispatchToProps(dispatch: (action: Action & any) => void): INewRelicMetricConfigurerDispatchProps {
+  return {
+    changeSelect: (event: any) => {
+      dispatch(Creators.updateNewRelicSelect({ select: event.target.value }));
+    },
+  };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(NewRelicMetricConfigurer);

package/src/kayenta/metricStore/prometheus/domain/IPrometheusCanaryMetricSetQueryConfig.ts

@@ -0,0 +1,14 @@
+import { ICanaryMetricSetQueryConfig } from 'kayenta/domain';
+
+export interface IPrometheusCanaryMetricSetQueryConfig extends ICanaryMetricSetQueryConfig {
+  resourceType: string;
+  metricName: string;
+  labelBindings: string[];
+  groupByFields: string[];
+  queryType: PrometheusQueryType;
+}
+
+export enum PrometheusQueryType {
+  PROMQL = 'PROMQL',
+  DEFAULT = 'DEFAULT',
+}

package/src/kayenta/metricStore/prometheus/domain/IPrometheusMetricDescriptor.ts

@@ -0,0 +1,5 @@
+import { IMetricsServiceMetadata } from 'kayenta/domain/IMetricsServiceMetadata';
+
+export interface IPrometheusMetricDescriptor extends IMetricsServiceMetadata {
+  name: string;
+}

package/src/kayenta/metricStore/prometheus/index.ts

@@ -0,0 +1,12 @@
+import { ICanaryMetricConfig } from 'kayenta/domain/ICanaryConfig';
+import { get } from 'lodash';
+
+import PrometheusMetricConfigurer from './metricConfigurer';
+import metricStoreConfigStore from '../metricStoreConfig.service';
+
+metricStoreConfigStore.register({
+  name: 'prometheus',
+  metricConfigurer: PrometheusMetricConfigurer,
+  queryFinder: (metric: ICanaryMetricConfig) => get(metric, 'query.metricName', ''),
+  useTemplates: true,
+});