From 80ead5f3a7743010cdab6ad84fa4dcbd4c021038 Mon Sep 17 00:00:00 2001
From: Julius Marminge <julius0216@outlook.com>
Date: Mon, 27 Jul 2026 20:28:01 +0200
Subject: [PATCH] Add glass styling for thread tooltips and simplify preview
 tab handling (#4665)

---
 apps/web/src/components/SidebarV2.tsx  | 7 ++-----
 apps/web/src/components/ui/tooltip.tsx | 7 ++++++-
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/apps/web/src/components/SidebarV2.tsx b/apps/web/src/components/SidebarV2.tsx
index a5f9eca5f4ae1ad1e049592c883daf1f0393de09..8677ee1149a17f1813ff2fa1731c095046b06769 100644
--- a/apps/web/src/components/SidebarV2.tsx
+++ b/apps/web/src/components/SidebarV2.tsx
@@ -239,11 +239,8 @@ function SidebarV2ThreadTooltip({
       side="right"
       align="start"
       sideOffset={8}
-      className="dropdown-glass max-w-80 border-0! text-left whitespace-normal shadow-lg/10 before:hidden dark:shadow-none"
-      style={{
-        background:
-          "color-mix(in srgb, var(--popover) 18%, color-mix(in srgb, var(--popover) var(--glass-opacity), transparent))",
-      }}
+      variant="glass"
+      className="max-w-80 text-left whitespace-normal"
     >
       <div className="flex max-w-80 flex-col gap-2 p-2">
         <div className="whitespace-nowrap text-sm font-medium text-foreground">{thread.title}</div>
diff --git a/apps/web/src/components/ui/tooltip.tsx b/apps/web/src/components/ui/tooltip.tsx
index 442c394ec220c204ab82aff6b76b3a2e4701e8a8..23c4a370ef9f506fe1857cd11d824b557e95a245 100644
--- a/apps/web/src/components/ui/tooltip.tsx
+++ b/apps/web/src/components/ui/tooltip.tsx
@@ -17,6 +17,7 @@ function TooltipPopup({
   align = "center",
   sideOffset = 4,
   side = "top",
+  variant = "default",
   anchor,
   children,
   ...props
@@ -24,6 +25,7 @@ function TooltipPopup({
   align?: TooltipPrimitive.Positioner.Props["align"];
   side?: TooltipPrimitive.Positioner.Props["side"];
   sideOffset?: TooltipPrimitive.Positioner.Props["sideOffset"];
+  variant?: "default" | "glass";
   anchor?: TooltipPrimitive.Positioner.Props["anchor"];
 }) {
   return (
@@ -38,7 +40,10 @@ function TooltipPopup({
       >
         <TooltipPrimitive.Popup
           className={cn(
-            "relative flex h-(--popup-height,auto) w-(--popup-width,auto) origin-(--transform-origin) text-balance rounded-md border bg-popover not-dark:bg-clip-padding text-popover-foreground text-xs shadow-md/5 transition-[width,height,scale,opacity] before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-md)-1px)] before:shadow-[0_1px_--theme(--color-black/4%)] data-ending-style:scale-98 data-starting-style:scale-98 data-ending-style:opacity-0 data-starting-style:opacity-0 data-instant:duration-0 dark:before:shadow-[0_-1px_--theme(--color-white/6%)]",
+            "relative flex h-(--popup-height,auto) w-(--popup-width,auto) origin-(--transform-origin) text-balance rounded-md text-popover-foreground text-xs transition-[width,height,scale,opacity] before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-md)-1px)] before:shadow-[0_1px_--theme(--color-black/4%)] data-ending-style:scale-98 data-starting-style:scale-98 data-ending-style:opacity-0 data-starting-style:opacity-0 data-instant:duration-0 dark:before:shadow-[0_-1px_--theme(--color-white/6%)]",
+            variant === "glass"
+              ? "dropdown-glass shadow-xl shadow-black/25 before:hidden"
+              : "border bg-popover not-dark:bg-clip-padding shadow-md/5",
             className,
           )}
           data-slot="tooltip-popup"
-- 
2.54.0