fix: invalidate all detector lists

Author: TkDodo

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

@@ -4,7 +4,10 @@ import {OrganizationFixture} from 'sentry-fixture/organization';
 import type {Detector, UptimeDetector} from 'sentry/types/workflowEngine/detectors';
 import type {ApiResponse} from 'sentry/utils/api/apiFetch';
 import {parseQueryKey} from 'sentry/utils/api/apiQueryKey';
-import {detectorListApiOptions} from 'sentry/views/detectors/hooks';
+import {
+  detectorListApiOptions,
+  allDetectorListsQueryKey,
+} from 'sentry/views/detectors/hooks';
 
 const organization = OrganizationFixture();
 
@@ -102,4 +105,29 @@ describe('detectorListApiOptions', () => {
         .toEqualTypeOf<ApiResponse<UptimeDetector[]>>();
     });
   });
+
+  describe('allDetectorListsQueryKey', () => {
+    it('produces a prefix key that matches all detector list queries', () => {
+      const prefixKey = allDetectorListsQueryKey(organization);
+
+      // Should be a 2-element key (no options) so it prefix-matches everything
+      expect(prefixKey).toHaveLength(2);
+      expect(prefixKey).toEqual([
+        {infinite: false, version: 'v2'},
+        `/organizations/${organization.slug}/detectors/`,
+      ]);
+    });
+
+    it('prefix-matches queries with different filters', () => {
+      const prefixKey = allDetectorListsQueryKey(organization);
+      const uptimeKey = detectorListApiOptions(organization, {
+        type: 'uptime',
+      }).queryKey;
+      const defaultKey = detectorListApiOptions(organization).queryKey;
+
+      // The prefix (first 2 elements) should match both
+      expect(uptimeKey.slice(0, 2)).toEqual(prefixKey);
+      expect(defaultKey.slice(0, 2)).toEqual(prefixKey);
+    });
+  });
 });

static/app/views/detectors/hooks/index.ts

@@ -96,6 +96,16 @@ export function detectorListApiOptions<
   });
 }
 
+/**
+ * Returns a query key prefix that matches all detector list queries
+ * regardless of filters. Use with `invalidateQueries` after mutations.
+ */
+export function allDetectorListsQueryKey(organization: Organization) {
+  return detectorListApiOptions(organization, {
+    includeIssueStreamDetectors: true,
+  }).queryKey;
+}
+
 export function useCreateDetector<T extends Detector = Detector>() {
   const org = useOrganization();
   const api = useApi({persistInFlight: true});
@@ -117,7 +127,7 @@ export function useCreateDetector<T extends Detector = Detector>() {
       ),
     onSuccess: _ => {
       queryClient.invalidateQueries({
-        queryKey: detectorListApiOptions(org).queryKey,
+        queryKey: allDetectorListsQueryKey(org),
       });
     },
     onError: _ => {
@@ -144,7 +154,7 @@ export function useUpdateDetector<T extends Detector = Detector>() {
       ),
     onSuccess: (_, data) => {
       queryClient.invalidateQueries({
-        queryKey: detectorListApiOptions(org).queryKey,
+        queryKey: allDetectorListsQueryKey(org),
       });
       queryClient.invalidateQueries({
         queryKey: [

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

@@ -1,10 +1,10 @@
 import {addErrorMessage, addSuccessMessage} from 'sentry/actionCreators/indicator';
 import {t} from 'sentry/locale';
-import type {ApiQueryKey} from 'sentry/utils/queryClient';
 import {useMutation, useQueryClient} from 'sentry/utils/queryClient';
 import type {RequestError} from 'sentry/utils/requestError/requestError';
 import {useApi} from 'sentry/utils/useApi';
 import {useOrganization} from 'sentry/utils/useOrganization';
+import {allDetectorListsQueryKey} from 'sentry/views/detectors/hooks';
 
 export function useDeleteDetectorMutation() {
   const org = useOrganization();
@@ -18,9 +18,7 @@ export function useDeleteDetectorMutation() {
       }),
     onSuccess: () => {
       queryClient.invalidateQueries({
-        // Invalidate list of detectors
-        predicate: query =>
-          (query.queryKey as ApiQueryKey)[0] === `/organizations/${org.slug}/detectors/`,
+        queryKey: allDetectorListsQueryKey(org),
       });
       addSuccessMessage(t('Monitor deleted.'));
     },

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

@@ -4,6 +4,7 @@ import {useMutation, useQueryClient} from 'sentry/utils/queryClient';
 import type {RequestError} from 'sentry/utils/requestError/requestError';
 import {useApi} from 'sentry/utils/useApi';
 import {useOrganization} from 'sentry/utils/useOrganization';
+import {allDetectorListsQueryKey} from 'sentry/views/detectors/hooks';
 
 /** Bulk delete detectors */
 export function useDeleteDetectorsMutation() {
@@ -28,7 +29,7 @@ export function useDeleteDetectorsMutation() {
     },
     onSuccess: () => {
       queryClient.invalidateQueries({
-        queryKey: [`/organizations/${org.slug}/detectors/`],
+        queryKey: allDetectorListsQueryKey(org),
       });
       addSuccessMessage(t('Monitors deleted'));
     },

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

@@ -4,6 +4,7 @@ import {useMutation, useQueryClient} from 'sentry/utils/queryClient';
 import type {RequestError} from 'sentry/utils/requestError/requestError';
 import {useApi} from 'sentry/utils/useApi';
 import {useOrganization} from 'sentry/utils/useOrganization';
+import {allDetectorListsQueryKey} from 'sentry/views/detectors/hooks';
 
 /** Bulk update detectors. Currently supports enabling/disabling detectors. */
 export function useUpdateDetectorsMutation() {
@@ -29,7 +30,7 @@ export function useUpdateDetectorsMutation() {
     },
     onSuccess: (_, variables) => {
       queryClient.invalidateQueries({
-        queryKey: [`/organizations/${org.slug}/detectors/`],
+        queryKey: allDetectorListsQueryKey(org),
       });
       addSuccessMessage(
         variables.enabled ? t('Monitors enabled') : t('Monitors disabled')