add format function, updating from day to hour

app/api/metrics/latency/trace/route.ts

@@ -22,16 +22,13 @@ export async function GET(req: NextRequest) {
     }
 
     const traceService = new TraceService();
-    const totalTracesPerDay: any =
-      await traceService.GetTotalTracePerDayPerProject(
-        projectId,
-        7 // last 7 days
-      );
+    const totalTracesPerHour: any =
+      await traceService.GetTotalTracePerHourPerProject(projectId, 168); // last 7 days in hours
     const { averageLatencies, p99Latencies, p95Latencies } =
-      await traceService.GetAverageTraceLatenciesPerDayPerProject(projectId);
+      await traceService.GetAverageTraceLatenciesPerHourPerProject(projectId);
     return NextResponse.json(
       {
-        totalTracesPerDay,
+        totalTracesPerHour,
         averageLatencies,
         p99Latencies,
         p95Latencies,

app/api/metrics/usage/cost/route.ts

@@ -14,7 +14,7 @@ export async function GET(req: NextRequest) {
     const projectId = req.nextUrl.searchParams.get("projectId") as string;
     const traceService = new TraceService();
     const total = await traceService.GetTokensCostPerProject(projectId);
-    const cost = await traceService.GetTokensCostPerDayPerProject(projectId);
+    const cost = await traceService.GetTokensCostPerHourPerProject(projectId);
     return NextResponse.json(
       {
         cost,

app/api/metrics/usage/span/route.ts

@@ -22,7 +22,7 @@ export async function GET(req: NextRequest) {
     }
 
     const traceService = new TraceService();
-    const spans: any = await traceService.GetTotalSpansPerDayPerProject(
+    const spans: any = await traceService.GetTotalSpansPerHourPerProject(
       projectId,
       7 // last 7 days
     );

app/api/metrics/usage/token/route.ts

@@ -24,7 +24,7 @@ export async function GET(req: NextRequest) {
 
     const traceService = new TraceService();
     const total = await traceService.GetTokensUsedPerProject(projectId);
-    const usage = await traceService.GetTokensUsedPerDayPerProject(projectId);
+    const usage = await traceService.GetTokensUsedPerHourPerProject(projectId);
     return NextResponse.json(
       {
         usage,

app/api/metrics/usage/trace/route.ts

@@ -22,7 +22,7 @@ export async function GET(req: NextRequest) {
     }
 
     const traceService = new TraceService();
-    const traces: any = await traceService.GetTotalTracePerDayPerProject(
+    const traces: any = await traceService.GetTotalTracePerHourPerProject(
       projectId,
       7 // last 7 days
     );

components/charts/token-chart.tsx

@@ -5,7 +5,13 @@ import { useQuery } from "react-query";
 import { toast } from "sonner";
 import SmallChartLoading from "./small-chart-skeleton";
 
-export function TokenChart({ projectId }: { projectId: string }) {
+export function TokenChart({
+  projectId,
+  lastNHours = 168,
+}: {
+  projectId: string;
+  lastNHours?: number;
+}) {
   const {
     data: tokenUsage,
     isLoading: tokenUsageLoading,
@@ -14,7 +20,7 @@ export function TokenChart({ projectId }: { projectId: string }) {
     queryKey: [`fetch-metrics-usage-token-${projectId}-query`],
     queryFn: async () => {
       const response = await fetch(
-        `/api/metrics/usage/token?projectId=${projectId}`
+        `/api/metrics/usage/token?projectId=${projectId}&lastNHours=${lastNHours}`
       );
       if (!response.ok) {
         const error = await response.json();

lib/services/trace_service.ts

@@ -15,23 +15,23 @@ export interface PaginationResult<T> {
 }
 
 export interface ITraceService {
-  GetTotalTracePerDayPerProject: (
+  GetTotalTracePerHourPerProject: (
     project_id: string,
     lastNHours?: number
   ) => Promise<number>;
-  GetTotalSpansPerDayPerProject: (
+  GetTotalSpansPerHourPerProject: (
     project_id: string,
     lastNHours?: number
   ) => Promise<number>;
-  GetTokensUsedPerDayPerProject: (
+  GetTokensUsedPerHourPerProject: (
     project_id: string,
     lastNHours?: number
   ) => Promise<number>;
-  GetTokensCostPerDayPerProject: (
+  GetTokensCostPerHourPerProject: (
     project_id: string,
     lastNHours?: number
   ) => Promise<number>;
-  GetAverageTraceLatenciesPerDayPerProject(
+  GetAverageTraceLatenciesPerHourPerProject(
     project_id: string,
     lastNHours?: number
   ): Promise<any>;
@@ -171,7 +171,7 @@ export class TraceService implements ITraceService {
     }
   }
 
-  async GetTotalSpansPerDayPerProject(
+  async GetTotalSpansPerHourPerProject(
     project_id: string,
     lastNHours = 168
   ): Promise<any> {
@@ -223,7 +223,7 @@ export class TraceService implements ITraceService {
     }
   }
 
-  async GetTotalTracePerDayPerProject(
+  async GetTotalTracePerHourPerProject(
     project_id: string,
     lastNHours = 168
   ): Promise<any> {
@@ -492,7 +492,7 @@ export class TraceService implements ITraceService {
     }
   }
 
-  async GetAverageTraceLatenciesPerDayPerProject(
+  async GetAverageTraceLatenciesPerHourPerProject(
     project_id: string,
     lastNHours = 168
   ): Promise<any> {
@@ -581,7 +581,7 @@ export class TraceService implements ITraceService {
     }
   }
 
-  async GetTokensUsedPerDayPerProject(
+  async GetTokensUsedPerHourPerProject(
     project_id: string,
     lastNHours = 168
   ): Promise<any> {
@@ -611,7 +611,7 @@ export class TraceService implements ITraceService {
       const result = await this.client.find<any>(query);
 
       // calculate total tokens used per day
-      const tokensUsedPerDay = result.map((row: any) => {
+      const tokensUsedPerHour = result.map((row: any) => {
         let totalTokens = 0;
         let inputTokens = 0;
         let outputTokens = 0;
@@ -647,15 +647,15 @@ export class TraceService implements ITraceService {
         };
       });
 
-      return tokensUsedPerDay;
+      return tokensUsedPerHour;
     } catch (error) {
       throw new Error(
         `An error occurred while trying to get the tokens used ${error}`
       );
     }
   }
 
-  async GetTokensCostPerDayPerProject(
+  async GetTokensCostPerHourPerProject(
     project_id: string,
     lastNHours = 168 // Default to 168 hours (7 days)
   ): Promise<any> {
@@ -690,7 +690,7 @@ export class TraceService implements ITraceService {
       const result = await this.client.find<any>(query);
 
       // calculate total tokens used per day
-      const costPerDay = result.map((row: any) => {
+      const costPerHour = result.map((row: any) => {
         let costs = { total: 0, input: 0, output: 0 };
         row.attributes_list.forEach((attributes: any) => {
           const parsedAttributes = JSON.parse(attributes);
@@ -711,7 +711,7 @@ export class TraceService implements ITraceService {
         };
       });
 
-      return costPerDay;
+      return costPerHour;
     } catch (error) {
       throw new Error(
         `An error occurred while trying to get the tokens used ${error}`

lib/utils.ts

@@ -4,6 +4,7 @@ import { createHash, randomBytes } from "crypto";
 import { TiktokenEncoding, getEncoding } from "js-tiktoken";
 import { NextResponse } from "next/server";
 import { prettyPrintJson } from "pretty-print-json";
+import qs from "qs";
 import { twMerge } from "tailwind-merge";
 import { Span } from "./clients/scale3_clickhouse/models/span";
 import {
@@ -15,7 +16,6 @@ import {
   PERPLEXITY_PRICING,
   SpanStatusCode,
 } from "./constants";
-import qs from "qs";
 
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs));
@@ -280,14 +280,17 @@ export function prepareForClickhouse(spans: Normalized[]): Span[] {
   });
 }
 
-export function fillPromptStringTemplate(template: string, variables: { [key: string]: string }): string {
+export function fillPromptStringTemplate(
+  template: string,
+  variables: { [key: string]: string }
+): string {
   return template.replace(/\{(\w+)\}/g, (match, key) => {
-      return variables[key] || match;
+    return variables[key] || match;
   });
 }
 
 //TODO: Move to a middleware
-export function parseQueryString(url: string): Record<string, any>{
+export function parseQueryString(url: string): Record<string, any> {
   return qs.parse(url.split("?")[1], {
     decoder(str) {
       if (str === "true") return true;
@@ -461,3 +464,14 @@ export function calculateTokens(content: string): number {
     return estimateTokens(content); // Fallback method
   }
 }
+
+export function formatDurationForDisplay(hours: number): string {
+  if (hours === 12) {
+    return "Last 12 hours";
+  } else if (hours % 24 === 0) {
+    const days = hours / 24;
+    return `Last ${days} day${days > 1 ? "s" : ""}`;
+  } else {
+    return `Last ${hours} hours`;
+  }
+}