From 773bfef066efe035e2ffe1c4227d99722ade314b Mon Sep 17 00:00:00 2001
From: Yujong Lee <yujong@berri.ai>
Date: Sun, 4 Oct 2026 16:32:10 -0700
Subject: [PATCH] fix(ui): keep the time range menu flush after the move to
 shared

The move carried a copy from before the menu alignment fixes landed on
this branch; this restores the trigger width and the flush menu edge.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 .../shared/timeRange/TimeRangeControls.tsx           | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/shared/timeRange/TimeRangeControls.tsx b/ui/litellm-dashboard/src/components/shared/timeRange/TimeRangeControls.tsx
index de55f929dd1..cf8aaa0e15d 100644
--- a/ui/litellm-dashboard/src/components/shared/timeRange/TimeRangeControls.tsx
+++ b/ui/litellm-dashboard/src/components/shared/timeRange/TimeRangeControls.tsx
@@ -36,20 +36,26 @@ interface TimeRangeControlsProps {
 }
 
 /** Joined control group: the time range (opens presets) and Live. */
-export function TimeRangeControls({ range, zoom, onHoursChange, showLive = true, onLiveChange }: TimeRangeControlsProps) {
+export function TimeRangeControls({
+  range,
+  zoom,
+  onHoursChange,
+  showLive = true,
+  onLiveChange,
+}: TimeRangeControlsProps) {
   const live = isLive(range);
   return (
     <div className="flex items-stretch divide-x divide-border border-l border-border">
       <DropdownMenu>
         <DropdownMenuTrigger
           aria-label="Time range"
-          className={cn(SEGMENT, "text-foreground hover:bg-muted/60")}
+          className={cn(SEGMENT, "min-w-40 justify-between text-foreground hover:bg-muted/60")}
           data-testid="time-range-trigger"
         >
           <span className="tabular-nums">{rangeLabel(range, zoom)}</span>
           <ChevronDown className="size-3.5 text-muted-foreground" />
         </DropdownMenuTrigger>
-        <DropdownMenuContent align="end" className="w-auto min-w-44">
+        <DropdownMenuContent align="end" sideOffset={1} className="min-w-0 rounded-t-none">
           <DropdownMenuRadioGroup
             value={String(range.hours)}
             onValueChange={(value: string) => onHoursChange(Number(value))}