feat(per-instance-hook-scoping): scope observability + backup hooks by instance

frontend/src/pages/service-tabs/JobsTab.tsx

@@ -1,14 +1,8 @@
 /**
  * JobsTab — operational content for the backups service page.
  *
- * Lifted from the old top-level `components/BackupsPage.tsx`. The three
- * sub-tables (Jobs / Runs / Alerts) and their hooks are preserved verbatim.
- *
- * NOTE: the backup hooks currently query globally (no service_id filter).
- * The backend gained `service_id` attribution in Slice 3, but the hooks don't
- * yet accept a serviceId param. This tab shows ALL backups data for now;
- * per-instance scoping by `instance.id` is a follow-up once the hooks gain the
- * parameter.
+ * Instance-scoped: hooks filter by instance.id so multi-instance setups
+ * show only the selected backups service's jobs, runs, and alerts.
  */
 import { useState } from "react";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
@@ -24,15 +18,18 @@ import BackupRunsTable from "../../components/BackupRunsTable";
 import type { ServiceInstance } from "../../types";
 
 export function JobsTab({ instance }: { instance: ServiceInstance }) {
-	// instance.id is not yet used — backup hooks query globally (see file
-	// docstring). Per-instance scoping is a follow-up.
-	void instance;
 	const [tab, setTab] = useState("jobs");
-	const { data: jobsData, isLoading: jobsLoading } = useBackupJobs();
-	const { data: runsData, isLoading: runsLoading } = useBackupRuns();
+	const { data: jobsData, isLoading: jobsLoading } = useBackupJobs(instance.id);
+	const { data: runsData, isLoading: runsLoading } = useBackupRuns(
+		undefined,
+		undefined,
+		instance.id,
+	);
 	const { data: alertsData, isLoading: alertsLoading } = useBackupAlerts(
 		undefined,
 		false,
+		undefined,
+		instance.id,
 	);
 	const acknowledgeMutation = useAcknowledgeAlert();