Add react-query wrapper hook for fetching Workflow Diagnostics (#947)

Add react-query hook useDiagnoseWorkflow for fetching Workflow Diagnostics, which makes a call to the diagnoseWorkflow route handler.

Author: adhityamamallan

src/views/workflow-diagnostics/hooks/use-diagnose-workflow/get-diagnose-workflow-query-options.ts

@@ -0,0 +1,31 @@
+import { type UseQueryOptions } from '@tanstack/react-query';
+import queryString from 'query-string';
+
+import { type DiagnoseWorkflowResponse } from '@/route-handlers/diagnose-workflow/diagnose-workflow.types';
+import request from '@/utils/request';
+import { type RequestError } from '@/utils/request/request-error';
+
+import { type UseDiagnoseWorkflowParams } from './use-diagnose-workflow.types';
+
+export default function getDiagnoseWorkflowQueryOptions(
+  params: UseDiagnoseWorkflowParams
+): UseQueryOptions<
+  DiagnoseWorkflowResponse,
+  RequestError,
+  DiagnoseWorkflowResponse,
+  [string, UseDiagnoseWorkflowParams]
+> {
+  return {
+    queryKey: ['diagnoseWorkflow', params],
+    queryFn: async ({
+      queryKey: [_, { domain, cluster, workflowId, runId }],
+    }: {
+      queryKey: [string, UseDiagnoseWorkflowParams];
+    }) =>
+      request(
+        queryString.stringifyUrl({
+          url: `/api/domains/${domain}/${cluster}/workflows/${workflowId}/${runId}/diagnose`,
+        })
+      ).then((res) => res.json()),
+  };
+}

src/views/workflow-diagnostics/hooks/use-diagnose-workflow/use-diagnose-workflow.ts

@@ -0,0 +1,8 @@
+import { useQuery } from '@tanstack/react-query';
+
+import getDiagnoseWorkflowQueryOptions from './get-diagnose-workflow-query-options';
+import { type UseDiagnoseWorkflowParams } from './use-diagnose-workflow.types';
+
+export default function useDiagnoseWorkflow(params: UseDiagnoseWorkflowParams) {
+  return useQuery(getDiagnoseWorkflowQueryOptions(params));
+}

src/views/workflow-diagnostics/hooks/use-diagnose-workflow/use-diagnose-workflow.types.ts

@@ -0,0 +1,6 @@
+export type UseDiagnoseWorkflowParams = {
+  domain: string;
+  cluster: string;
+  workflowId: string;
+  runId: string;
+};