🔥 Sauna Dashboard Malfunction 🔥

Error Details

\n {this.state.error?.toString()}\n

\n \n );\n }\n\n return this.props.children;\n }\n}\n\nfunction App() {\n const [temperatureData, setTemperatureData] = useState({\n labels: [],\n datasets: [{\n label: \"Sauna Temperature (°F)\",\n data: [],\n borderColor: \"#FF6B35\",\n backgroundColor: \"rgba(255, 107, 53, 0.2)\",\n cubicInterpolationMode: \"monotone\", // Added to smooth the line\n }],\n });\n\n const [currentTemp, setCurrentTemp] = useState(null);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n async function fetchTemperatures() {\n try {\n const response = await fetch(\"/temperatures\");\n if (!response.ok) {\n throw new Error(`HTTP error! status: ${response.status}`);\n }\n const temps = await response.json();\n\n // Ensure temps is an array and has data\n if (Array.isArray(temps) && temps.length > 0) {\n // Reverse the order of temperatures to show oldest on the left\n const fahrenheitTemps = temps.reverse().map(t => celsiusToFahrenheit(t.temperature));\n\n setCurrentTemp(fahrenheitTemps[fahrenheitTemps.length - 1]);\n\n setTemperatureData({\n labels: temps.reverse().map(t => new Date(t.timestamp).toLocaleTimeString()),\n datasets: [{\n label: \"Sauna Temperature (°F)\",\n data: fahrenheitTemps,\n borderColor: \"#FF6B35\",\n backgroundColor: \"rgba(255, 107, 53, 0.2)\",\n cubicInterpolationMode: \"monotone\", // Added to smooth the line\n }],\n });\n } else {\n setError(new Error(\"No temperature data available\"));\n }\n } catch (error) {\n console.error(\"Failed to fetch temperatures:\", error);\n setError(error);\n }\n }\n\n fetchTemperatures();\n const interval = setInterval(fetchTemperatures, 60000);\n return () => clearInterval(interval);\n }, []);\n\n if (error) {\n return (\n \n

🌡️ Sauna Temperature Error

{error.message}

\n \n );\n }\n\n const tempStatus = currentTemp ? getTemperatureStatus(currentTemp) : { status: \"Loading...\", color: \"#FF6B35\" };\n\n return (\n \n \n \n 🔥 Sauna Dashboard\n \n\n \n \n

\n {currentTemp ? `${currentTemp.toFixed(1)}°F` : \"---\"}\n

\n {tempStatus.status}\n

\n \n \n\n \n Loading chart...}>\n \n \n \n\n \n \n View Source\n \n

\n \n \n );\n}\n\nfunction client() {\n try {\n const root = createRoot(document.getElementById(\"root\"));\n root.render(\n \n \n \n \n ,\n );\n } catch (error) {\n console.error(\"Client-side rendering error:\", error);\n }\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function server(request: Request): Promise {\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const KEY = \"saunaTemperatureDashboard\";\n const SCHEMA_VERSION = 1;\n\n // Create temperatures table if not exists\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_temperatures_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n temperature REAL NOT NULL,\n timestamp DATETIME DEFAULT CURRENT_TIMESTAMP,\n battery_voltage REAL,\n humidity REAL\n )\n `);\n\n // Handle temperature data ingestion\n if (request.method === \"POST\" && new URL(request.url).pathname === \"/ingest\") {\n const payload = await request.json();\n\n // Extract relevant temperature data\n const temperature = payload.object?.TempC_SHT;\n const batteryVoltage = payload.object?.BatV;\n const humidity = payload.object?.Hum_SHT;\n\n if (temperature) {\n await sqlite.execute(\n `\n INSERT INTO ${KEY}_temperatures_${SCHEMA_VERSION} \n (temperature, battery_voltage, humidity) \n VALUES (?, ?, ?)\n `,\n [temperature, batteryVoltage, humidity],\n );\n }\n\n return new Response(\"Temperature logged\", { status: 200 });\n }\n\n // Fetch temperatures for dashboard\n if (request.method === \"GET\" && new URL(request.url).pathname === \"/temperatures\") {\n const result = await sqlite.execute(`\n SELECT temperature, timestamp \n FROM ${KEY}_temperatures_${SCHEMA_VERSION} \n ORDER BY timestamp DESC \n LIMIT 50\n `);\n\n return new Response(JSON.stringify(result.rows), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n // Serve HTML for dashboard\n return new Response(\n `\n \n \n Sauna Temperature Dashboard\n \n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"Content-Type\": \"text/html\" },\n },\n );\n}","deleted","label",[98],"permalink","https://www.val.town/x/jhiller/saunaTemperatureDashboard/code/main.tsx","extension","actionData","errors"]