fix(chat): preserve quick-click prefetch intent

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/chat-navigation-link/chat-navigation-link.test.tsx

@@ -140,15 +140,23 @@ describe('ChatNavigationLink', () => {
 
   it('prefetches before direct mouse clicks and completed touch taps', () => {
     const link = renderLink()
+    linkPrefetch.mockClear()
 
-    act(() => link.dispatchEvent(pointerEvent('pointerdown', 'mouse', { button: 0 })))
+    act(() => {
+      link.dispatchEvent(pointerEvent('pointerdown', 'mouse', { button: 0 }))
+      link.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+    })
 
     expect(linkPrefetch).toHaveBeenLastCalledWith(true)
     expect(prefetchQuery).toHaveBeenCalledTimes(1)
 
     act(() => link.dispatchEvent(new FocusEvent('focusout', { bubbles: true })))
+    linkPrefetch.mockClear()
     prefetchQuery.mockClear()
-    act(() => link.dispatchEvent(pointerEvent('pointerup', 'touch', { button: 0 })))
+    act(() => {
+      link.dispatchEvent(pointerEvent('pointerup', 'touch', { button: 0 }))
+      link.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+    })
 
     expect(linkPrefetch).toHaveBeenLastCalledWith(true)
     expect(prefetchQuery).toHaveBeenCalledTimes(1)
@@ -200,6 +208,45 @@ describe('ChatNavigationLink', () => {
     expect(prefetchQuery).not.toHaveBeenCalled()
   })
 
+  it('clears prior intent when a persistent row changes route roles', () => {
+    const renderRouteRole = (isCurrentRoute: boolean) => {
+      act(() => {
+        root.render(
+          <QueryClientProvider client={queryClient}>
+            <ChatNavigationLink
+              chatId='chat-1'
+              href='/workspace/ws-1/chat/chat-1'
+              isCurrentRoute={isCurrentRoute}
+            >
+              Open chat
+            </ChatNavigationLink>
+          </QueryClientProvider>
+        )
+      })
+    }
+
+    renderRouteRole(false)
+    const link = container.querySelector('a')
+    if (!link) throw new Error('chat link not rendered')
+    act(() => {
+      link.dispatchEvent(pointerEvent('pointerdown', 'mouse', { button: 0 }))
+      link.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+    })
+    expect(linkPrefetch).toHaveBeenLastCalledWith(true)
+
+    renderRouteRole(true)
+    renderRouteRole(false)
+
+    expect(linkPrefetch).toHaveBeenLastCalledWith(false)
+    prefetchQuery.mockClear()
+    const destinationLink = container.querySelector('a')
+    if (!destinationLink) throw new Error('destination link not rendered')
+    act(() => {
+      destinationLink.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+    })
+    expect(prefetchQuery).toHaveBeenCalledTimes(1)
+  })
+
   it('does not prefetch when the click is canceled or opens another browsing context', () => {
     const canceledLink = renderLink()
 

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/chat-navigation-link/chat-navigation-link.tsx

@@ -35,7 +35,12 @@ interface ChatNavigationLinkProps extends Omit<ComponentProps<typeof Link>, 'hre
   isCurrentRoute?: boolean
 }
 
-export function ChatNavigationLink({
+export function ChatNavigationLink(props: ChatNavigationLinkProps) {
+  const routeRole = props.isCurrentRoute ? 'current' : 'destination'
+  return <IntentAwareChatNavigationLink key={`${props.chatId}:${routeRole}`} {...props} />
+}
+
+function IntentAwareChatNavigationLink({
   chatId,
   href,
   isCurrentRoute = false,
@@ -52,6 +57,7 @@ export function ChatNavigationLink({
 }: ChatNavigationLinkProps) {
   const queryClient = useQueryClient()
   const prefetchTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null)
+  const navigationIntentRef = useRef(false)
   const [shouldPrefetchRoute, setShouldPrefetchRoute] = useState(false)
 
   const cancelScheduledPrefetch = useCallback(() => {
@@ -69,6 +75,7 @@ export function ChatNavigationLink({
   const prefetchForIntent = () => {
     cancelScheduledPrefetch()
     if (isCurrentRoute) return
+    navigationIntentRef.current = true
     setShouldPrefetchRoute(true)
     prefetchHistory()
   }
@@ -95,6 +102,7 @@ export function ChatNavigationLink({
       onMouseLeave={(event) => {
         onMouseLeave?.(event)
         cancelScheduledPrefetch()
+        navigationIntentRef.current = false
         setShouldPrefetchRoute(false)
       }}
       onFocus={(event) => {
@@ -104,6 +112,7 @@ export function ChatNavigationLink({
       onBlur={(event) => {
         onBlur?.(event)
         cancelScheduledPrefetch()
+        navigationIntentRef.current = false
         setShouldPrefetchRoute(false)
       }}
       onPointerDown={(event) => {
@@ -121,6 +130,7 @@ export function ChatNavigationLink({
       onPointerCancel={(event) => {
         onPointerCancel?.(event)
         cancelScheduledPrefetch()
+        navigationIntentRef.current = false
         setShouldPrefetchRoute(false)
       }}
       onTouchStart={onTouchStart}
@@ -134,8 +144,7 @@ export function ChatNavigationLink({
           !event.altKey
         ) {
           cancelScheduledPrefetch()
-          if (!isCurrentRoute && !shouldPrefetchRoute) prefetchHistory()
-          setShouldPrefetchRoute(false)
+          if (!isCurrentRoute && !navigationIntentRef.current) prefetchHistory()
         }
       }}
     />