feat: Implement delete and share functionality in SearchHistoryDialog

src/components/GroupedHistoryView/ProjectDialog.tsx

@@ -46,7 +46,7 @@ interface ProjectDialogProps {
     historyId: string,
     project?: ProjectGroup
   ) => void;
-  onTaskDelete: (taskId: string) => void;
+  onTaskDelete: (historyId: string, task?: import('@/types/history').HistoryTask) => void;
   onTaskShare: (taskId: string) => void;
   activeTaskId?: string;
 }
@@ -256,8 +256,12 @@ export default function ProjectDialog({
                         project
                       )
                     }
-                    onDelete={() => onTaskDelete(task.id.toString())}
-                    onShare={() => onTaskShare(task.id.toString())}
+                    onDelete={() =>
+                      onTaskDelete(task.id.toString(), task)
+                    }
+                    onShare={() =>
+                      onTaskShare(task.task_id || task.id.toString())
+                    }
                     isLast={index === project.tasks.length - 1}
                     showActions={false}
                   />

src/components/GroupedHistoryView/ProjectGroup.tsx

@@ -51,7 +51,7 @@ interface ProjectGroupProps {
     historyId: string,
     project?: ProjectGroupType
   ) => void;
-  onTaskDelete: (taskId: string) => void;
+  onTaskDelete: (historyId: string, task?: import('@/types/history').HistoryTask) => void;
   onTaskShare: (taskId: string) => void;
   activeTaskId?: string;
   searchValue?: string;

src/components/GroupedHistoryView/index.tsx

@@ -34,7 +34,11 @@ interface GroupedHistoryViewProps {
     historyId: string,
     project?: ProjectGroupType
   ) => void;
-  onTaskDelete: (historyId: string, callback: () => void) => void;
+  onTaskDelete: (
+    historyId: string,
+    task: HistoryTask | undefined,
+    callback: () => void
+  ) => void;
   onTaskShare: (taskId: string) => void;
   activeTaskId?: string;
   refreshTrigger?: number; // For triggering refresh from parent
@@ -82,9 +86,12 @@ export default function GroupedHistoryView({
     }
   };
 
-  const onDelete = (historyId: string) => {
+  const onDelete = (historyId: string, task?: HistoryTask) => {
     try {
-      onTaskDelete(historyId, () => {
+      const targetTask = task ?? projects.flatMap((p) => p.tasks).find(
+        (t) => String(t.id) === historyId
+      );
+      onTaskDelete(historyId, targetTask, () => {
         setProjects((prevProjects) => {
           // Create new project objects instead of mutating existing ones
           return prevProjects

src/components/SearchHistoryDialog.tsx

@@ -14,9 +14,7 @@
 
 'use client';
 
-import { ScanFace, Search } from 'lucide-react';
-import { useEffect, useState } from 'react';
-
+import { proxyFetchDelete } from '@/api/http';
 import GroupedHistoryView from '@/components/GroupedHistoryView';
 import {
   CommandDialog,
@@ -29,13 +27,25 @@ import {
 } from '@/components/ui/command';
 import useChatStoreAdapter from '@/hooks/useChatStoreAdapter';
 import { loadProjectFromHistory } from '@/lib';
+import { share } from '@/lib/share';
 import { fetchHistoryTasks } from '@/service/historyApi';
+import { getAuthStore } from '@/store/authStore';
 import { useGlobalStore } from '@/store/globalStore';
+import { HistoryTask } from '@/types/history';
 import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
+import { Ellipsis, ScanFace, Search, Share2, Trash2 } from 'lucide-react';
+import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useNavigate } from 'react-router-dom';
+import { toast } from 'sonner';
 import { Button } from './ui/button';
 import { DialogTitle } from './ui/dialog';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from './ui/dropdown-menu';
 
 export function SearchHistoryDialog() {
   const { t } = useTranslation();
@@ -75,14 +85,53 @@ export function SearchHistoryDialog() {
     }
   };
 
-  const handleDelete = (taskId: string) => {
-    // TODO: Implement delete functionality similar to HistorySidebar
-    console.log('Delete task:', taskId);
+  const handleDelete = async (
+    historyId: string,
+    task: HistoryTask | undefined,
+    callback: () => void
+  ) => {
+    try {
+      await proxyFetchDelete(`/api/chat/history/${historyId}`);
+
+      if (
+        task?.task_id &&
+        (window as unknown as { ipcRenderer?: object }).ipcRenderer
+      ) {
+        const { email } = getAuthStore();
+        try {
+          await (
+            window as unknown as {
+              ipcRenderer: {
+                invoke: (
+                  a: string,
+                  b: string,
+                  c: string,
+                  d?: string
+                ) => Promise<void>;
+              };
+            }
+          ).ipcRenderer.invoke(
+            'delete-task-files',
+            email,
+            task.task_id,
+            task.project_id ?? undefined
+          );
+        } catch (error) {
+          console.warn('Local file cleanup failed:', error);
+        }
+      }
+
+      callback();
+      toast.success(t('layout.delete-success') || 'Task deleted successfully');
+    } catch (error) {
+      console.error('Failed to delete history task:', error);
+      toast.error(t('layout.delete-failed') || 'Failed to delete task');
+    }
   };
 
-  const handleShare = (taskId: string) => {
-    // TODO: Implement share functionality similar to HistorySidebar
-    console.log('Share task:', taskId);
+  const handleShare = async (taskId: string) => {
+    setOpen(false);
+    await share(taskId);
   };
 
   useEffect(() => {
@@ -125,23 +174,70 @@ export function SearchHistoryDialog() {
               {historyTasks.map((task) => (
                 <CommandItem
                   key={task.id}
-                  className="cursor-pointer"
-                  /**
-                   * TODO(history): Update to use project_id field
-                   * after update instead.
-                   */
+                  className="flex cursor-pointer items-center justify-between gap-2"
                   onSelect={() =>
                     handleSetActive(
-                      task.task_id,
+                      task.project_id || task.task_id,
                       task.question,
-                      String(task.id)
+                      String(task.id),
+                      {
+                        tasks: task.tasks || [{ task_id: task.task_id }],
+                        project_name: task.project_name,
+                      }
                     )
                   }
                 >
-                  <ScanFace />
-                  <div className="overflow-hidden text-ellipsis whitespace-nowrap">
-                    {task.question}
+                  <div className="flex min-w-0 flex-1 items-center gap-2">
+                    <ScanFace className="h-4 w-4 flex-shrink-0" />
+                    <span className="overflow-hidden text-ellipsis whitespace-nowrap">
+                      {task.question}
+                    </span>
                   </div>
+                  <DropdownMenu>
+                    <DropdownMenuTrigger asChild>
+                      <Button
+                        variant="ghost"
+                        size="icon"
+                        className="h-7 w-7 flex-shrink-0"
+                        onClick={(e) => e.stopPropagation()}
+                      >
+                        <Ellipsis className="h-4 w-4" />
+                      </Button>
+                    </DropdownMenuTrigger>
+                    <DropdownMenuContent align="end">
+                      <DropdownMenuItem
+                        onClick={(e) => {
+                          e.stopPropagation();
+                          handleShare(task.task_id || String(task.id));
+                        }}
+                      >
+                        <Share2 className="mr-2 h-4 w-4" />
+                        {t('layout.share')}
+                      </DropdownMenuItem>
+                      <DropdownMenuItem
+                        className="text-text-cuation"
+                        onClick={async (e) => {
+                          e.stopPropagation();
+                          try {
+                            await handleDelete(
+                              String(task.id),
+                              task,
+                              () => {
+                                setHistoryTasks((prev) =>
+                                  prev.filter((t) => t.id !== task.id)
+                                );
+                              }
+                            );
+                          } catch {
+                            // Error already handled in handleDelete
+                          }
+                        }}
+                      >
+                        <Trash2 className="mr-2 h-4 w-4" />
+                        {t('layout.delete')}
+                      </DropdownMenuItem>
+                    </DropdownMenuContent>
+                  </DropdownMenu>
                 </CommandItem>
               ))}
             </CommandGroup>

src/i18n/locales/en-us/layout.json

@@ -53,6 +53,8 @@
   "welcome": "Welcome",
   "delete-task": "Delete Task",
   "delete-task-confirmation": "Are you sure you want to delete this task? This action cannot be undone.",
+  "delete-success": "Task deleted successfully",
+  "delete-failed": "Failed to delete task",
   "delete": "Delete",
   "cancel": "Cancel",
   "continue": "Continue",

src/pages/Projects/Project.tsx

@@ -131,8 +131,12 @@ export default function Project() {
     navigate(`/`);
   };
 
-  const handleDelete = (id: string, callback?: () => void) => {
-    setCurHistoryId(id);
+  const handleDelete = (
+    historyId: string,
+    _task?: import('@/types/history').HistoryTask,
+    callback?: () => void
+  ) => {
+    setCurHistoryId(historyId);
     setDeleteModalOpen(true);
     if (callback) setDeleteCallback(callback);
   };
@@ -296,7 +300,9 @@ export default function Project() {
             onOngoingTaskResume={(taskId) =>
               handleTakeControl('resume', taskId)
             }
-            onOngoingTaskDelete={(taskId) => handleDelete(taskId)}
+            onOngoingTaskDelete={(taskId) =>
+              handleDelete(taskId, undefined, () => {})
+            }
             onProjectDelete={handleProjectDelete}
             refreshTrigger={refreshTrigger}
           />