M-029 Pass 1 batch 3: migrate 3 three-mutation pages to useTrackedMutation

Drains 9 more useMutation sites (42 -> 33). HealthMonitorPage hoists the

shared invalidation pair into a healthCheckInvalidates const so the three

mutations don't repeat the array literal.

Pages migrated:

  - HealthMonitorPage.tsx  create + delete + acknowledge all invalidate

                            [['health-checks'], ['health-checks-summary']]

                            (hoisted to a shared const)

  - AgentGroupsPage.tsx    delete + create + update all invalidate [['agent-groups']]

                            (queryClient kept — modal onSuccess props still use it)

  - JobsPage.tsx           cancel + approve + reject all invalidate [['jobs']]

Verification:

  legacy useMutation count   42 -> 33 (-9)

  useTrackedMutation count   14 -> 23 (+9)

Closes 23 of 56 sites toward M-029 Pass 1 completion.

web/src/pages/HealthMonitorPage.tsx

@@ -1,5 +1,6 @@
 import { useState } from 'react';
-import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query';
+import { useTrackedMutation } from '../hooks/useTrackedMutation';
 import {
   listHealthChecks,
   createHealthCheck,
@@ -139,7 +140,6 @@ function SummaryBar({ summary }: { summary: HealthCheckSummary }) {
 export default function HealthMonitorPage() {
   const [showCreate, setShowCreate] = useState(false);
   const [statusFilter, setStatusFilter] = useState<string | undefined>();
-  const queryClient = useQueryClient();
 
   const { data, isLoading, error, refetch } = useQuery({
     queryKey: ['health-checks', statusFilter],
@@ -153,29 +153,26 @@ export default function HealthMonitorPage() {
     refetchInterval: 30000,
   });
 
-  const createMutation = useMutation({
+  // Every health-check mutation invalidates the same two queries: the list
+  // (rows reflect new state) and the summary (counts reflect new state).
+  const healthCheckInvalidates = [['health-checks'], ['health-checks-summary']];
+
+  const createMutation = useTrackedMutation({
     mutationFn: createHealthCheck,
+    invalidates: healthCheckInvalidates,
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: ['health-checks'] });
-      queryClient.invalidateQueries({ queryKey: ['health-checks-summary'] });
       setShowCreate(false);
     },
   });
 
-  const deleteMutation = useMutation({
+  const deleteMutation = useTrackedMutation({
     mutationFn: deleteHealthCheck,
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: ['health-checks'] });
-      queryClient.invalidateQueries({ queryKey: ['health-checks-summary'] });
-    },
+    invalidates: healthCheckInvalidates,
   });
 
-  const acknowledgeMutation = useMutation({
+  const acknowledgeMutation = useTrackedMutation({
     mutationFn: acknowledgeHealthCheck,
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: ['health-checks'] });
-      queryClient.invalidateQueries({ queryKey: ['health-checks-summary'] });
-    },
+    invalidates: healthCheckInvalidates,
   });
 
   const columns: Column<EndpointHealthCheck>[] = [