function MainComponent() { const [selectedSport, setSelectedSport] = React.useState('NFL'); const [games, setGames] = React.useState([]); const [betSlip, setBetSlip] = React.useState([]); React.useEffect(()=>{ updateScoreboard(); const interval = setInterval(updateScoreboard, 30000); return ()=>clearInterval(interval); }, [ selectedSport ]); const fetchSportsData = async ()=>{ const mockData = { NFL: [ { homeTeam: "Chicago Cubs", awayTeam: "Cincinnati Reds", homeScore: 24, awayScore: 21, gameTime: "Top 3rd", odds: { spread: { home: -2.5, away: +2.5 }, moneyLine: { home: 1.29, away: 3.55 }, total: { over: 10.5, under: 10.5 } } }, { homeTeam: "Pittsburgh Pirates", awayTeam: "Houston Astros", homeScore: 17, awayScore: 14, gameTime: "5:11 PM MST", odds: { spread: { home: +1.5, away: -1.5 }, moneyLine: { home: 2.88, away: 1.44 }, total: { over: 8.5, under: 8.5 } } } ] }; return mockData[selectedSport]; }; const updateScoreboard = async ()=>{ const data = await fetchSportsData(); setGames(data); }; const handleBetClick = (game, betType, team)=>{ const bet = { game, betType, team, odds: game.odds[betType][team] }; setBetSlip([ ...betSlip, bet ]); }; const sports = [ 'NFL', 'NBA', 'MLB', 'NHL' ]; return /*#__PURE__*/ React.createElement("div", { className: "font-sans bg-gray-900 text-white min-h-screen p-4", __source: { fileName: "", lineNumber: 62, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 63, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gray-800 shadow-lg rounded-lg overflow-hidden", __source: { fileName: "", lineNumber: 64, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gray-700 p-4", __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex space-x-2 overflow-x-auto", __source: { fileName: "", lineNumber: 66, columnNumber: 13 }, __self: this }, sports.map((sport)=>/*#__PURE__*/ React.createElement("button", { key: sport, className: `px-4 py-2 rounded-full text-sm font-semibold ${selectedSport === sport ? 'bg-blue-500 text-white' : 'bg-gray-600 text-gray-300'}`, onClick: ()=>setSelectedSport(sport), __source: { fileName: "", lineNumber: 68, columnNumber: 17 }, __self: this }, sport)))), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 80, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm font-bold text-gray-300 border-b border-gray-700 pb-2 mb-2", __source: { fileName: "", lineNumber: 81, columnNumber: 13 }, __self: this }, "MLB Odds"), games.map((game, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "mb-4 bg-gray-800 rounded-lg", __source: { fileName: "", lineNumber: 83, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 border-b border-gray-700", __source: { fileName: "", lineNumber: 84, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 85, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 86, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-gray-400 text-xs", __source: { fileName: "", lineNumber: 87, columnNumber: 23 }, __self: this }, game.gameTime), /*#__PURE__*/ React.createElement("div", { className: "ml-4", __source: { fileName: "", lineNumber: 88, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold", __source: { fileName: "", lineNumber: 89, columnNumber: 25 }, __self: this }, game.homeTeam), /*#__PURE__*/ React.createElement("div", { className: "text-gray-400", __source: { fileName: "", lineNumber: 90, columnNumber: 25 }, __self: this }, "vs ", game.awayTeam))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 93, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-right", __source: { fileName: "", lineNumber: 94, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-gray-400", __source: { fileName: "", lineNumber: 95, columnNumber: 25 }, __self: this }, "Spread"), /*#__PURE__*/ React.createElement("div", { className: "font-bold", __source: { fileName: "", lineNumber: 96, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 97, columnNumber: 27 }, __self: this }, game.odds.spread.home), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleBetClick(game, 'spread', 'home'), className: "ml-2 px-2 py-1 bg-blue-500 rounded text-white hover:bg-blue-600", __source: { fileName: "", lineNumber: 98, columnNumber: 27 }, __self: this }, game.odds.spread.home > 0 ? `+${game.odds.spread.home}` : game.odds.spread.home))), /*#__PURE__*/ React.createElement("div", { className: "text-right ml-4", __source: { fileName: "", lineNumber: 106, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-gray-400", __source: { fileName: "", lineNumber: 107, columnNumber: 25 }, __self: this }, "Money Line"), /*#__PURE__*/ React.createElement("div", { className: "font-bold", __source: { fileName: "", lineNumber: 108, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleBetClick(game, 'moneyLine', 'home'), className: "px-2 py-1 bg-blue-500 rounded text-white hover:bg-blue-600", __source: { fileName: "", lineNumber: 109, columnNumber: 27 }, __self: this }, game.odds.moneyLine.home))), /*#__PURE__*/ React.createElement("div", { className: "text-right ml-4", __source: { fileName: "", lineNumber: 117, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-gray-400", __source: { fileName: "", lineNumber: 118, columnNumber: 25 }, __self: this }, "Total"), /*#__PURE__*/ React.createElement("div", { className: "font-bold", __source: { fileName: "", lineNumber: 119, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleBetClick(game, 'total', 'over'), className: "px-2 py-1 bg-blue-500 rounded text-white hover:bg-blue-600", __source: { fileName: "", lineNumber: 120, columnNumber: 27 }, __self: this }, "O ", game.odds.total.over)), /*#__PURE__*/ React.createElement("div", { className: "font-bold", __source: { fileName: "", lineNumber: 127, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleBetClick(game, 'total', 'under'), className: "px-2 py-1 bg-blue-500 rounded text-white hover:bg-blue-600", __source: { fileName: "", lineNumber: 128, columnNumber: 27 }, __self: this }, "U ", game.odds.total.under)))))), /*#__PURE__*/ React.createElement("div", { className: "p-4 flex justify-between items-center", __source: { fileName: "", lineNumber: 139, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 140, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gray-700 p-2 rounded-full text-xs text-gray-400", __source: { fileName: "", lineNumber: 141, columnNumber: 21 }, __self: this }, "LIVE")), /*#__PURE__*/ React.createElement("div", { className: "text-gray-400 text-xs", __source: { fileName: "", lineNumber: 143, columnNumber: 19 }, __self: this }, "More wagers available")))))), /*#__PURE__*/ React.createElement("div", { className: "mt-4 bg-gray-800 rounded-lg p-4", __source: { fileName: "", lineNumber: 149, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold mb-2", __source: { fileName: "", lineNumber: 150, columnNumber: 11 }, __self: this }, "Betslip"), betSlip.length === 0 ? /*#__PURE__*/ React.createElement("div", { className: "text-gray-400", __source: { fileName: "", lineNumber: 152, columnNumber: 13 }, __self: this }, "Betslip empty. Add selections to place a bet.") : /*#__PURE__*/ React.createElement("ul", { className: "list-disc pl-5", __source: { fileName: "", lineNumber: 154, columnNumber: 13 }, __self: this }, betSlip.map((bet, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "text-gray-200 mb-1", __source: { fileName: "", lineNumber: 156, columnNumber: 17 }, __self: this }, bet.game.homeTeam, " vs ", bet.game.awayTeam, " - ", bet.betType, " (", bet.team, "): ", bet.odds)))))); }