From db4dbaa2894a1a98e90e814416eb9f7c35711819 Mon Sep 17 00:00:00 2001
From: OpeOginni <107570612+OpeOginni@users.noreply.github.com>
Date: Fri, 31 Jul 2026 07:14:09 +0200
Subject: [PATCH] fix(app): prevent stale session tab reads (#39767)

---
 .../app/src/components/session/session-header.tsx    | 12 ++++++------
 packages/app/src/components/titlebar-tab-nav.tsx     |  5 +++--
 .../app/src/pages/new-session/new-session-view.tsx   |  4 ++--
 3 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/packages/app/src/components/session/session-header.tsx b/packages/app/src/components/session/session-header.tsx
index da1770cd13..dc6cdaa6f3 100644
--- a/packages/app/src/components/session/session-header.tsx
+++ b/packages/app/src/components/session/session-header.tsx
@@ -289,9 +289,9 @@ export function SessionHeader() {
 
   return (
     <>
-      <Show when={search() && centerMount()}>
+      <Show when={search() && centerMount()} keyed>
         {(mount) => (
-          <Portal mount={mount()}>
+          <Portal mount={mount}>
             <Button
               type="button"
               variant="ghost"
@@ -308,10 +308,10 @@ export function SessionHeader() {
                 </span>
               </div>
 
-              <Show when={hotkey()}>
+              <Show when={hotkey()} keyed>
                 {(keybind) => (
                   <Keybind class="shrink-0 !border-0 !bg-transparent !shadow-none px-0 text-text-weaker">
-                    {keybind()}
+                    {keybind}
                   </Keybind>
                 )}
               </Show>
@@ -319,9 +319,9 @@ export function SessionHeader() {
           </Portal>
         )}
       </Show>
-      <Show when={rightMount()}>
+      <Show when={rightMount()} keyed>
         {(mount) => (
-          <Portal mount={mount()}>
+          <Portal mount={mount}>
             <Show
               when={isV2}
               fallback={
diff --git a/packages/app/src/components/titlebar-tab-nav.tsx b/packages/app/src/components/titlebar-tab-nav.tsx
index 3823cf10b8..5003d0ed30 100644
--- a/packages/app/src/components/titlebar-tab-nav.tsx
+++ b/packages/app/src/components/titlebar-tab-nav.tsx
@@ -224,6 +224,7 @@ export function TabNavItem(props: {
         <span data-slot="project-avatar-slot" class="flex size-4 shrink-0 items-center justify-center">
           <Show
             when={props.session()}
+            keyed
             fallback={
               <span class="block size-4 rounded-[3px] border border-v2-border-border-muted" aria-hidden="true" />
             }
@@ -231,8 +232,8 @@ export function TabNavItem(props: {
             {(session) => (
               <SessionTabAvatar
                 project={project()}
-                directory={session().directory}
-                sessionId={session().id}
+                directory={session.directory}
+                sessionId={session.id}
                 server={props.server}
               />
             )}
diff --git a/packages/app/src/pages/new-session/new-session-view.tsx b/packages/app/src/pages/new-session/new-session-view.tsx
index 84c671e140..5960e64335 100644
--- a/packages/app/src/pages/new-session/new-session-view.tsx
+++ b/packages/app/src/pages/new-session/new-session-view.tsx
@@ -78,9 +78,9 @@ export function NewSessionStatus(props: { mount: Accessor<HTMLElement | null>; v
   const language = useLanguage()
 
   return (
-    <Show when={props.mount()}>
+    <Show when={props.mount()} keyed>
       {(mount) => (
-        <Portal mount={mount()}>
+        <Portal mount={mount}>
           <Show when={props.visible()}>
             <Tooltip placement="bottom" value={language.t("status.popover.trigger")}>
               <StatusPopoverV2 />