diff --git a/src/components/traffic-details-dialog.tsx b/src/components/traffic-details-dialog.tsx
index 3af58b6..6c98b90 100644
--- a/src/components/traffic-details-dialog.tsx
+++ b/src/components/traffic-details-dialog.tsx
@@ -11,6 +11,10 @@ import {
   XAxis,
   YAxis,
 } from "recharts";
+import type {
+  NameType,
+  ValueType,
+} from "recharts/types/component/DefaultTooltipContent";
 import type { TooltipContentProps } from "recharts/types/component/Tooltip";
 import {
   Dialog,
@@ -192,7 +196,7 @@ export function TrafficDetailsDialog({
 
   // Tooltip render function
   const renderTooltip = React.useCallback(
-    (props: TooltipContentProps<number, string>) => {
+    (props: TooltipContentProps<ValueType, NameType>) => {
       const { active, payload, label } = props;
       if (!active || !payload?.length) return null;
 
diff --git a/src/components/ui/chart.tsx b/src/components/ui/chart.tsx
index deca280..0f50bcd 100644
--- a/src/components/ui/chart.tsx
+++ b/src/components/ui/chart.tsx
@@ -6,7 +6,10 @@ import type {
   Props as DefaultLegendContentProps,
   LegendPayload,
 } from "recharts/types/component/DefaultLegendContent";
-import type { Payload } from "recharts/types/component/DefaultTooltipContent";
+import type {
+  NameType,
+  ValueType,
+} from "recharts/types/component/DefaultTooltipContent";
 import type { TooltipContentProps } from "recharts/types/component/Tooltip";
 
 import { cn } from "@/lib/utils";
@@ -111,7 +114,7 @@ const ChartTooltip = RechartsPrimitive.Tooltip;
 
 const ChartTooltipContent = React.forwardRef<
   HTMLDivElement,
-  TooltipContentProps<number, string> &
+  TooltipContentProps<ValueType, NameType> &
     React.ComponentProps<"div"> & {
       hideLabel?: boolean;
       hideIndicator?: boolean;
@@ -195,8 +198,8 @@ const ChartTooltipContent = React.forwardRef<
         {!nestLabel ? tooltipLabel : null}
         <div className="grid gap-1.5">
           {payload
-            .filter((item: Payload<number, string>) => item.type !== "none")
-            .map((item: Payload<number, string>, index: number) => {
+            .filter((item) => item.type !== "none")
+            .map((item, index) => {
               const key = `${nameKey || item.name || item.dataKey || "value"}`;
               const itemConfig = getPayloadConfigFromPayload(config, item, key);
               const indicatorColor = color || item.payload?.fill || item.color;