function MainComponent() { const [selectedFish, setSelectedFish] = useState("はまち"); const [date, setDate] = useState(new Date().toISOString().split("T")[0]); const [weatherData, setWeatherData] = useState(null); const [tideData, setTideData] = useState(null); const [seaTemp, setSeaTemp] = useState(null); useEffect(()=>{ const fetchData = async ()=>{ try { const [weather, tide, temp] = await Promise.all([ fetch("weather-api-endpoint").then((r)=>r.json()), fetch("tide-api-endpoint").then((r)=>r.json()), fetch("sea-temp-api-endpoint").then((r)=>r.json()) ]); setWeatherData(weather); setTideData(tide); setSeaTemp(temp); } catch (error) { console.error("データの取得に失敗しました"); } }; fetchData(); }, [ date ]); const openGoogleMaps = (lat, lng)=>{ window.open(`https://www.google.com/maps?q=${lat},${lng}`, "_blank"); }; const fishingSpots = { はまち: [ { name: "松島東沖", probability: "高", details: "潮の流れが速い場所で活発に活動", lat: 32.4873, lng: 130.4521 }, { name: "竹島周辺", probability: "中", details: "水深20-30mの場所がおすすめ", lat: 32.4982, lng: 130.4234 } ], カンパチ: [ { name: "大矢野島西岸", probability: "高", details: "岩礁帯付近で釣れやすい", lat: 32.5123, lng: 130.3876 }, { name: "御所浦島周辺", probability: "中", details: "水深30-40mの深場で狙える", lat: 32.4756, lng: 130.4102 } ], 鯛: [ { name: "龍ヶ岳町沿岸", probability: "高", details: "砂地と岩場の境目で釣れる", lat: 32.5234, lng: 130.4012 }, { name: "維和島周辺", probability: "中", details: "朝マズメがおすすめ", lat: 32.4891, lng: 130.3945 } ], ぶり: [ { name: "牛深沖", probability: "高", details: "冬場は特に活発に活動", lat: 32.4567, lng: 130.4321 }, { name: "永浦島周辺", probability: "中", details: "深場の潮目で狙える", lat: 32.4789, lng: 130.4123 } ] }; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#F0F8FF] min-h-screen p-4", __source: { fileName: "", lineNumber: 100, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-[#1E3A8A] text-white p-4 rounded-lg mb-6", __source: { fileName: "", lineNumber: 101, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-center", __source: { fileName: "", lineNumber: 102, columnNumber: 9 }, __self: this }, "上天草フィッシングスポット")), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg p-4 shadow-lg mb-6", __source: { fileName: "", lineNumber: 107, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 108, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-lg mb-2", __source: { fileName: "", lineNumber: 109, columnNumber: 11 }, __self: this }, "日付:"), /*#__PURE__*/ React.createElement("input", { type: "date", value: date, onChange: (e)=>setDate(e.target.value), className: "w-full p-2 border rounded text-lg", name: "date", __source: { fileName: "", lineNumber: 110, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 119, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-lg mb-2", __source: { fileName: "", lineNumber: 120, columnNumber: 11 }, __self: this }, "魚種:"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 121, columnNumber: 11 }, __self: this }, Object.keys(fishingSpots).map((fish)=>/*#__PURE__*/ React.createElement("div", { key: fish, className: "flex items-center", __source: { fileName: "", lineNumber: 123, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "radio", id: fish, name: "fish", value: fish, checked: selectedFish === fish, onChange: (e)=>setSelectedFish(e.target.value), className: "w-5 h-5", __source: { fileName: "", lineNumber: 124, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: fish, className: "ml-2 text-lg", __source: { fileName: "", lineNumber: 133, columnNumber: 17 }, __self: this }, fish))))), weatherData && tideData && seaTemp && /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4 rounded-lg mb-4", __source: { fileName: "", lineNumber: 142, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-bold mb-2", __source: { fileName: "", lineNumber: 143, columnNumber: 13 }, __self: this }, "現在の海況"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-2 text-sm", __source: { fileName: "", lineNumber: 144, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 145, columnNumber: 15 }, __self: this }, "風向き: ", weatherData.windDirection), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 146, columnNumber: 15 }, __self: this }, "風速: ", weatherData.windSpeed, "m/s"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 147, columnNumber: 15 }, __self: this }, "波高: ", weatherData.waveHeight, "m"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 148, columnNumber: 15 }, __self: this }, "水温: ", seaTemp.temperature, "°C"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 149, columnNumber: 15 }, __self: this }, "潮汐: ", tideData.status), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 150, columnNumber: 15 }, __self: this }, "潮の流れ: ", tideData.current)))), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg p-4 shadow-lg", __source: { fileName: "", lineNumber: 156, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold mb-4", __source: { fileName: "", lineNumber: 157, columnNumber: 9 }, __self: this }, "スポット詳細"), fishingSpots[selectedFish].map((spot, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "mb-4 p-4 border rounded-lg", __source: { fileName: "", lineNumber: 159, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-2", __source: { fileName: "", lineNumber: 160, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold", __source: { fileName: "", lineNumber: 161, columnNumber: 15 }, __self: this }, spot.name), /*#__PURE__*/ React.createElement("span", { className: `px-3 py-1 rounded ${spot.probability === "高" ? "bg-[#FF0000] text-white" : "bg-[#FFFF00]"}`, __source: { fileName: "", lineNumber: 162, columnNumber: 15 }, __self: this }, "釣果予測: ", spot.probability)), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-2", __source: { fileName: "", lineNumber: 172, columnNumber: 13 }, __self: this }, spot.details), /*#__PURE__*/ React.createElement("button", { onClick: ()=>openGoogleMaps(spot.lat, spot.lng), className: "w-full bg-blue-500 text-white p-2 rounded-lg flex items-center justify-center gap-2", __source: { fileName: "", lineNumber: 173, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-map-marker-alt", __source: { fileName: "", lineNumber: 177, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 178, columnNumber: 15 }, __self: this }, "緯度: ", spot.lat, "° / 経度: ", spot.lng, "°")))))); }