scriptoriumadmin/litellm
1
0
Fork 0
mirror of https://github.com/BerriAI/litellm.git synced 2026-09-16 23:41:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 103

fix(ui): distinguish failed log lookups from missing log details

Browse source 
Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
This commit is contained in:
milan 2026-07-24 22:39:34 +00:00
parent df013f6b77
commit a01504b270
3 changed files with 17 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
ui/litellm-dashboard/src/components/GuardrailsMonitor/LogViewer.tsx
View file

@ -74,7 +74,7 @@ export function LogViewer({
? moment(endDate).endOf("day").utc().format("YYYY-MM-DD HH:mm:ss")
: moment().utc().format("YYYY-MM-DD HH:mm:ss");
const { data: fullLogResponse, isFetching: isFetchingFullLog } = useQuery({
const { data: fullLogResponse, isFetching: isFetchingFullLog, isError: isFullLogError } = useQuery({
queryKey: ["spend-log-by-request", selectedRequestId, startTime, endTime],
queryFn: async () => {
if (!accessToken || !selectedRequestId) return null;
@ -198,6 +198,7 @@ export function LogViewer({
onClose={handleCloseDrawer}
logEntry={selectedLog}
logEntryLoading={isFetchingFullLog}
logEntryError={isFullLogError}
accessToken={accessToken}
allLogs={selectedLog ? [selectedLog] : []}
startTime={startTime}

9
ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/LogDetailsDrawer.test.tsx
View file

@ -125,7 +125,7 @@ describe("LogDetailsDrawer session sidebar sorting", () => {
});
describe("LogDetailsDrawer without a resolved log", () => {
const renderDrawer = (props: { logEntry: LogEntry | null; logEntryLoading?: boolean }) => {
const renderDrawer = (props: { logEntry: LogEntry | null; logEntryLoading?: boolean; logEntryError?: boolean }) => {
const queryClient = new QueryClient({ defaultOptions: { queries: { retry: false } } });
return render(
<QueryClientProvider client={queryClient}>
@ -140,6 +140,13 @@ describe("LogDetailsDrawer without a resolved log", () => {
expect(screen.getByText(/Log details are unavailable for this request/i)).toBeDefined();
});
it("blames the failed request rather than the date range when the lookup errored", () => {
renderDrawer({ logEntry: null, logEntryError: true });
expect(screen.getByText(/Loading the details for this request failed/i)).toBeDefined();
expect(screen.queryByText(/outside the selected date range/i)).toBeNull();
});
it("shows a spinner while the log is still being fetched", () => {
renderDrawer({ logEntry: null, logEntryLoading: true });

10
ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/LogDetailsDrawer.tsx
View file

@ -21,6 +21,7 @@ export interface LogDetailsDrawerProps {
onClose: () => void;
logEntry: LogEntry | null;
logEntryLoading?: boolean;
logEntryError?: boolean;
sessionId?: string | null;
accessToken?: string | null;
allLogs?: LogEntry[];
@ -114,6 +115,7 @@ export function LogDetailsDrawer({
onClose,
logEntry,
logEntryLoading = false,
logEntryError = false,
sessionId,
accessToken,
allLogs = [],
@ -126,7 +128,7 @@ export function LogDetailsDrawer({
const [isSidebarCollapsed, setIsSidebarCollapsed] = useState(false);
const [copiedLeftPanelId, setCopiedLeftPanelId] = useState(false);
const { data: sessionData, isFetching: isFetchingSession } = useQuery({
const { data: sessionData, isFetching: isFetchingSession, isError: isSessionError } = useQuery({
queryKey: ["sessionLogs", sessionId],
queryFn: async () => {
if (!sessionId || !accessToken) return { logs: [] as LogEntry[], total: 0 };
@ -298,6 +300,7 @@ export function LogDetailsDrawer({
if (!open) return null;
const isResolvingLog = isSessionMode ? isFetchingSession : logEntryLoading;
const lookupFailed = isSessionMode ? isSessionError : logEntryError;
return (
<Drawer
@ -316,8 +319,9 @@ export function LogDetailsDrawer({
<Spin />
) : (
<p className="text-sm text-slate-500 text-center px-6">
Log details are unavailable for this request. It may have been purged from the spend logs, or it falls
outside the selected date range.
{lookupFailed
? "Loading the details for this request failed. Check the proxy is reachable and try again."
: "Log details are unavailable for this request. It may have been purged from the spend logs, or it falls outside the selected date range."}
</p>
)}
</div>