/** @jsxImportSource https://esm.sh/react */ import React, { useState, useEffect } from "https://esm.sh/react"; import { createRoot } from "https://esm.sh/react-dom/client"; function App() { const [scores, setScores] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); useEffect(() => { fetchScores(); }, []); const fetchScores = async () => { try { const response = await fetch('/api/scores'); if (!response.ok) { throw new Error('Failed to fetch scores'); } const data = await response.json(); setScores(data); setLoading(false); } catch (err) { setError(err.message); setLoading(false); } }; if (loading) return

; if (error) return

Error: {error}

; return (

Current MLB Scores

{scores.length === 0 ? (

No games in progress.

) : (

{game.homeTeam} {game.homeScore} - {game.awayTeam} {game.awayScore} {game.status && ({game.status})}

)}

Data source: MLB Stats API |{" "} View source

); } function client() { createRoot(document.getElementById("root")).render(); } if (typeof document !== "undefined") { client(); } export default async function server(request: Request): Promise { const url = new URL(request.url); if (url.pathname === '/api/scores') { try { const mlbResponse = await fetch('https://statsapi.mlb.com/api/v1/schedule/games/?sportId=1'); const mlbData = await mlbResponse.json(); const scores = mlbData.dates[0]?.games.map(game => ({ homeTeam: game.teams.home.team.name, homeScore: game.teams.home.score, awayTeam: game.teams.away.team.name, awayScore: game.teams.away.score, status: game.status.detailedState })) || []; return new Response(JSON.stringify(scores), { headers: { 'Content-Type': 'application/json' } }); } catch (error) { return new Response(JSON.stringify({ error: 'Failed to fetch MLB scores' }), { status: 500, headers: { 'Content-Type': 'application/json' } }); } } return new Response(` MLB Scores

`, { headers: { 'Content-Type': 'text/html' } }); } const css = ` body { font-family: Arial, sans-serif; line-height: 1.6; color: #333; max-width: 800px; margin: 0 auto; padding: 20px; } h1 { color: #1a365d; } ul { list-style-type: none; padding: 0; } li { margin-bottom: 10px; padding: 10px; background-color: #f0f4f8; border-radius: 5px; } a { color: #2b6cb0; } `;

mlbScoreFetcher