fix(anomaly thresholds): Only call endpoint if anomaly detection (#104557)

Author: shayna-ch

static/app/views/detectors/components/details/metric/chart.tsx

@@ -199,6 +199,7 @@ export function useMetricDetectorChart({
 
   const {anomalyThresholdSeries} = useMetricDetectorAnomalyThresholds({
     detectorId: detector.id,
+    detectionType,
     startTimestamp: metricTimestamps.start,
     endTimestamp: metricTimestamps.end,
     series,

static/app/views/detectors/components/forms/metric/metricDetectorChart.tsx

@@ -241,6 +241,7 @@ export function MetricDetectorChart({
   const shouldFetchThresholds = Boolean(detectorId && isAnomalyDetection);
   const {anomalyThresholdSeries} = useMetricDetectorAnomalyThresholds({
     detectorId: detectorId ?? '',
+    detectionType,
     startTimestamp: metricTimestamps.start,
     endTimestamp: metricTimestamps.end,
     series: shouldFetchThresholds ? series : [],

static/app/views/detectors/hooks/useMetricDetectorAnomalyThresholds.spec.tsx

@@ -0,0 +1,119 @@
+import {OrganizationFixture} from 'sentry-fixture/organization';
+
+import {renderHookWithProviders, waitFor} from 'sentry-test/reactTestingLibrary';
+
+import {useMetricDetectorAnomalyThresholds} from 'sentry/views/detectors/hooks/useMetricDetectorAnomalyThresholds';
+
+describe('useMetricDetectorAnomalyThresholds', () => {
+  beforeEach(() => {
+    MockApiClient.clearMockResponses();
+  });
+
+  it('does not fetch data when detectionType is not dynamic', () => {
+    const organization = OrganizationFixture({
+      features: ['anomaly-detection-threshold-data'],
+    });
+
+    const anomalyDataRequest = MockApiClient.addMockResponse({
+      url: `/organizations/${organization.slug}/detectors/123/anomaly-data/`,
+      body: {data: []},
+    });
+
+    const series = [
+      {
+        seriesName: 'count()',
+        data: [{name: 1609459200000, value: 100}],
+      },
+    ];
+
+    renderHookWithProviders(
+      () =>
+        useMetricDetectorAnomalyThresholds({
+          detectorId: '123',
+          detectionType: 'static',
+          startTimestamp: 1609459200,
+          endTimestamp: 1609545600,
+          series,
+        }),
+      {organization}
+    );
+
+    expect(anomalyDataRequest).not.toHaveBeenCalled();
+  });
+
+  it('fetches data when detectionType is dynamic', async () => {
+    const organization = OrganizationFixture({
+      features: ['anomaly-detection-threshold-data'],
+    });
+
+    const mockData = [
+      {
+        external_alert_id: 24,
+        timestamp: 1609459200,
+        value: 100,
+        yhat_lower: 80,
+        yhat_upper: 120,
+      },
+    ];
+
+    const anomalyDataRequest = MockApiClient.addMockResponse({
+      url: `/organizations/${organization.slug}/detectors/123/anomaly-data/`,
+      body: {data: mockData},
+    });
+
+    const series = [
+      {
+        seriesName: 'count()',
+        data: [{name: 1609459200000, value: 100}],
+      },
+    ];
+
+    renderHookWithProviders(
+      () =>
+        useMetricDetectorAnomalyThresholds({
+          detectorId: '123',
+          detectionType: 'dynamic',
+          startTimestamp: 1609459200,
+          endTimestamp: 1609545600,
+          series,
+        }),
+      {organization}
+    );
+
+    await waitFor(() => {
+      expect(anomalyDataRequest).toHaveBeenCalled();
+    });
+  });
+
+  it('does not fetch data when detectionType is undefined', () => {
+    const organization = OrganizationFixture({
+      features: ['anomaly-detection-threshold-data'],
+    });
+
+    const anomalyDataRequest = MockApiClient.addMockResponse({
+      url: `/organizations/${organization.slug}/detectors/123/anomaly-data/`,
+      body: {data: []},
+    });
+
+    const series = [
+      {
+        seriesName: 'count()',
+        data: [{name: 1609459200000, value: 100}],
+      },
+    ];
+
+    renderHookWithProviders(
+      () =>
+        useMetricDetectorAnomalyThresholds({
+          detectorId: '123',
+          detectionType: undefined,
+          startTimestamp: 1609459200,
+          endTimestamp: 1609545600,
+          series,
+        }),
+      {organization}
+    );
+
+    expect(anomalyDataRequest).not.toHaveBeenCalled();
+  });
+});

static/app/views/detectors/hooks/useMetricDetectorAnomalyThresholds.tsx

@@ -22,6 +22,7 @@ interface AnomalyThresholdDataResponse {
 
 interface UseMetricDetectorAnomalyThresholdsProps {
   detectorId: string;
+  detectionType?: string;
   endTimestamp?: number;
   series?: Series[];
   startTimestamp?: number;
@@ -38,6 +39,7 @@ interface UseMetricDetectorAnomalyThresholdsResult {
  */
 export function useMetricDetectorAnomalyThresholds({
   detectorId,
+  detectionType,
   startTimestamp,
   endTimestamp,
   series = [],
@@ -48,6 +50,7 @@ export function useMetricDetectorAnomalyThresholds({
   const hasAnomalyDataFlag = organization.features.includes(
     'anomaly-detection-threshold-data'
   );
+  const isAnomalyDetection = detectionType === 'dynamic';
 
   const {
     data: anomalyData,
@@ -66,7 +69,9 @@ export function useMetricDetectorAnomalyThresholds({
     {
       staleTime: 0,
       enabled:
-        hasAnomalyDataFlag && Boolean(detectorId && startTimestamp && endTimestamp),
+        hasAnomalyDataFlag &&
+        isAnomalyDetection &&
+        Boolean(detectorId && startTimestamp && endTimestamp),
     }
   );