From 34aea7c9e2a9919a68ee50bbe83be283f9ef2884 Mon Sep 17 00:00:00 2001
From: Ryan Crabbe <ryan@berri.ai>
Date: Thu, 16 Apr 2026 11:59:40 -0700
Subject: [PATCH] Fix stale quick-select label after Reset Filters

Move selectedTimeInterval back to parent so handleFilterReset can
reset it to the 24-hour default. The toolbar receives it as a prop.
---
 .../src/components/view_logs/LogsTableToolbar.tsx         | 7 +++++--
 ui/litellm-dashboard/src/components/view_logs/index.tsx   | 8 ++++++++
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/view_logs/LogsTableToolbar.tsx b/ui/litellm-dashboard/src/components/view_logs/LogsTableToolbar.tsx
index 4c57ab85297..458ccef6cae 100644
--- a/ui/litellm-dashboard/src/components/view_logs/LogsTableToolbar.tsx
+++ b/ui/litellm-dashboard/src/components/view_logs/LogsTableToolbar.tsx
@@ -15,6 +15,8 @@ interface LogsTableToolbarProps {
   onEndTimeChange: (value: string) => void;
   isCustomDate: boolean;
   onIsCustomDateChange: (value: boolean) => void;
+  selectedTimeInterval: { value: number; unit: string };
+  onSelectedTimeIntervalChange: (value: { value: number; unit: string }) => void;
   isLiveTail: boolean;
   onIsLiveTailChange: (value: boolean) => void;
   currentPage: number;
@@ -35,6 +37,8 @@ export function LogsTableToolbar({
   onEndTimeChange,
   isCustomDate,
   onIsCustomDateChange,
+  selectedTimeInterval,
+  onSelectedTimeIntervalChange,
   isLiveTail,
   onIsLiveTailChange,
   currentPage,
@@ -46,7 +50,6 @@ export function LogsTableToolbar({
   filteredLogs,
 }: LogsTableToolbarProps) {
   const [quickSelectOpen, setQuickSelectOpen] = useState(false);
-  const [selectedTimeInterval, setSelectedTimeInterval] = useState<{ value: number; unit: string }>({ value: 24, unit: "hours" });
   const quickSelectRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
@@ -124,7 +127,7 @@ export function LogsTableToolbar({
                                 .subtract(option.value, option.unit as any)
                                 .format("YYYY-MM-DDTHH:mm"),
                             );
-                            setSelectedTimeInterval({ value: option.value, unit: option.unit });
+                            onSelectedTimeIntervalChange({ value: option.value, unit: option.unit });
                             onIsCustomDateChange(false);
                             setQuickSelectOpen(false);
                           }}
diff --git a/ui/litellm-dashboard/src/components/view_logs/index.tsx b/ui/litellm-dashboard/src/components/view_logs/index.tsx
index e0d327a2335..85eabd40b6f 100644
--- a/ui/litellm-dashboard/src/components/view_logs/index.tsx
+++ b/ui/litellm-dashboard/src/components/view_logs/index.tsx
@@ -59,6 +59,11 @@ export default function SpendLogsTable({
   const [sortOrder, setSortOrder] = useState<"asc" | "desc">("desc");
 
 
+  const [selectedTimeInterval, setSelectedTimeInterval] = useState<{ value: number; unit: string }>({
+    value: 24,
+    unit: "hours",
+  });
+
   const [isLiveTail, setIsLiveTail] = useState<boolean>(() => {
     const storedValue = sessionStorage.getItem("isLiveTail");
     // default to true if nothing is stored
@@ -124,6 +129,7 @@ export default function SpendLogsTable({
     setStartTime(moment().subtract(24, "hours").format("YYYY-MM-DDTHH:mm"));
     setEndTime(moment().format("YYYY-MM-DDTHH:mm"));
     setIsCustomDate(false);
+    setSelectedTimeInterval({ value: 24, unit: "hours" });
     setCurrentPage(1);
   }, [handleFilterResetFromHook]);
 
@@ -259,6 +265,8 @@ export default function SpendLogsTable({
                     onEndTimeChange={setEndTime}
                     isCustomDate={isCustomDate}
                     onIsCustomDateChange={setIsCustomDate}
+                    selectedTimeInterval={selectedTimeInterval}
+                    onSelectedTimeIntervalChange={setSelectedTimeInterval}
                     isLiveTail={isLiveTail}
                     onIsLiveTailChange={setIsLiveTail}
                     currentPage={currentPage}