feat: task ingest dialog

frontend/app/api/mutations/useCancelTaskMutation.ts

@@ -3,6 +3,8 @@ import {
   useMutation,
   useQueryClient,
 } from "@tanstack/react-query";
+import { taskDetailQueryKey } from "@/app/api/queries/useGetTaskQuery";
+import { TASKS_QUERY_KEY } from "@/app/api/queries/useGetTasksQuery";
 
 export interface CancelTaskRequest {
   taskId: string;
@@ -36,12 +38,19 @@ export const useCancelTaskMutation = (
     return response.json();
   }
 
+  const { onSuccess, onError, onSettled, ...restOptions } = options ?? {};
+
   return useMutation({
     mutationFn: cancelTask,
-    onSuccess: () => {
-      // Invalidate tasks query to refresh the list
-      queryClient.invalidateQueries({ queryKey: ["tasks"] });
+    ...restOptions,
+    onSuccess: (data, variables, context) => {
+      queryClient.invalidateQueries({ queryKey: [...TASKS_QUERY_KEY] });
+      queryClient.invalidateQueries({
+        queryKey: taskDetailQueryKey(variables.taskId),
+      });
+      onSuccess?.(data, variables, context);
     },
-    ...options,
+    onError,
+    onSettled,
   });
 };

frontend/app/api/mutations/useDeleteDocument.ts

@@ -13,15 +13,15 @@ interface DeleteDocumentResponse {
   message: string;
 }
 
-const deleteDocument = async (
-  data: DeleteDocumentRequest,
-): Promise<DeleteDocumentResponse> => {
+export async function deleteDocumentByFilename(
+  filename: string,
+): Promise<DeleteDocumentResponse> {
   const response = await fetch("/api/documents/delete-by-filename", {
     method: "POST",
     headers: {
       "Content-Type": "application/json",
     },
-    body: JSON.stringify(data),
+    body: JSON.stringify({ filename } satisfies DeleteDocumentRequest),
   });
 
   if (!response.ok) {
@@ -30,13 +30,14 @@ const deleteDocument = async (
   }
 
   return response.json();
-};
+}
 
 export const useDeleteDocument = () => {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: deleteDocument,
+    mutationFn: ({ filename }: DeleteDocumentRequest) =>
+      deleteDocumentByFilename(filename),
     onSettled: () => {
       // Invalidate and refetch search queries to update the UI
       setTimeout(() => {

frontend/app/api/mutations/useRetryTaskMutation.ts

@@ -0,0 +1,84 @@
+import {
+  type UseMutationOptions,
+  useMutation,
+  useQueryClient,
+} from "@tanstack/react-query";
+import { taskDetailQueryKey } from "@/app/api/queries/useGetTaskQuery";
+import { TASKS_QUERY_KEY } from "@/app/api/queries/useGetTasksQuery";
+
+export interface RetryTaskRequest {
+  taskId: string;
+  /** When set, only these task file paths are retried. Omit to retry all failed RETRYABLE files. */
+  filePaths?: string[];
+}
+
+export interface RetryTaskSkippedFile {
+  file_path: string;
+  filename?: string;
+  reason:
+    | "not_retryable"
+    | "source_file_missing"
+    | "file_not_in_task"
+    | "not_failed"
+    | string;
+}
+
+export interface RetryTaskResponse {
+  task_id: string;
+  retried: number;
+  skipped: RetryTaskSkippedFile[];
+  status: string;
+  message?: string;
+  error?: string;
+}
+
+export const useRetryTaskMutation = (
+  options?: Omit<
+    UseMutationOptions<RetryTaskResponse, Error, RetryTaskRequest>,
+    "mutationFn"
+  >,
+) => {
+  const queryClient = useQueryClient();
+
+  async function retryTask(
+    variables: RetryTaskRequest,
+  ): Promise<RetryTaskResponse> {
+    const body = JSON.stringify(
+      variables.filePaths != null ? { file_paths: variables.filePaths } : {},
+    );
+
+    const response = await fetch(`/api/tasks/${variables.taskId}/retry`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body,
+    });
+
+    const payload = (await response
+      .json()
+      .catch(() => ({}))) as RetryTaskResponse;
+
+    if (!response.ok) {
+      throw new Error(
+        payload.message || payload.error || "Failed to retry task files",
+      );
+    }
+
+    return payload;
+  }
+
+  const { onSuccess, onError, onSettled, ...restOptions } = options ?? {};
+
+  return useMutation({
+    mutationFn: retryTask,
+    ...restOptions,
+    onSuccess: (data, variables, context) => {
+      queryClient.invalidateQueries({ queryKey: [...TASKS_QUERY_KEY] });
+      queryClient.invalidateQueries({
+        queryKey: taskDetailQueryKey(variables.taskId),
+      });
+      onSuccess?.(data, variables, context);
+    },
+    onError,
+    onSettled,
+  });
+};

frontend/app/api/queries/useGetTaskQuery.ts

@@ -0,0 +1,33 @@
+import { type UseQueryOptions, useQuery } from "@tanstack/react-query";
+import type { Task } from "@/app/api/queries/useGetTasksQuery";
+export const TASK_DETAIL_QUERY_KEY = ["tasks", "detail"] as const;
+
+export function taskDetailQueryKey(taskId: string) {
+  return [...TASK_DETAIL_QUERY_KEY, taskId] as const;
+}
+
+export function useGetTaskQuery(
+  taskId: string | null,
+  options?: Omit<UseQueryOptions<Task | null>, "queryKey" | "queryFn">,
+) {
+  return useQuery({
+    queryKey: taskId
+      ? taskDetailQueryKey(taskId)
+      : [...TASK_DETAIL_QUERY_KEY, "idle"],
+    queryFn: async (): Promise<Task | null> => {
+      if (!taskId) {
+        return null;
+      }
+      const response = await fetch(`/api/tasks/${taskId}/enhanced`);
+      if (response.status === 404) {
+        return null;
+      }
+      if (!response.ok) {
+        throw new Error("Failed to fetch task");
+      }
+      return response.json() as Promise<Task>;
+    },
+    ...options,
+    enabled: options?.enabled ?? !!taskId,
+  });
+}

frontend/app/api/queries/useGetTasksQuery.ts

@@ -4,6 +4,25 @@ import {
   useQueryClient,
 } from "@tanstack/react-query";
 
+/** Component that failed, from GET /tasks/enhanced file metadata. */
+export type TaskFailureComponent =
+  | "docling"
+  | "openrag"
+  | "langflow"
+  | "opensearch";
+
+/** Pipeline or validation step where failure occurred. */
+export type TaskFailurePhase =
+  | "parsing"
+  | "chunking"
+  | "embedding"
+  | "indexing"
+  | "file_validation"
+  | "unknown";
+
+/** Who can resolve the failure (enhanced API). */
+export type TaskActionableBy = "USER_ACTIONABLE" | "RETRYABLE";
+
 export interface TaskFileEntry {
   status?:
     | "pending"
@@ -21,7 +40,14 @@ export interface TaskFileEntry {
   filename?: string;
   embedding_model?: string;
   embedding_dimensions?: number;
-  [key: string]: unknown;
+  phase?: "docling" | "langflow" | "complete" | string;
+  docling_status?: string;
+  docling_task_id?: string;
+  /** Present on failed files when the enhanced API can classify the failure. */
+  component?: TaskFailureComponent;
+  failure_phase?: TaskFailurePhase;
+  user_facing_message?: string;
+  actionable_by?: TaskActionableBy;
 }
 
 export interface Task {
@@ -51,13 +77,15 @@ export interface TasksResponse {
   tasks: Task[];
 }
 
+export const TASKS_QUERY_KEY = ["tasks", "enhanced"] as const;
+
 export const useGetTasksQuery = (
   options?: Omit<UseQueryOptions<Task[]>, "queryKey" | "queryFn">,
 ) => {
   const queryClient = useQueryClient();
 
   async function getTasks(): Promise<Task[]> {
-    const response = await fetch("/api/tasks");
+    const response = await fetch("/api/tasks/enhanced");
 
     if (!response.ok) {
       throw new Error("Failed to fetch tasks");
@@ -69,13 +97,12 @@ export const useGetTasksQuery = (
 
   const queryResult = useQuery(
     {
-      queryKey: ["tasks"],
+      queryKey: [...TASKS_QUERY_KEY],
       queryFn: getTasks,
       refetchInterval: (query) => {
-        // Only poll if there are tasks with pending or running status
         const data = query.state.data;
         if (!data || data.length === 0) {
-          return false; // Stop polling if no tasks
+          return false;
         }
 
         const hasActiveTasks = data.some(
@@ -85,11 +112,11 @@ export const useGetTasksQuery = (
             task.status === "processing",
         );
 
-        return hasActiveTasks ? 3000 : false; // Poll every 3 seconds if active tasks exist
+        return hasActiveTasks ? 3000 : false;
       },
       refetchIntervalInBackground: true,
-      staleTime: 0, // Always consider data stale to ensure fresh updates
-      gcTime: 5 * 60 * 1000, // Keep in cache for 5 minutes
+      staleTime: 0,
+      gcTime: 5 * 60 * 1000,
       ...options,
     },
     queryClient,

frontend/app/globals.css

@@ -31,6 +31,17 @@
     --placeholder-foreground: 240 5% 65%;
 
     /* App-level UI tokens (safe defaults, override per brand/theme) */
+    --canvas: 0 0% 100%;
+    --border-subtle-background-contextual: var(--border);
+    /* Task dialog layout (file row indent = px + checkbox + gaps + chevron) */
+    --task-dialog-width: 40rem;
+    --task-dialog-max-height: 90vh;
+    --task-dialog-file-type-width: 10rem;
+    --task-dialog-error-indent: 4.5rem;
+    --task-dialog-error-indent-cloud: 4.75rem;
+    --task-dialog-oss-bg: var(--background);
+    --task-dialog-oss-selected: var(--muted);
+    --z-task-dialog-menu: 100;
     --layered-select-bg: hsl(var(--muted) / 0.5);
     --chat-surface-gradient: rgba(69, 137, 255, 0.16);
     --chat-input-border: hsl(var(--input));
@@ -118,6 +129,10 @@
     --placeholder-foreground: 240 4% 46%;
 
     /* App-level UI tokens (safe defaults, override per brand/theme) */
+    --canvas: 0 0% 3.9%; /* #0A0A0A */
+    --border-subtle-background-contextual: var(--border);
+    --task-dialog-oss-bg: 0 0% 9.02%; /* #171717 */
+    --task-dialog-oss-selected: 0 0% 13.73%; /* #232323 */
     --layered-select-bg: hsl(var(--muted) / 0.5);
     --chat-surface-gradient: rgba(69, 137, 255, 0.16);
     --chat-input-border: hsl(var(--input));
@@ -236,6 +251,7 @@
     --layered-select-bg: rgba(131, 131, 131, 0.24);
     --chat-input-border: #f4f4f4;
     --icon-disabled: #525252;
+    --border-subtle-background-contextual: 0 0% 82%;
     /* Contextual layer (~Gray 100); use hsl(var(--layer-contextual)) */
     /* Layer / contextual surfaces (IBM Gray 10 light, Gray 100 dark) */
     --layer-contextual: 0 0% 96%;
@@ -336,6 +352,7 @@
     --icon-primary: 0 0% 96%; /* #f4f4f4*/
     --placeholder: 0 0% 44%; /* #6F6F6F */
 
+    --border-subtle-background-contextual: 0 0% 22.4%; /* #393939 */
     --layer-contextual: 0 0% 15%;
     --layer-contextual-foreground: 0 0% 96%;
     --text-text-01: 0 0% 96%;