diff --git a/frontend/src/hooks/query/use-paginated-conversations.ts b/frontend/src/hooks/query/use-paginated-conversations.ts index 8d4a7a693a..5dfb41390a 100644 --- a/frontend/src/hooks/query/use-paginated-conversations.ts +++ b/frontend/src/hooks/query/use-paginated-conversations.ts @@ -1,14 +1,29 @@ -import { useInfiniteQuery } from "@tanstack/react-query"; +import { useInfiniteQuery, useQueryClient } from "@tanstack/react-query"; import ConversationService from "#/api/conversation-service/conversation-service.api"; import { useIsAuthed } from "./use-is-authed"; export const usePaginatedConversations = (limit: number = 20) => { const { data: userIsAuthenticated } = useIsAuthed(); + const queryClient = useQueryClient(); return useInfiniteQuery({ queryKey: ["user", "conversations", "paginated", limit], - queryFn: ({ pageParam }) => - ConversationService.getUserConversations(limit, pageParam), + queryFn: async ({ pageParam }) => { + const result = await ConversationService.getUserConversations( + limit, + pageParam, + ); + + // Optimistically populate individual conversation caches + result.results.forEach((conversation) => { + queryClient.setQueryData( + ["user", "conversation", conversation.conversation_id], + conversation, + ); + }); + + return result; + }, enabled: !!userIsAuthenticated, getNextPageParam: (lastPage) => lastPage.next_page_id, initialPageParam: undefined as string | undefined,