From 672c41bdfbfdc344f85263c296e724469aba8652 Mon Sep 17 00:00:00 2001
From: Alan Buscaglia <gentlemanprogramming@gmail.com>
Date: Wed, 22 Oct 2025 12:35:27 +0200
Subject: [PATCH] refactor: revert threat-map select to native element

Reverted from shadcn Select back to native <select> element with custom
ChevronDown icon. Maintains full theme color support and functionality.
---
 ui/components/graphs/threat-map.tsx | 36 +++++++++++++----------------
 1 file changed, 16 insertions(+), 20 deletions(-)

diff --git a/ui/components/graphs/threat-map.tsx b/ui/components/graphs/threat-map.tsx
index 5ab2a62f66..6ce2036e47 100644
--- a/ui/components/graphs/threat-map.tsx
+++ b/ui/components/graphs/threat-map.tsx
@@ -7,7 +7,7 @@ import type {
   GeoJsonProperties,
   Geometry,
 } from "geojson";
-import { AlertTriangle, Info, MapPin } from "lucide-react";
+import { AlertTriangle, ChevronDown, Info, MapPin } from "lucide-react";
 import { useEffect, useRef, useState } from "react";
 import { feature } from "topojson-client";
 import type {
@@ -16,14 +16,6 @@ import type {
   Topology,
 } from "topojson-specification";
 
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from "@/components/shared/shadcn";
-
 import { HorizontalBarChart } from "./horizontal-bar-chart";
 import { BarDataPoint } from "./types";
 
@@ -413,26 +405,30 @@ export function ThreatMap({
           >
             Threat Map
           </h3>
-          <Select value={selectedRegion} onValueChange={setSelectedRegion}>
-            <SelectTrigger
-              className="w-full rounded-lg"
+          <div className="relative w-full max-w-xs">
+            <select
+              value={selectedRegion}
+              onChange={(e) => setSelectedRegion(e.target.value)}
+              className="appearance-none rounded-lg border px-4 py-2 pr-10 text-sm focus:outline-none"
               style={{
                 borderColor: CHART_COLORS.tooltipBorder,
                 backgroundColor: CHART_COLORS.tooltipBackground,
                 color: CHART_COLORS.textPrimary,
               }}
             >
-              <SelectValue placeholder="All Regions" />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value="All Regions">All Regions</SelectItem>
+              <option value="All Regions">All Regions</option>
               {data.regions.map((region) => (
-                <SelectItem key={region} value={region}>
+                <option key={region} value={region}>
                   {region}
-                </SelectItem>
+                </option>
               ))}
-            </SelectContent>
-          </Select>
+            </select>
+            <ChevronDown
+              size={16}
+              className="pointer-events-none absolute top-1/2 right-3 -translate-y-1/2"
+              style={{ color: CHART_COLORS.textSecondary }}
+            />
+          </div>
         </div>
 
         <div