diff --git a/client/app/admin/page.tsx b/client/app/admin/page.tsx
index 9c33aa8a..f5977a46 100644
--- a/client/app/admin/page.tsx
+++ b/client/app/admin/page.tsx
@@ -4,7 +4,7 @@ import React from 'react';
 import dayjs from 'dayjs';
 import { Column } from '@ant-design/charts';
 import { Card, Progress } from '@nextui-org/react';
-import { useAnalyze, useTopBots, useTopUsers } from '../hooks/useAnalyze';
+import { BotUsage, useAnalyze, useTopBots, useTopUsers } from '../hooks/useAnalyze';
 import { maxBy, sortBy } from 'lodash';
 
 export default function AdminPage() {
@@ -13,7 +13,7 @@ export default function AdminPage() {
   const { data: topUsers = [] } = useTopUsers();
 
   const chartProps = {
-    xField: d => new Date(d.usage_date),
+    xField: (d: BotUsage) => new Date(d.usage_date),
     colorField: 'bot_name',
     height: 400,
     stack: true,
@@ -22,7 +22,7 @@ export default function AdminPage() {
     scale: { color: { palette: 'tableau10' }},
     axis: {
       x: {
-        labelFormatter: x => dayjs(x).format('MM-DD'),
+        labelFormatter: (x: string) => dayjs(x).format('MM-DD'),
       }
     },
   }
diff --git a/client/app/hooks/useAnalyze.ts b/client/app/hooks/useAnalyze.ts
index 372fdbe4..5b46cf9d 100644
--- a/client/app/hooks/useAnalyze.ts
+++ b/client/app/hooks/useAnalyze.ts
@@ -1,6 +1,11 @@
 import { useQuery } from '@tanstack/react-query';
 import { analyzeTokenUsage, analyzeTopBots, analyzeTopUsers } from '../services/TokensController';
 
+export interface BotUsage {
+  bot_name: string;
+  total_tokens: number;
+  usage_date: Date;
+}
 
 export function useAnalyze() {
   return useQuery({
@@ -11,7 +16,7 @@ export function useAnalyze() {
 }
 
 export function useTopBots() {
-  return useQuery<{ bot_name: string; total_tokens: number;}[]>({
+  return useQuery<BotUsage[]>({
     queryKey: [`usage.top.bots`],
     queryFn: async () => analyzeTopBots(),
     retry: false,