Update GeoMap.tsx

Author: hhftechnology

frontend/src/components/GeoMap.tsx

@@ -3,7 +3,6 @@ import { Globe } from "lucide-react";
 import { Stats } from "@/hooks/useWebSocket";
 import { ComposableMap, Geographies, Geography, ZoomableGroup } from "react-simple-maps";
 import { Tooltip as ReactTooltip } from "react-tooltip";
-import { useState } from "react";
 
 interface GeoMapProps {
   stats: Stats | null;
@@ -55,7 +54,6 @@ const countryCodeMap: Record<string, string> = {
 };
 
 export function GeoMap({ stats }: GeoMapProps) {
-  const [hoveredCountry, setHoveredCountry] = useState<string | null>(null);
   const hasCountryData = stats && stats.topCountries && stats.topCountries.length > 0;
 
   // Create a map of country names/codes to request counts
@@ -101,7 +99,6 @@ export function GeoMap({ stats }: GeoMapProps) {
         </CardDescription>
       </CardHeader>
       <CardContent>
-        {/* Use Tailwind classes for the container */}
         <div className="w-full h-[400px]">
           {!stats ? (
              <div className="h-full flex items-center justify-center text-muted-foreground">
@@ -124,7 +121,6 @@ export function GeoMap({ stats }: GeoMapProps) {
                   scale: 140,
                   center: [0, 20]
                 }}
-                // Add style to make the map responsive
                 style={{ width: '100%', height: '100%' }}
               >
                 <ZoomableGroup zoom={1} minZoom={0.5} maxZoom={8}>
@@ -143,8 +139,6 @@ export function GeoMap({ stats }: GeoMapProps) {
                           <Geography
                             key={geo.rsmKey}
                             geography={geo}
-                            onMouseEnter={() => setHoveredCountry(geo.rsmKey)}
-                            onMouseLeave={() => setHoveredCountry(null)}
                             data-tooltip-id="country-tooltip"
                             data-tooltip-content={`${geoName}: ${data.count.toLocaleString()} requests`}
                             style={{