import { useState } from “react”;
import {
BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend,
PieChart, Pie, Cell, ResponsiveContainer, RadarChart, Radar,
PolarGrid, PolarAngleAxis, PolarRadiusAxis, Treemap
} from “recharts”;

const COLORS = [“#C0392B”,”#E74C3C”,”#E67E22″,”#F39C12″,”#27AE60″,”#1ABC9C”,”#2980B9″,”#3498DB”,”#8E44AD”,”#9B59B6″,”#2C3E50″,”#7F8C8D”];

const rawData = [
{ name: “ส่งเสริมนโยบายรัฐบาล”, short: “นโยบายรัฐ”, original: 527280400, extra: 1116405304.07, total: 1643685704.07 },
{ name: “เจ้าภาพจัดการแข่งขันนานาชาติ”, short: “เจ้าภาพ”, original: 314056160, extra: 2000000, total: 316056160 },
{ name: “จัดการแข่งขันกีฬาอาชีพ”, short: “กีฬาอาชีพ”, original: 200000000, extra: 23989196, total: 223989196 },
{ name: “กำกับดูแลกีฬามวยไทย”, short: “มวยไทย”, original: 130000000, extra: 54920600, total: 184920600 },
{ name: “สร้างกระแสการแข่งขันกีฬา”, short: “สร้างกระแส”, original: 40000000, extra: 210000000, total: 250000000 },
{ name: “พัฒนานักกีฬาสู่ความเป็นเลิศ”, short: “นักกีฬาเลิศ”, original: 1028606008, extra: 7623937.32, total: 1036229945.32 },
{ name: “นำวิทยาศาสตร์การกีฬา”, short: “วิทย์กีฬา”, original: 161914919.85, extra: 1880250, total: 163795169.85 },
{ name: “ทุนการศึกษา”, short: “ทุนศึกษา”, original: 80000000, extra: 25497913.25, total: 105497913.25 },
{ name: “ระบบจัดสวัสดิการ”, short: “สวัสดิการ”, original: 30000000, extra: 0, total: 30000000 },
{ name: “สนับสนุนเงินรางวัล”, short: “เงินรางวัล”, original: 612802500, extra: 0, total: 612802500 },
{ name: “พัฒนาบุคลากรกีฬา”, short: “บุคลากร”, original: 57000000, extra: 958918.91, total: 57958918.91 },
{ name: “การบริหาร”, short: “บริหาร”, original: 164500000, extra: 30427414.68, total: 194927414.68 },
];

const grandTotal = 4819863522.08;
const originalTotal = 3346159987.85;
const extraTotal = 1473703534.23;

const fmt = (v) => {
if (v >= 1e9) return `${(v / 1e9).toFixed(2)}B`;
if (v >= 1e6) return `${(v / 1e6).toFixed(1)}M`;
return `${(v / 1e3).toFixed(0)}K`;
};

const fmtFull = (v) =>
v.toLocaleString(“th-TH”, { minimumFractionDigits: 2, maximumFractionDigits: 2 });

const overrunPct = (d) =>
d.original > 0 ? ((d.extra / d.original) * 100).toFixed(1) : “∞”;

const riskData = rawData.map((d) => ({
…d,
pct: ((d.total / grandTotal) * 100).toFixed(2),
overrun: parseFloat(overrunPct(d)),
riskLevel:
d.extra / d.original > 2 ? “สูงมาก” :
d.extra / d.original > 0.5 ? “สูง” :
d.extra / d.original > 0.1 ? “ปานกลาง” : “ต่ำ”,
riskColor:
d.extra / d.original > 2 ? “#C0392B” :
d.extra / d.original > 0.5 ? “#E67E22” :
d.extra / d.original > 0.1 ? “#F39C12” : “#27AE60”,
}));

const radarData = [
{ subject: “นโยบายรัฐ”, value: 34 },
{ subject: “นักกีฬาเลิศ”, value: 21 },
{ subject: “เงินรางวัล”, value: 13 },
{ subject: “เจ้าภาพ”, value: 7 },
{ subject: “สร้างกระแส”, value: 5 },
{ subject: “กีฬาอาชีพ”, value: 5 },
];

const CustomTooltip = ({ active, payload, label }) => {
if (!active || !payload?.length) return null;
return (

);
};

const PieTooltip = ({ active, payload }) => {
if (!active || !payload?.length) return null;
const d = payload[0];
return (

);
};

const MetricCard = ({ label, value, sub, accent, icon }) => (

);

const RiskBadge = ({ level, color }) => (
{level}
);

const TABS = [“ภาพรวม”, “การกระจายงบ”, “ความเสี่ยง”, “บทวิเคราะห์”];

export default function App() {
const [tab, setTab] = useState(0);

const pieData = rawData.map((d, i) => ({ name: d.short, value: d.total, fill: COLORS[i] }));

return (