From 6c664a366f23219afc0214d4e702255425f169e0 Mon Sep 17 00:00:00 2001
From: Philipinho <16838612+Philipinho@users.noreply.github.com>
Date: Sat, 31 Jan 2026 23:50:55 +0000
Subject: [PATCH] fix flicker

---
 .../page-history/components/history-item.tsx  |  6 ++---
 .../page-history/components/history-list.tsx  | 27 ++++++++++---------
 .../queries/page-history-query.ts             | 13 ++++++++-
 3 files changed, 30 insertions(+), 16 deletions(-)

diff --git a/apps/client/src/features/page-history/components/history-item.tsx b/apps/client/src/features/page-history/components/history-item.tsx
index bd48e501..6d440569 100644
--- a/apps/client/src/features/page-history/components/history-item.tsx
+++ b/apps/client/src/features/page-history/components/history-item.tsx
@@ -10,7 +10,7 @@ interface HistoryItemProps {
   historyItem: IPageHistory;
   index: number;
   onSelect: (id: string, index: number) => void;
-  onHover?: (id: string) => void;
+  onHover?: (id: string, index: number) => void;
   onHoverEnd?: () => void;
   isActive: boolean;
 }
@@ -28,8 +28,8 @@ const HistoryItem = memo(function HistoryItem({
   }, [onSelect, historyItem.id, index]);
 
   const handleMouseEnter = useCallback(() => {
-    onHover?.(historyItem.id);
-  }, [onHover, historyItem.id]);
+    onHover?.(historyItem.id, index);
+  }, [onHover, historyItem.id, index]);
 
   return (
     <UnstyledButton
diff --git a/apps/client/src/features/page-history/components/history-list.tsx b/apps/client/src/features/page-history/components/history-list.tsx
index 08f7c37f..c3c6ed2a 100644
--- a/apps/client/src/features/page-history/components/history-list.tsx
+++ b/apps/client/src/features/page-history/components/history-list.tsx
@@ -1,9 +1,8 @@
 import {
   usePageHistoryListQuery,
   usePageHistoryQuery,
+  prefetchPageHistory,
 } from "@/features/page-history/queries/page-history-query";
-import { getPageHistoryById } from "@/features/page-history/services/page-history-service";
-import { queryClient } from "@/main";
 import HistoryItem from "@/features/page-history/components/history-item";
 import {
   activeHistoryIdAtom,
@@ -36,7 +35,7 @@ import {
   SpaceCaslSubject,
 } from "@/features/space/permissions/permissions.type.ts";
 
-const PREFETCH_DELAY_MS = 300;
+const PREFETCH_DELAY_MS = 150;
 
 interface Props {
   pageId: string;
@@ -111,15 +110,19 @@ function HistoryList({ pageId }: Props) {
     }
   }, []);
 
-  const handleHover = useCallback((historyId: string) => {
-    clearPrefetchTimeout();
-    prefetchTimeoutRef.current = setTimeout(() => {
-      queryClient.prefetchQuery({
-        queryKey: ["page-history", historyId],
-        queryFn: () => getPageHistoryById(historyId),
-      });
-    }, PREFETCH_DELAY_MS);
-  }, [clearPrefetchTimeout]);
+  const handleHover = useCallback(
+    (historyId: string, index: number) => {
+      clearPrefetchTimeout();
+      prefetchTimeoutRef.current = setTimeout(() => {
+        prefetchPageHistory(historyId);
+        const prevId = historyItems[index + 1]?.id;
+        if (prevId) {
+          prefetchPageHistory(prevId);
+        }
+      }, PREFETCH_DELAY_MS);
+    },
+    [clearPrefetchTimeout, historyItems],
+  );
 
   useEffect(() => {
     return clearPrefetchTimeout;
diff --git a/apps/client/src/features/page-history/queries/page-history-query.ts b/apps/client/src/features/page-history/queries/page-history-query.ts
index 6ca93f99..43590232 100644
--- a/apps/client/src/features/page-history/queries/page-history-query.ts
+++ b/apps/client/src/features/page-history/queries/page-history-query.ts
@@ -11,6 +11,17 @@ import {
 } from "@/features/page-history/services/page-history-service";
 import { IPageHistory } from "@/features/page-history/types/page.types";
 import { IPagination } from "@/lib/types.ts";
+import { queryClient } from "@/main";
+
+const HISTORY_STALE_TIME = 10 * 60 * 1000;
+
+export function prefetchPageHistory(historyId: string) {
+  return queryClient.prefetchQuery({
+    queryKey: ["page-history", historyId],
+    queryFn: () => getPageHistoryById(historyId),
+    staleTime: HISTORY_STALE_TIME,
+  });
+}
 
 export function usePageHistoryListQuery(
   pageId: string,
@@ -32,6 +43,6 @@ export function usePageHistoryQuery(
     queryKey: ["page-history", historyId],
     queryFn: () => getPageHistoryById(historyId),
     enabled: !!historyId,
-    staleTime: 10 * 60 * 1000,
+    staleTime: HISTORY_STALE_TIME,
   });
 }