Back
Version 2
12/27/2024
/** @jsxImportSource https://esm.sh/react@18.2.0 */
import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";
import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
function App() {
const [location, setLocation] = useState("");
const [weather, setWeather] = useState("");
const [tackleBox, setTackleBox] = useState([]);
const [recommendation, setRecommendation] = useState("");
useEffect(() => {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(position => {
const { latitude, longitude } = position.coords;
setLocation(`${latitude.toFixed(4)}, ${longitude.toFixed(4)}`);
fetchWeather(latitude, longitude);
}, () => {
setLocation("Location not available");
});
}
loadTackleBox();
}, []);
const fetchWeather = async (latitude, longitude) => {
try {
const response = await fetch(`https://api.open-meteo.com/v1/forecast?latitude=${latitude}&longitude=${longitude}¤t_weather=true`);
const data = await response.json();
setWeather(`${data.current_weather.temperature}°C, ${getWeatherDescription(data.current_weather.weathercode)}`);
} catch (error) {
console.error("Error fetching weather:", error);
setWeather("Weather data unavailable");
}
};
const getWeatherDescription = (code) => {
const weatherCodes = {
toowired-cerebras_coder.web.val.run
Updated: January 2, 2025