Phase 2: Docker and OIDC auth

frontend/src/hooks/useDashboard.ts

@@ -1,5 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
-import { fetchCounts, fetchLibraries, fetchNowPlaying } from "../api/client";
+import { fetchCounts, fetchLibraries, fetchActivity } from "../api/client";
 
 export function useCounts() {
 	return useQuery({
@@ -17,10 +17,13 @@ export function useLibraries() {
 	});
 }
 
-export function useNowPlaying() {
+export function useActivity() {
 	return useQuery({
-		queryKey: ["dashboard", "now-playing"],
-		queryFn: fetchNowPlaying,
+		queryKey: ["dashboard", "activity"],
+		queryFn: fetchActivity,
 		refetchInterval: 15_000,
 	});
 }
+
+// Backward-compatible alias used by older code.
+export const useNowPlaying = useActivity;

frontend/src/hooks/useMedia.ts

@@ -1,11 +1,20 @@
 import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
-import { fetchMediaStatus, buildMediaIndex, queryMedia } from "../api/client";
+import {
+	fetchMediaStatus,
+	buildMediaIndex,
+	queryMedia,
+	stopMediaIndexBuild,
+	forceStopMediaIndexBuild,
+} from "../api/client";
 
 export function useMediaStatus() {
 	return useQuery({
 		queryKey: ["media", "status"],
 		queryFn: fetchMediaStatus,
-		staleTime: 60_000,
+		staleTime: 5_000,
+		refetchInterval: (query) =>
+			query.state.data?.build_running ? 1000 : false,
+		refetchIntervalInBackground: true,
 	});
 }
 
@@ -21,6 +30,8 @@ export function useMediaQuery(params: {
 	enabled?: boolean;
 }) {
 	const { enabled = true, ...queryParams } = params;
+
+	// Feature: Sync file browser with selected media path
 	return useQuery({
 		queryKey: ["media", "query", queryParams],
 		queryFn: () => queryMedia(queryParams),
@@ -29,12 +40,36 @@ export function useMediaQuery(params: {
 	});
 }
 
+function invalidateMedia(queryClient: ReturnType<typeof useQueryClient>) {
+	queryClient.invalidateQueries({ queryKey: ["media"] });
+}
+
 export function useBuildIndex() {
 	const queryClient = useQueryClient();
 	return useMutation({
 		mutationFn: buildMediaIndex,
 		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["media"] });
+			invalidateMedia(queryClient);
+		},
+	});
+}
+
+export function useStopBuildIndex() {
+	const queryClient = useQueryClient();
+	return useMutation({
+		mutationFn: stopMediaIndexBuild,
+		onSuccess: () => {
+			invalidateMedia(queryClient);
+		},
+	});
+}
+
+export function useForceStopBuildIndex() {
+	const queryClient = useQueryClient();
+	return useMutation({
+		mutationFn: forceStopMediaIndexBuild,
+		onSuccess: () => {
+			invalidateMedia(queryClient);
 		},
 	});
 }

frontend/src/hooks/useMonitoring.ts

@@ -16,10 +16,10 @@ export function useMonitoringStatus() {
 	});
 }
 
-export function useMonitoringMetrics(lastSeconds = 3600) {
+export function useMonitoringMetrics() {
 	return useQuery({
-		queryKey: ["monitoring", "metrics", lastSeconds],
-		queryFn: () => fetchMonitoringMetrics(lastSeconds),
+		queryKey: ["monitoring", "metrics"],
+		queryFn: () => fetchMonitoringMetrics(),
 		refetchInterval: 15_000,
 	});
 }

frontend/src/hooks/useSendUserMessage.ts

@@ -0,0 +1,13 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { sendUserMessage } from "../api/client";
+
+export function useSendUserMessage() {
+	const queryClient = useQueryClient();
+
+	return useMutation({
+		mutationFn: sendUserMessage,
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: ["users", "message-queue"] });
+		},
+	});
+}

frontend/src/hooks/useTestUserSmtp.ts

@@ -0,0 +1,8 @@
+import { useMutation } from "@tanstack/react-query";
+import { testUserSmtpConnection } from "../api/client";
+
+export function useTestUserSmtp() {
+	return useMutation({
+		mutationFn: testUserSmtpConnection,
+	});
+}

frontend/src/hooks/useUserMessageQueueStatus.ts

@@ -0,0 +1,11 @@
+import { useQuery } from "@tanstack/react-query";
+import { fetchUserMessageQueueStatus } from "../api/client";
+
+export function useUserMessageQueueStatus() {
+	return useQuery({
+		queryKey: ["users", "message-queue"],
+		queryFn: fetchUserMessageQueueStatus,
+		refetchInterval: 5_000,
+		staleTime: 0,
+	});
+}

frontend/src/hooks/useUsers.ts

@@ -0,0 +1,10 @@
+import { useQuery } from "@tanstack/react-query";
+import { fetchUsers } from "../api/client";
+
+export function useUsers() {
+	return useQuery({
+		queryKey: ["users"],
+		queryFn: fetchUsers,
+		staleTime: 30_000,
+	});
+}