diff --git a/src/apps/officer-web/Screens/Dashboard/Email/EmailList.tsx b/src/apps/officer-web/Screens/Dashboard/Email/EmailList.tsx index f5f52f3d..5169f5e0 100644 --- a/src/apps/officer-web/Screens/Dashboard/Email/EmailList.tsx +++ b/src/apps/officer-web/Screens/Dashboard/Email/EmailList.tsx @@ -1,6 +1,6 @@ import { useEffect, useRef, useState } from 'react'; import { Link } from 'react-router'; -import { useQuery, useQueryClient } from '@tanstack/react-query'; +import { useQuery, useQueryClient, keepPreviousData } from '@tanstack/react-query'; import { ChevronLeft, ChevronRight, Inbox, Loader2, Mail, Paperclip, RefreshCw, Search, Send, ShieldAlert, Trash2, X } from 'lucide-react'; import { toast } from 'sonner'; import { Button } from '@/components/ui/button'; @@ -66,6 +66,9 @@ export const EmailList = () => { isSearching ? client.get<{ messages: EmailSummary[]; total: number }>(`/email/search?q=${encodeURIComponent(debouncedSearch)}&page=${page}&limit=${LIMIT}`) : client.get<{ messages: EmailSummary[]; total: number }>(`/email/messages?page=${page}&limit=${LIMIT}&folder=${folder}`), + // Keep the previous results visible while the next query loads, so switching search terms/pages + // never bails to the full-panel loading view (which would unmount the search input and drop focus). + placeholderData: keepPreviousData, }); // Auto-switch to "all" if inbox filter returns nothing but emails exist (not while searching)