function MainComponent() { const [playerData, setPlayerData] = React.useState(null); React.useEffect(()=>{ async function fetchPlayerData() { try { const response = await fetch('/api/players-data'); const data = await response.json(); setPlayerData(data); } catch (error) { console.error('There was an error fetching the players data:', error); } } fetchPlayerData(); }, []); const handleScoreChange = (playerIndex, delta)=>{ setPlayerData((prevData)=>{ const newData = { ...prevData }; newData.players[playerIndex].points += delta; return newData; }); }; const renderPlayersList = ()=>{ if (!playerData) { return /*#__PURE__*/ React.createElement("div", { className: "text-center font-roboto", __source: { fileName: "", lineNumber: 26, columnNumber: 14 }, __self: this }, "Loading fantasy football data..."); } return playerData.players.map((player, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "flex flex-col md:flex-row justify-between items-center p-3 border-b border-white last:border-0", __source: { fileName: "", lineNumber: 29, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-roboto text-[#fafafa]", __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, player.name), /*#__PURE__*/ React.createElement("div", { className: "font-roboto text-[#fafafa]", __source: { fileName: "", lineNumber: 34, columnNumber: 9 }, __self: this }, player.position), /*#__PURE__*/ React.createElement("div", { className: "font-roboto text-[#fafafa]", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, player.team), /*#__PURE__*/ React.createElement("div", { className: "font-roboto text-green-400", __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }, player.goals), /*#__PURE__*/ React.createElement("div", { className: "font-roboto text-yellow-400", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }, player.assists), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 38, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "rounded-full bg-red-400 p-2 text-white font-roboto", onClick: ()=>handleScoreChange(index, -1), __source: { fileName: "", lineNumber: 39, columnNumber: 11 }, __self: this }, "−"), /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-[#fafafa]", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, player.points), /*#__PURE__*/ React.createElement("button", { className: "rounded-full bg-green-600 p-2 text-white font-roboto", onClick: ()=>handleScoreChange(index, 1), __source: { fileName: "", lineNumber: 46, columnNumber: 11 }, __self: this }, "+")))); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#0f172a]", __source: { fileName: "", lineNumber: 58, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl text-white font-bold font-roboto mb-8", __source: { fileName: "", lineNumber: 59, columnNumber: 7 }, __self: this }, "Fantasy Football Standings"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-3xl mx-auto overflow-hidden rounded-lg shadow-lg bg-[#1e293b] p-4", __source: { fileName: "", lineNumber: 62, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row justify-between items-center py-3 border-b border-white", __source: { fileName: "", lineNumber: 63, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-roboto font-bold text-[#fafafa]", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }, "Player"), /*#__PURE__*/ React.createElement("div", { className: "font-roboto font-bold text-[#fafafa]", __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this }, "Position"), /*#__PURE__*/ React.createElement("div", { className: "font-roboto font-bold text-[#fafafa]", __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, "Team"), /*#__PURE__*/ React.createElement("div", { className: "font-roboto font-bold text-[#fafafa]", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, "Goals"), /*#__PURE__*/ React.createElement("div", { className: "font-roboto font-bold text-[#fafafa]", __source: { fileName: "", lineNumber: 68, columnNumber: 11 }, __self: this }, "Assists"), /*#__PURE__*/ React.createElement("div", { className: "font-roboto font-bold text-[#fafafa]", __source: { fileName: "", lineNumber: 69, columnNumber: 11 }, __self: this }, "Points")), renderPlayersList())); }