From 605a05a952b5e6a5a7c68f9b866b90ac901cd2db Mon Sep 17 00:00:00 2001 From: Vukasin Date: Mon, 26 May 2025 19:46:58 +0200 Subject: [PATCH] fix: pointer and native event --- .../src/components/sidebar/nav-agents.tsx | 145 +++++++++--------- .../src/components/sidebar/share-modal.tsx | 8 + .../thread/DeleteConfirmationDialog.tsx | 9 +- .../thread/chat-input/message-input.tsx | 2 +- 4 files changed, 91 insertions(+), 73 deletions(-) diff --git a/frontend/src/components/sidebar/nav-agents.tsx b/frontend/src/components/sidebar/nav-agents.tsx index 5356993b..a8c521b4 100644 --- a/frontend/src/components/sidebar/nav-agents.tsx +++ b/frontend/src/components/sidebar/nav-agents.tsx @@ -61,38 +61,38 @@ export function NavAgents() { const { performDelete } = useDeleteOperation(); const isPerformingActionRef = useRef(false); const queryClient = useQueryClient(); - + const [selectedThreads, setSelectedThreads] = useState>(new Set()); const [deleteProgress, setDeleteProgress] = useState(0); const [totalToDelete, setTotalToDelete] = useState(0); - const { - data: projects = [], + const { + data: projects = [], isLoading: isProjectsLoading, - error: projectsError + error: projectsError } = useProjects(); - - const { - data: threads = [], + + const { + data: threads = [], isLoading: isThreadsLoading, - error: threadsError + error: threadsError } = useThreads(); const { mutate: deleteThreadMutation, isPending: isDeletingSingle } = useDeleteThread(); - const { - mutate: deleteMultipleThreadsMutation, - isPending: isDeletingMultiple + const { + mutate: deleteMultipleThreadsMutation, + isPending: isDeletingMultiple } = useDeleteMultipleThreads(); - const combinedThreads: ThreadWithProject[] = - !isProjectsLoading && !isThreadsLoading ? - processThreadsWithProjects(threads, projects) : []; + const combinedThreads: ThreadWithProject[] = + !isProjectsLoading && !isThreadsLoading ? + processThreadsWithProjects(threads, projects) : []; const handleDeletionProgress = (completed: number, total: number) => { const percentage = (completed / total) * 100; setDeleteProgress(percentage); }; - + useEffect(() => { const handleProjectUpdate = (event: Event) => { const customEvent = event as CustomEvent; @@ -150,7 +150,7 @@ export function NavAgents() { e.preventDefault(); return; } - + e.preventDefault() setLoadingThreadId(threadId) router.push(url) @@ -162,7 +162,7 @@ export function NavAgents() { e.preventDefault(); e.stopPropagation(); } - + setSelectedThreads(prev => { const newSelection = new Set(prev); if (newSelection.has(threadId)) { @@ -194,18 +194,18 @@ export function NavAgents() { // Function to handle multi-delete const handleMultiDelete = () => { if (selectedThreads.size === 0) return; - + // Get thread names for confirmation dialog const threadsToDelete = combinedThreads.filter(t => selectedThreads.has(t.threadId)); const threadNames = threadsToDelete.map(t => t.projectName).join(", "); - - setThreadToDelete({ - id: "multiple", - name: selectedThreads.size > 3 - ? `${selectedThreads.size} conversations` - : threadNames + + setThreadToDelete({ + id: "multiple", + name: selectedThreads.size > 3 + ? `${selectedThreads.size} conversations` + : threadNames }); - + setTotalToDelete(selectedThreads.size); setDeleteProgress(0); setIsDeleteDialogOpen(true); @@ -266,10 +266,10 @@ export function NavAgents() { // Multi-thread deletion const threadIdsToDelete = Array.from(selectedThreads); const isActiveThreadIncluded = threadIdsToDelete.some(id => pathname?.includes(id)); - + // Show initial toast toast.info(`Deleting ${threadIdsToDelete.length} conversations...`); - + try { // If the active thread is included, handle navigation first if (isActiveThreadIncluded) { @@ -277,14 +277,14 @@ export function NavAgents() { isNavigatingRef.current = true; document.body.style.pointerEvents = 'none'; router.push('/dashboard'); - + // Wait a moment for navigation to start await new Promise(resolve => setTimeout(resolve, 100)); } - + // Use the mutation for bulk deletion deleteMultipleThreadsMutation( - { + { threadIds: threadIdsToDelete, onProgress: handleDeletionProgress }, @@ -292,15 +292,15 @@ export function NavAgents() { onSuccess: (data) => { // Invalidate queries to refresh the list queryClient.invalidateQueries({ queryKey: threadKeys.lists() }); - + // Show success message toast.success(`Successfully deleted ${data.successful.length} conversations`); - + // If some deletions failed, show warning if (data.failed.length > 0) { toast.warning(`Failed to delete ${data.failed.length} conversations`); } - + // Reset states setSelectedThreads(new Set()); setDeleteProgress(0); @@ -321,7 +321,7 @@ export function NavAgents() { } catch (err) { console.error('Error initiating bulk deletion:', err); toast.error('Error initiating deletion process'); - + // Reset states setSelectedThreads(new Set()); setThreadToDelete(null); @@ -335,7 +335,7 @@ export function NavAgents() { // Loading state or error handling const isLoading = isProjectsLoading || isThreadsLoading; const hasError = projectsError || threadsError; - + if (hasError) { console.error('Error loading data:', { projectsError, threadsError }); } @@ -348,16 +348,16 @@ export function NavAgents() {
{selectedThreads.size > 0 ? ( <> - - -