function BasketballLiveSchedule({ league, games }) { const [isExpanded, setIsExpanded] = React.useState(false); const fetchGameDetails = async (game)=>{ const response = await fetch('/integrations/web-scraping/post', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ url: `https://example.com/games/${game.id}` }) }); const data = await response.text(); // Logic to update game details with scraped data }; return /*#__PURE__*/ React.createElement("div", { className: "bg-black text-white p-4 rounded-lg mb-3", __source: { fileName: "", lineNumber: 15, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-6", __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { className: "w-8 h-8 mr-2", src: `flags/${league.countryCode.toLowerCase()}.png`, alt: `${league.name} flag`, __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-2xl", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, league.name)), /*#__PURE__*/ React.createElement("i", { className: `fa fa-chevron-${isExpanded ? 'up' : 'down'} text-3xl cursor-pointer`, onClick: ()=>setIsExpanded(!isExpanded), __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this })), isExpanded && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, games.map((game)=>/*#__PURE__*/ React.createElement("div", { key: game.id, className: "mb-4 last:mb-0", __source: { fileName: "", lineNumber: 30, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-2", __source: { fileName: "", lineNumber: 31, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-lg", __source: { fileName: "", lineNumber: 32, columnNumber: 17 }, __self: this }, game.time), /*#__PURE__*/ React.createElement("i", { className: "fa fa-bell text-2xl cursor-pointer relative", onClick: ()=>fetchGameDetails(game), __source: { fileName: "", lineNumber: 33, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "absolute -top-10 -left-6 bg-white text-black text-xs px-2 py-1 rounded shadow-md", __source: { fileName: "", lineNumber: 34, columnNumber: 19 }, __self: this }, "Set odds alerts"))), /*#__PURE__*/ React.createElement("div", { className: "bg-[#191919] p-4 rounded-lg", __source: { fileName: "", lineNumber: 37, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 38, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("img", { className: "w-10 h-10 mr-2", src: game.homeTeamIcon, alt: `${game.homeTeam} logo`, __source: { fileName: "", lineNumber: 39, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-xl", __source: { fileName: "", lineNumber: 40, columnNumber: 19 }, __self: this }, game.homeTeam), /*#__PURE__*/ React.createElement("span", { className: `font-roboto text-xl px-3 py-1 rounded-md ${game.predictedWinner === 'home' ? 'bg-[#ccff00] animate-pulse' : 'bg-transparent'}`, __source: { fileName: "", lineNumber: 41, columnNumber: 19 }, __self: this }, game.homeRatio)), /*#__PURE__*/ React.createElement("div", { className: "border-b border-gray-700 my-2", __source: { fileName: "", lineNumber: 45, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 46, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("img", { className: "w-10 h-10 mr-2", src: game.awayTeamIcon, alt: `${game.awayTeam} logo`, __source: { fileName: "", lineNumber: 47, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-xl", __source: { fileName: "", lineNumber: 48, columnNumber: 19 }, __self: this }, game.awayTeam), /*#__PURE__*/ React.createElement("span", { className: `font-roboto text-xl px-3 py-1 rounded-md ${game.predictedWinner === 'away' ? 'bg-[#ccff00] animate-pulse' : 'bg-transparent'}`, __source: { fileName: "", lineNumber: 49, columnNumber: 19 }, __self: this }, game.awayRatio))))))); } function BasketballLiveScheduleStory() { const nbaGames = [ // ... Define all NBA games as seen in the screenshot with respective logos, times, and betting ratios { id: 1, time: '17:00', homeTeam: 'Magic', awayTeam: 'Hornets', homeTeamIcon: 'team-logos/magic.png', awayTeamIcon: 'team-logos/hornets.png', homeRatio: '60%', awayRatio: '40%', seasonAverageHigh: '115', seasonAverageLow: '95', cashRatio: '70%', predictedWinner: 'home' } ]; return /*#__PURE__*/ React.createElement("div", { className: "space-y-4 p-4 bg-black", __source: { fileName: "", lineNumber: 83, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(BasketballLiveSchedule, { league: { name: 'NBA', countryCode: 'US' }, games: nbaGames, __source: { fileName: "", lineNumber: 84, columnNumber: 7 }, __self: this })); } function MainComponent() { const events = [ { id: 1, time: "Today - 17:00", game: "Duke - NC State", odds1: "1.37", odds2: "2.83", moreMarkets: 33 }, { id: 2, time: "Today - 17:00", game: "Queens - Florida Gulf Coast", odds1: "2.33", odds2: "1.53", moreMarkets: 28 }, { id: 3, time: "Today - 17:00", game: "Jacksonville - Kennesaw St", odds1: "1.99", odds2: "1.72", moreMarkets: 30 } ]; const [qrCode, setQrCode] = React.useState(''); const [isNavbarExpanded, setIsNavbarExpanded] = React.useState(false); React.useEffect(()=>{ const encodedEvents = encodeURIComponent(events.map((event)=>`${event.time} ${event.game} - Odds: ${event.odds1} ${event.odds2}`).join("%0A")); fetch(`/integrations/qr-code/generatebasicbase64?data=${encodedEvents}&size=500`, { method: 'GET' }).then((response)=>response.text()).then((data)=>setQrCode(data)); }, []); const toggleNavbar = ()=>{ setIsNavbarExpanded(!isNavbarExpanded); }; return /*#__PURE__*/ React.createElement("div", { className: "w-full mx-auto bg-[#131316]", __source: { fileName: "", lineNumber: 46, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "fixed top-0 left-0 w-full bg-[#00000080] z-10 p-4 backdrop-blur-sm", __source: { fileName: "", lineNumber: 47, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-roboto font-bold text-xl text-white", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, "Walkoff"), /*#__PURE__*/ React.createElement("nav", { className: `${isNavbarExpanded ? 'flex' : 'hidden'} flex-col absolute inset-x-0 top-full mt-4 p-4 bg-black rounded-lg`, __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/sports", className: "text-white py-2", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, "Sports"), /*#__PURE__*/ React.createElement("a", { href: "/esports", className: "text-white py-2", __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this }, "Esports"), /*#__PURE__*/ React.createElement("a", { href: "/contests", className: "text-white py-2", __source: { fileName: "", lineNumber: 54, columnNumber: 13 }, __self: this }, "Contests"), /*#__PURE__*/ React.createElement("a", { href: "/funding", className: "text-white py-2", __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, "Funding"), /*#__PURE__*/ React.createElement("a", { href: "/games", className: "text-white py-2", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, "Games"), /*#__PURE__*/ React.createElement("a", { href: "/about", className: "text-white py-2", __source: { fileName: "", lineNumber: 57, columnNumber: 13 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("a", { href: "/docs", className: "text-white py-2", __source: { fileName: "", lineNumber: 58, columnNumber: 13 }, __self: this }, "Docs"), /*#__PURE__*/ React.createElement("a", { href: "/login", className: "text-blue-600 py-2", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }, "Sign Up / Log In")), /*#__PURE__*/ React.createElement("button", { onClick: toggleNavbar, className: "text-white", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-bars text-lg", __source: { fileName: "", lineNumber: 62, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "pt-20", __source: { fileName: "", lineNumber: 66, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement(BasketballLiveSchedule, { league: { name: 'NCAA', countryCode: 'US' }, games: events.map((event)=>({ id: event.id, time: event.time.split(" - ")[1], homeTeam: event.game.split(' - ')[0], awayTeam: event.game.split(' - ')[1], homeRatio: event.odds1, awayRatio: event.odds2, homeTeamIcon: `/team-logos/${event.game.split(' - ')[0].toLowerCase()}-logo.png`, awayTeamIcon: `/team-logos/${event.game.split(' - ')[1].toLowerCase()}-logo.png`, predictedWinner: 'home' })), __source: { fileName: "", lineNumber: 67, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center border-[6px] border-[#545454] rounded-lg my-4 p-4 bg-[#010101]", __source: { fileName: "", lineNumber: 81, columnNumber: 9 }, __self: this }, qrCode ? /*#__PURE__*/ React.createElement("img", { src: `data:image/png;base64,${qrCode}`, alt: "Event QR code", className: "w-[120px] h-[120px]", __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }) : /*#__PURE__*/ React.createElement("span", { className: "text-white", __source: { fileName: "", lineNumber: 85, columnNumber: 13 }, __self: this }, "Generating QR code..."))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 89, columnNumber: 7 }, __self: this }, ` @keyframes heartbeat { 0%, 100% { transform: scale(1); } 25% { transform: scale(.95); } 50% { transform: scale(1.1); } 75% { transform: scale(.95); } } @keyframes shadow-pulse { 0%, 100% { box-shadow: 0 0 10px rgba(255, 215, 0, 0.3);} 50% { box-shadow: 0 0 20px rgba(255, 215, 0, 0.7); } } `)); }