[UI v2] feat: Adds GET work queue details API (#17293)

PrefectHQ · Feb 26, 2025 · c009630 · c009630
1 parent e8225a8
commit c009630
Show file tree

Hide file tree

Showing 3 changed files with 67 additions and 4 deletions.
diff --git a/ui-v2/src/api/work-queues/index.ts b/ui-v2/src/api/work-queues/index.ts
@@ -2,4 +2,5 @@ export {
 	type WorkQueue,
 	type WorkQueuesFilter,
 	buildFilterWorkQueuesQuery,
+	buildWorkQueueDetailsQuery,
 } from "./work-queues";
diff --git a/ui-v2/src/api/work-queues/work-queues.test.ts b/ui-v2/src/api/work-queues/work-queues.test.ts
@@ -4,7 +4,11 @@ import { renderHook, waitFor } from "@testing-library/react";
 import { buildApiUrl, createWrapper, server } from "@tests/utils";
 import { http, HttpResponse } from "msw";
 import { describe, expect, it } from "vitest";
-import { type WorkQueue, buildFilterWorkQueuesQuery } from "./work-queues";
+import {
+	type WorkQueue,
+	buildFilterWorkQueuesQuery,
+	buildWorkQueueDetailsQuery,
+} from "./work-queues";
 
 describe("work queues api", () => {
 	const mockFetchWorkQueuesAPI = (workPools: Array<WorkQueue>) => {
@@ -30,4 +34,39 @@ describe("work queues api", () => {
 			expect(result.current.data).toEqual([workQueue]);
 		});
 	});
+
+	describe("buildWorkQueueDetailsQuery", () => {
+		const mockGetWorkQueueAPI = (workQueue: WorkQueue) => {
+			server.use(
+				http.get(
+					buildApiUrl("/work_pools/:work_pool_name/queues/:name"),
+					() => {
+						return HttpResponse.json(workQueue);
+					},
+				),
+			);
+		};
+
+		it("fetches details about a work pool by name", async () => {
+			const MOCK_WORK_QUEUE = createFakeWorkQueue({
+				work_pool_name: "my-work-pool",
+				name: "my-work-queue",
+			});
+			mockGetWorkQueueAPI(MOCK_WORK_QUEUE);
+
+			const queryClient = new QueryClient();
+			const { result } = renderHook(
+				() =>
+					useSuspenseQuery(
+						buildWorkQueueDetailsQuery(
+							MOCK_WORK_QUEUE.work_pool_name as string,
+							MOCK_WORK_QUEUE.name,
+						),
+					),
+				{ wrapper: createWrapper({ queryClient }) },
+			);
+			await waitFor(() => expect(result.current.isSuccess).toBe(true));
+			expect(result.current.data).toEqual(MOCK_WORK_QUEUE);
+		});
+	});
 });
diff --git a/ui-v2/src/api/work-queues/work-queues.ts b/ui-v2/src/api/work-queues/work-queues.ts
@@ -15,16 +15,21 @@ export type WorkQueuesFilter =
 
  *
  * ```
- * all    =>   ['work-queues']
- * lists  =>   ['work-queues', 'list']
- * list   =>   ['work-queues', 'list', { ...filter }]
+ * all    	=>   ['work-queues']
+ * lists  	=>   ['work-queues', 'list']
+ * list   	=>   ['work-queues', 'list', { ...filter }]
+ * details	=>   ['work-queues', 'details']
+ * detail	=>   ['work-queues', 'detail', workPoolName, workQueueName]
  * ```
  */
 export const queryKeyFactory = {
 	all: () => ["work-queues"] as const,
 	lists: () => [...queryKeyFactory.all(), "list"] as const,
 	list: (filter: WorkQueuesFilter) =>
 		[...queryKeyFactory.lists(), filter] as const,
+	details: () => [...queryKeyFactory.all(), "details"] as const,
+	detail: (workPoolName: string, workQueueName: string) =>
+		[...queryKeyFactory.details(), workPoolName, workQueueName] as const,
 };
 
 // ----------------------------
@@ -65,3 +70,21 @@ export const buildFilterWorkQueuesQuery = (
 		},
 		enabled,
 	});
+
+export const buildWorkQueueDetailsQuery = (
+	work_pool_name: string,
+	name: string,
+) =>
+	queryOptions({
+		queryKey: queryKeyFactory.detail(work_pool_name, name),
+		queryFn: async () => {
+			const res = await getQueryService().GET(
+				"/work_pools/{work_pool_name}/queues/{name}",
+				{ params: { path: { work_pool_name, name } } },
+			);
+			if (!res.data) {
+				throw new Error("'data' expected");
+			}
+			return res.data;
+		},
+	});