Quail Incubator Monitor

\n \n\n\n",[],[150,204],"31aa924c-f5bc-11f0-bf42-42dde27851f2","IncubationStatus.tsx","31aa9314-f5bc-11f0-bf42-42dde27851f2","313093e8-f5bc-11f0-a7c1-42dde27851f2",13,["D",1768884908403],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\n\ninterface IncubationStatusData {\n currentDay: number;\n daysRemaining: number;\n phase: \"incubation\" | \"lockdown\" | \"hatching\" | \"complete\";\n lockdownDate: string;\n hatchDate: string;\n startDate: string;\n progressPercent: number;\n}\n\ninterface Props {\n status: IncubationStatusData;\n}\n\nexport function IncubationStatus({ status }: Props) {\n const phaseConfig = {\n incubation: { color: \"bg-blue-600\", label: \"Incubation\", emoji: \"🥚\" },\n lockdown: { color: \"bg-yellow-600\", label: \"Lockdown\", emoji: \"🔒\" },\n hatching: { color: \"bg-green-600\", label: \"Hatching\", emoji: \"🐣\" },\n complete: { color: \"bg-gray-600\", label: \"Complete\", emoji: \"✅\" },\n };\n\n const config = phaseConfig[status.phase];\n\n const formatDate = (dateStr: string) => {\n return new Date(dateStr).toLocaleDateString(\"en-US\", {\n weekday: \"short\",\n month: \"short\",\n day: \"numeric\",\n });\n };\n\n return (\n

Incubation Progress

\n\n {/* Day counter */}\n

\n Day {status.currentDay}\n / 17\n

\n \n {config.emoji} {config.label} Phase\n

\n\n {/* Progress bar */}\n

\n \n

\n\n {/* Key dates */}\n

Started

{formatDate(status.startDate)}

Lockdown

{formatDate(status.lockdownDate)}

Hatch

{formatDate(status.hatchDate)}

\n\n {/* Lockdown warning */}\n {status.phase === \"lockdown\" && (\n

\n 🔒 LOCKDOWN ACTIVE\n

\n Maintain 65-75% humidity. Do not open incubator.\n

\n )}\n\n {/* Countdown */}\n

\n {status.daysRemaining > 0 ? (\n <>\n \n {status.daysRemaining}\n {\" \"}\n day{status.daysRemaining !== 1 ? \"s\" : \"\"} until hatch!\n \n ) : status.phase === \"hatching\" ? (\n 🐣 Hatching time!\n ) : (\n Incubation complete\n )}\n

\n \n );\n}\n",[],[150,220,212],"components","31a61122-f5bc-11f0-aedd-42dde27851f2","DailyTips.tsx","31a61230-f5bc-11f0-aedd-42dde27851f2",12,["D",1768884908397],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\n\ninterface DailyTip {\n day: number;\n phase: string;\n tasks: string[];\n isSpecialDay: boolean;\n specialNote?: string;\n}\n\ninterface Props {\n tip: DailyTip;\n}\n\nexport function DailyTips({ tip }: Props) {\n const phaseColors: Record = {\n \"Pre-incubation\": \"border-gray-500\",\n Setup: \"border-blue-500\",\n \"Early Development\": \"border-blue-400\",\n \"Mid Development\": \"border-purple-500\",\n \"Late Development\": \"border-orange-500\",\n Lockdown: \"border-yellow-500\",\n \"Hatch Day\": \"border-green-500\",\n \"Post-Hatch\": \"border-green-400\",\n Complete: \"border-gray-500\",\n };\n\n const phaseEmojis: Record = {\n \"Pre-incubation\": \"⏳\",\n Setup: \"🔧\",\n \"Early Development\": \"🌱\",\n \"Mid Development\": \"📈\",\n \"Late Development\": \"🔍\",\n Lockdown: \"🔒\",\n \"Hatch Day\": \"🐣\",\n \"Post-Hatch\": \"🐤\",\n Complete: \"✅\",\n };\n\n const borderColor = phaseColors[tip.phase] || \"border-gray-500\";\n const emoji = phaseEmojis[tip.phase] || \"📋\";\n\n return (\n \n

\n {emoji} Today's Tasks\n {tip.isSpecialDay && (\n \n ⭐ Special Day\n \n )}\n

\n Day {tip.day} • {tip.phase} Phase\n

\n\n {/* Special note banner */}\n {tip.specialNote && (\n

{tip.specialNote}

\n )}\n\n {/* Task list */}\n

\n •\n \n {task}\n \n

\n\n {/* Quick tips based on phase */}\n {tip.phase === \"Lockdown\" && (\n

\n 💡 Tip: Add a wet sponge or extra water to increase\n humidity. Opening the incubator now can cause chicks to get\n stuck in their shells.\n

\n )}\n\n {tip.phase === \"Hatch Day\" && (\n

\n 💡 Tip: It can take 12-24 hours from first pip to\n full hatch. The struggle is necessary for the chick's development.\n Only intervene after 24+ hours if no progress is made.\n

\n )}\n \n );\n}\n",[],[150,220,222],"3199d010-f5bc-11f0-aedd-42dde27851f2","App.tsx","3199d0ce-f5bc-11f0-aedd-42dde27851f2",11,["D",1768884908306],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { Header } from \"./Header.tsx\";\nimport { CurrentReadings } from \"./CurrentReadings.tsx\";\nimport { IncubationStatus } from \"./IncubationStatus.tsx\";\nimport { DailyTips } from \"./DailyTips.tsx\";\nimport { HistoricalChart } from \"./HistoricalChart.tsx\";\nimport { AlertBanner } from \"./AlertBanner.tsx\";\n\n// Types matching backend\ninterface SensorReading {\n id: number;\n deviceEui: string;\n timestamp: string;\n temperatureC: number;\n temperatureF: number;\n humidity: number;\n batteryVoltage: number;\n rssi?: number;\n snr?: number;\n}\n\ninterface IncubationStatusData {\n currentDay: number;\n daysRemaining: number;\n phase: \"incubation\" | \"lockdown\" | \"hatching\" | \"complete\";\n lockdownDate: string;\n hatchDate: string;\n startDate: string;\n progressPercent: number;\n}\n\ninterface AlertThresholds {\n temperature: {\n current: number;\n status: \"critical-low\" | \"warning-low\" | \"ideal\" | \"warning-high\" | \"critical-high\";\n };\n humidity: {\n current: number;\n target: { min: number; max: number };\n status: \"low\" | \"ideal\" | \"high\";\n };\n}\n\ninterface DailyTip {\n day: number;\n phase: string;\n tasks: string[];\n isSpecialDay: boolean;\n specialNote?: string;\n}\n\ninterface DashboardData {\n currentReading: SensorReading | null;\n incubationStatus: IncubationStatusData;\n alerts: AlertThresholds | null;\n recentReadings: SensorReading[];\n dailyTip: DailyTip;\n}\n\ndeclare global {\n interface Window {\n __INITIAL_DATA__?: DashboardData;\n }\n}\n\nexport function App() {\n const [data, setData] = useState(\n window.__INITIAL_DATA__ || null\n );\n const [loading, setLoading] = useState(!window.__INITIAL_DATA__);\n const [lastUpdate, setLastUpdate] = useState(new Date());\n const [error, setError] = useState(null);\n\n // Fetch data on mount and every 60 seconds\n useEffect(() => {\n async function fetchData() {\n try {\n const [statusRes, readingsRes] = await Promise.all([\n fetch(\"/api/status\"),\n fetch(\"/api/readings?minutes=1440\"),\n ]);\n\n if (!statusRes.ok || !readingsRes.ok) {\n throw new Error(\"Failed to fetch data\");\n }\n\n const status = await statusRes.json();\n const recentReadings = await readingsRes.json();\n\n setData({\n ...status,\n recentReadings,\n });\n setLastUpdate(new Date());\n setError(null);\n } catch (err) {\n console.error(\"Failed to fetch data:\", err);\n setError(err instanceof Error ? err.message : \"Unknown error\");\n } finally {\n setLoading(false);\n }\n }\n\n if (!window.__INITIAL_DATA__) {\n fetchData();\n }\n\n const interval = setInterval(fetchData, 60000);\n return () => clearInterval(interval);\n }, []);\n\n if (loading) {\n return (\n

🥚

Loading incubator data...

\n );\n }\n\n if (error && !data) {\n return (\n

⚠️

Failed to load data

{error}

\n window.location.reload()}\n className=\"mt-4 px-4 py-2 bg-blue-600 rounded-lg hover:bg-blue-700 transition\"\n >\n Retry\n \n

\n );\n }\n\n if (!data) {\n return (\n

No data available

\n );\n }\n\n return (\n

\n\n {data.alerts && (\n \n )}\n\n

\n \n \n

\n\n

\n \n

\n\n \n\n \n

\n );\n}\n",[],[150,220,230],"31ae40e0-f5bc-11f0-9ddc-42dde27851f2","AlertBanner.tsx","31ae4180-f5bc-11f0-9ddc-42dde27851f2",14,["D",1768884908460],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\n\ninterface AlertThresholds {\n temperature: {\n current: number;\n status: \"critical-low\" | \"warning-low\" | \"ideal\" | \"warning-high\" | \"critical-high\";\n };\n humidity: {\n current: number;\n target: { min: number; max: number };\n status: \"low\" | \"ideal\" | \"high\";\n };\n}\n\ninterface Props {\n alerts: AlertThresholds;\n}\n\nexport function AlertBanner({ alerts }: Props) {\n const tempStatus = alerts.temperature.status;\n const isCritical = tempStatus === \"critical-low\" || tempStatus === \"critical-high\";\n const isWarning = tempStatus === \"warning-low\" || tempStatus === \"warning-high\";\n\n // Only show banner for non-ideal conditions\n if (tempStatus === \"ideal\") {\n return null;\n }\n\n const getMessage = () => {\n switch (tempStatus) {\n case \"critical-low\":\n return {\n icon: \"🚨\",\n title: \"CRITICAL: Temperature Too Low!\",\n message: `Temperature at ${alerts.temperature.current.toFixed(1)}°F is dangerously low. Embryo development at risk!`,\n action: \"Check heat source immediately.\",\n bgColor: \"bg-red-900/80\",\n borderColor: \"border-red-500\",\n };\n case \"critical-high\":\n return {\n icon: \"🚨\",\n title: \"CRITICAL: Temperature Too High!\",\n message: `Temperature at ${alerts.temperature.current.toFixed(1)}°F is dangerously high. Risk of embryo damage!`,\n action: \"Reduce heat or improve ventilation immediately.\",\n bgColor: \"bg-red-900/80\",\n borderColor: \"border-red-500\",\n };\n case \"warning-low\":\n return {\n icon: \"⚠️\",\n title: \"Warning: Temperature Low\",\n message: `Temperature at ${alerts.temperature.current.toFixed(1)}°F is below optimal range.`,\n action: \"Consider adjusting heat source.\",\n bgColor: \"bg-yellow-900/60\",\n borderColor: \"border-yellow-500\",\n };\n case \"warning-high\":\n return {\n icon: \"⚠️\",\n title: \"Warning: Temperature High\",\n message: `Temperature at ${alerts.temperature.current.toFixed(1)}°F is above optimal range.`,\n action: \"Consider improving ventilation.\",\n bgColor: \"bg-yellow-900/60\",\n borderColor: \"border-yellow-500\",\n };\n default:\n return null;\n }\n };\n\n const alert = getMessage();\n if (!alert) return null;\n\n return (\n \n

\n {alert.icon}\n

{alert.title}

{alert.message}

{alert.action}

\n \n );\n}\n",[],[150,220,238],"31309302-f5bc-11f0-a7c1-42dde27851f2",6,["D",1768884907625],[184,185,186,187],[150,220],["D",1768884906906],[183,188,189],[150],"317da3cc-f5bc-11f0-9ddc-42dde27851f2","services","317da458-f5bc-11f0-9ddc-42dde27851f2",9,["D",1768884908132],[],[156,254],"3163c358-f5bc-11f0-9a10-42dde27851f2","routes","3163c466-f5bc-11f0-9a10-42dde27851f2",8,["D",1768884907969],[],[156,261],"31492868-f5bc-11f0-9ddc-42dde27851f2","database","314929f8-f5bc-11f0-9ddc-42dde27851f2",7,["D",1768884907798],[],[156,268],["D",1768884907253],[179,180,181],[156],["D",1768884907128],[],[162],["D",1768883246417],["D",1789527031073],{"_98":97,"_105":101},{"_98":97,"_99":-5,"_100":101,"_18":53,"_102":103,"_104":24},{"_13":87,"_31":88,"_42":41,"_89":43,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":44,"_96":97},"ctx",{"_80":-5,"_125":318,"_319":320,"_321":322,"_323":24,"_324":24,"_325":24,"_326":57,"_327":-5,"_328":-7,"_329":-7,"_330":61,"_331":24,"_332":24,"_333":-5,"_334":24,"_335":24,"_336":24,"_337":-5},"ENV",{"_289":290,"_291":292,"_293":88,"_294":295,"_296":297,"_298":299,"_300":301,"_302":303,"_304":305,"_306":307,"_308":309,"_310":311,"_312":313,"_314":315,"_316":317},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v15