feat: remove z, bound time range (#902)

Author: olzhik11

frontend/components/traces/traces-table/index.tsx

@@ -134,7 +134,6 @@ export default function TracesTable() {
 
       const isTopSpan = spanData.parentSpanId === null;
 
-
       if (existingTraceIndex !== -1) {
         // Update existing trace
         const newTraces = [...currentTraces];
@@ -148,8 +147,14 @@ export default function TracesTable() {
 
         newTraces[existingTraceIndex] = {
           ...existingTrace,
-          startTime: new Date(existingTrace.startTime).getTime() < new Date(spanData.startTime).getTime() ? existingTrace.startTime : spanData.startTime,
-          endTime: new Date(existingTrace.endTime).getTime() > new Date(spanData.endTime).getTime() ? existingTrace.endTime : spanData.endTime,
+          startTime:
+            new Date(existingTrace.startTime).getTime() < new Date(spanData.startTime).getTime()
+              ? existingTrace.startTime
+              : spanData.startTime,
+          endTime:
+            new Date(existingTrace.endTime).getTime() > new Date(spanData.endTime).getTime()
+              ? existingTrace.endTime
+              : spanData.endTime,
           totalTokens: existingTrace.totalTokens + spanInputTokens + spanOutputTokens,
           inputTokens: existingTrace.inputTokens + spanInputTokens,
           outputTokens: existingTrace.outputTokens + spanOutputTokens,
@@ -160,7 +165,9 @@ export default function TracesTable() {
           topSpanId: isTopSpan ? spanData.spanId : existingTrace.topSpanId,
           topSpanType: isTopSpan ? spanData.spanType : existingTrace.topSpanType,
           userId: spanData.attributes?.["lmnr.association.properties.user_id"] || existingTrace.userId,
-          tags: Array.from(new Set([...existingTrace.tags, ...(spanData.attributes?.["lmnr.association.properties.tags"] || [])])),
+          tags: Array.from(
+            new Set([...existingTrace.tags, ...(spanData.attributes?.["lmnr.association.properties.tags"] || [])])
+          ),
           status: existingTrace.status !== "error" ? spanData.status : existingTrace.status,
           sessionId: spanData.attributes?.["lmnr.association.properties.session_id"] || existingTrace.sessionId,
         };
@@ -174,10 +181,14 @@ export default function TracesTable() {
           sessionId: spanData.attributes?.["session.id"] || null,
           inputTokens: spanData.attributes?.["gen_ai.usage.input_tokens"] || 0,
           outputTokens: spanData.attributes?.["gen_ai.usage.output_tokens"] || 0,
-          totalTokens: (spanData.attributes?.["gen_ai.usage.input_tokens"] || 0) + (spanData.attributes?.["gen_ai.usage.output_tokens"] || 0),
+          totalTokens:
+            (spanData.attributes?.["gen_ai.usage.input_tokens"] || 0) +
+            (spanData.attributes?.["gen_ai.usage.output_tokens"] || 0),
           inputCost: spanData.attributes?.["gen_ai.usage.input_cost"] || 0,
           outputCost: spanData.attributes?.["gen_ai.usage.output_cost"] || 0,
-          totalCost: (spanData.attributes?.["gen_ai.usage.input_cost"] || 0) + (spanData.attributes?.["gen_ai.usage.output_cost"] || 0),
+          totalCost:
+            (spanData.attributes?.["gen_ai.usage.input_cost"] || 0) +
+            (spanData.attributes?.["gen_ai.usage.output_cost"] || 0),
           metadata: spanData.attributes?.["metadata"] || null,
           topSpanId: isTopSpan ? spanData.spanId : null,
           traceType: "DEFAULT",
@@ -205,7 +216,6 @@ export default function TracesTable() {
 
   // SSE connection for realtime updates
   useEffect(() => {
-
     // Disable realtime updates if there are filters or search
     if (filter.length > 0 || !!textSearchFilter) {
       return;

frontend/components/ui/date-range-filter.tsx

@@ -1,6 +1,6 @@
-'use client';
+"use client";
 
-import { formatDate } from "date-fns";
+import { formatDate, subYears } from "date-fns";
 import { CalendarIcon } from "lucide-react";
 import { usePathname, useRouter, useSearchParams } from "next/navigation";
 import { useEffect, useState } from "react";
@@ -9,7 +9,7 @@ import { DateRange as ReactDateRange } from "react-day-picker";
 import { cn } from "@/lib/utils";
 
 import { Button } from "./button";
-import { Calendar } from "./calendar";
+import { Calendar, CalendarProps } from "./calendar";
 import { Label } from "./label";
 import { Popover, PopoverContent, PopoverTrigger } from "./popover";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./select";
@@ -42,7 +42,11 @@ const RANGES: DateRange[] = [
   },
 ];
 
-function AbsoluteDateRangeFilter() {
+function AbsoluteDateRangeFilter({
+  disabled = { after: new Date(), before: subYears(new Date(), 1) },
+}: {
+  disabled?: CalendarProps["disabled"];
+}) {
   const searchParams = new URLSearchParams(useSearchParams().toString());
   const pathName = usePathname();
   const router = useRouter();
@@ -59,10 +63,10 @@ function AbsoluteDateRangeFilter() {
         urlFrom = new Date(searchParams.get("startDate") as string);
         setStartTime({
           hour: urlFrom.getHours().toString().padStart(2, "0"),
-          minute: urlFrom.getMinutes().toString().padStart(2, "0")
+          minute: urlFrom.getMinutes().toString().padStart(2, "0"),
         });
       }
-    } catch (e) { }
+    } catch (e) {}
 
     let urlTo: Date | undefined = undefined;
     try {
@@ -71,10 +75,10 @@ function AbsoluteDateRangeFilter() {
         urlTo = new Date(searchParams.get("endDate") as string);
         setEndTime({
           hour: urlTo.getHours().toString().padStart(2, "0"),
-          minute: urlTo.getMinutes().toString().padStart(2, "0")
+          minute: urlTo.getMinutes().toString().padStart(2, "0"),
         });
       }
-    } catch (e) { }
+    } catch (e) {}
 
     if (calendarDate === undefined || urlFrom === undefined || urlTo === undefined) {
       setCalendarDate({
@@ -143,7 +147,7 @@ function AbsoluteDateRangeFilter() {
             selected={calendarDate}
             onSelect={setCalendarDate}
             numberOfMonths={2}
-            disabled={{ after: new Date() }}
+            disabled={disabled}
             pagedNavigation
           />
           <div className="p-3">
@@ -252,8 +256,11 @@ function AbsoluteDateRangeFilter() {
     </div>
   );
 }
-
-export default function DateRangeFilter() {
+export default function DateRangeFilter({
+  disabled = { after: new Date(), before: subYears(new Date(), 1) },
+}: {
+  disabled?: CalendarProps["disabled"];
+}) {
   const searchParams = new URLSearchParams(useSearchParams().toString());
   const pathName = usePathname();
   const router = useRouter();
@@ -287,7 +294,7 @@ export default function DateRangeFilter() {
                 {range.name}
               </div>
             ))}
-            <AbsoluteDateRangeFilter />
+            <AbsoluteDateRangeFilter disabled={disabled} />
           </>
         }
       </div>

frontend/lib/actions/common/query-builder.ts

@@ -56,11 +56,11 @@ const buildTimeRangeConditions = (options: TimeRangeOptions): ConditionResult =>
 
   if (startTime) {
     const conditions: string[] = [`${timeColumn} >= {startTime:String}`];
-    const params: QueryParams = { startTime };
+    const params: QueryParams = { startTime: startTime.replace("Z", "") };
 
     if (endTime) {
       conditions.push(`${timeColumn} <= {endTime:String}`);
-      params.endTime = endTime;
+      params.endTime = endTime.replace("Z", "");
     } else {
       conditions.push(`${timeColumn} <= now()`);
     }