From fced9c5a2fac238bc748ae4f29e0be6bc75c2b63 Mon Sep 17 00:00:00 2001
From: usrnk1 <7547651+usrnk1@users.noreply.github.com>
Date: Tue, 30 Jun 2026 17:00:25 +0200
Subject: [PATCH] feat(desktop): polish tooltips and session search (#34632)

---
 packages/app/src/components/dialog-select-model.tsx    |  1 -
 .../app/src/components/prompt-input/context-items.tsx  |  2 +-
 packages/app/src/components/session/session-header.tsx |  1 +
 packages/app/src/components/titlebar.tsx               |  6 +++---
 packages/app/src/pages/home.tsx                        | 10 +++-------
 packages/ui/src/components/tooltip.tsx                 |  2 ++
 packages/ui/src/v2/components/tooltip-v2.css           |  7 +++++++
 packages/ui/src/v2/components/tooltip-v2.tsx           |  3 ++-
 8 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/packages/app/src/components/dialog-select-model.tsx b/packages/app/src/components/dialog-select-model.tsx
index b4e8b3b719c..e16d9a66571 100644
--- a/packages/app/src/components/dialog-select-model.tsx
+++ b/packages/app/src/components/dialog-select-model.tsx
@@ -59,7 +59,6 @@ const ModelList: Component<{
           class="w-full"
           placement="right-start"
           gutter={12}
-          openDelay={0}
           value={<ModelTooltip model={item} latest={item.latest} free={isFree(item.provider.id, item.cost)} />}
         >
           {node}
diff --git a/packages/app/src/components/prompt-input/context-items.tsx b/packages/app/src/components/prompt-input/context-items.tsx
index 3a0e525a4af..e7d2b5d3acf 100644
--- a/packages/app/src/components/prompt-input/context-items.tsx
+++ b/packages/app/src/components/prompt-input/context-items.tsx
@@ -37,7 +37,7 @@ export const PromptContextItems: Component<ContextItemsProps> = (props) => {
                   </span>
                 }
                 placement="top"
-                openDelay={2000}
+                openDelay={800}
               >
                 <div
                   classList={{
diff --git a/packages/app/src/components/session/session-header.tsx b/packages/app/src/components/session/session-header.tsx
index ef93bbe0814..4ec225c9422 100644
--- a/packages/app/src/components/session/session-header.tsx
+++ b/packages/app/src/components/session/session-header.tsx
@@ -541,6 +541,7 @@ function SessionHeaderV2Actions(props: { state: SessionHeaderV2ActionsState }) {
       </Show>
       <Show when={props.state.reviewVisible}>
         <TooltipV2
+          class="shrink-0"
           placement="bottom"
           value={
             <>
diff --git a/packages/app/src/components/titlebar.tsx b/packages/app/src/components/titlebar.tsx
index e6c53f9d09a..e772aa400ac 100644
--- a/packages/app/src/components/titlebar.tsx
+++ b/packages/app/src/components/titlebar.tsx
@@ -572,7 +572,7 @@ export function Titlebar(props: { update?: TitlebarUpdate }) {
                           placement="bottom"
                           title={language.t("command.session.new")}
                           keybind={command.keybind("session.new")}
-                          openDelay={2000}
+                          openDelay={800}
                         >
                           <Button
                             variant="ghost"
@@ -602,7 +602,7 @@ export function Titlebar(props: { update?: TitlebarUpdate }) {
                   >
                     <Show when={hasProjects() && nav()}>
                       <div class="flex items-center gap-0 transition-transform">
-                        <Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={2000}>
+                        <Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={800}>
                           <Button
                             variant="ghost"
                             icon="chevron-left"
@@ -612,7 +612,7 @@ export function Titlebar(props: { update?: TitlebarUpdate }) {
                             aria-label={language.t("common.goBack")}
                           />
                         </Tooltip>
-                        <Tooltip placement="bottom" value={language.t("common.goForward")} openDelay={2000}>
+                        <Tooltip placement="bottom" value={language.t("common.goForward")} openDelay={800}>
                           <Button
                             variant="ghost"
                             icon="chevron-right"
diff --git a/packages/app/src/pages/home.tsx b/packages/app/src/pages/home.tsx
index 21c7d7137be..5725d9734ab 100644
--- a/packages/app/src/pages/home.tsx
+++ b/packages/app/src/pages/home.tsx
@@ -1006,8 +1006,8 @@ function HomeSessionLeading(props: {
       <Show when={hasOpenTab()}>
         <span
           aria-hidden="true"
-          class="pointer-events-none absolute top-1/2 h-[7px] w-[3px] -translate-y-1/2 rounded-[2px] bg-v2-background-bg-layer-04"
-          style={{ right: "calc(100% + 5px)" }}
+          class="pointer-events-none absolute top-1/2 h-3 w-0.5 -translate-y-1/2 rounded-[2px] bg-v2-background-bg-layer-04"
+          style={{ right: "calc(100% + 4px)" }}
         />
       </Show>
       <SessionTabAvatar
@@ -1164,11 +1164,7 @@ function HomeSessionSearch(props: {
           </div>
         </Show>
         <label
-          class="relative z-20 flex h-9 w-full items-center gap-2 rounded-[6px] bg-v2-background-bg-layer-02 py-1 pl-3 pr-2 text-v2-icon-icon-muted transition-[background-color,box-shadow] duration-[120ms] ease-in-out"
-          classList={{
-            "focus-within:shadow-[0_0_0_0.5px_var(--v2-border-border-focus),var(--v2-elevation-raised)]": !props.open,
-            "shadow-[0_0_0_0.5px_var(--v2-border-border-focus)]": props.open,
-          }}
+          class="relative z-20 flex h-9 w-full items-center gap-2 rounded-[6px] bg-v2-background-bg-layer-02/60 py-1 pl-3 pr-2 text-v2-icon-icon-muted transition-[background-color,box-shadow] duration-[120ms] ease-in-out hover:bg-v2-background-bg-layer-02"
         >
           <IconV2 name="magnifying-glass" />
           <input
diff --git a/packages/ui/src/components/tooltip.tsx b/packages/ui/src/components/tooltip.tsx
index 4366651d2b8..6a2f4b55d45 100644
--- a/packages/ui/src/components/tooltip.tsx
+++ b/packages/ui/src/components/tooltip.tsx
@@ -107,6 +107,8 @@ export function Tooltip(props: TooltipProps) {
       <Match when={true}>
         <KobalteTooltip
           gutter={4}
+          openDelay={400}
+          skipDelayDuration={300}
           {...others}
           closeDelay={0}
           ignoreSafeArea={local.ignoreSafeArea ?? true}
diff --git a/packages/ui/src/v2/components/tooltip-v2.css b/packages/ui/src/v2/components/tooltip-v2.css
index ad94c3c662c..1eefc858a88 100644
--- a/packages/ui/src/v2/components/tooltip-v2.css
+++ b/packages/ui/src/v2/components/tooltip-v2.css
@@ -55,3 +55,10 @@
     transform: scale(0.96);
   }
 }
+
+@media (prefers-reduced-motion: reduce) {
+  [data-component="tooltip-v2"],
+  [data-component="tooltip-v2"][data-closed] {
+    animation: none;
+  }
+}
diff --git a/packages/ui/src/v2/components/tooltip-v2.tsx b/packages/ui/src/v2/components/tooltip-v2.tsx
index ac9c5d06085..911307b6817 100644
--- a/packages/ui/src/v2/components/tooltip-v2.tsx
+++ b/packages/ui/src/v2/components/tooltip-v2.tsx
@@ -88,8 +88,9 @@ export function TooltipV2(props: TooltipV2Props) {
       <Match when={true}>
         <KobalteTooltip
           gutter={4}
+          openDelay={400}
+          skipDelayDuration={300}
           {...others}
-          openDelay={0}
           closeDelay={0}
           ignoreSafeArea={local.ignoreSafeArea ?? true}
           open={local.forceOpen || state.open}