\n \n \n\n\n",[],[75,110],"77377e30-5537-11f1-9f28-ee650bb23af1","App.tsx","78d24f4c-5535-11f1-ad2c-ee650bb23af1",12,["D",1779383213650],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\n\ninterface BirdResult {\n identified: boolean;\n name?: string;\n confidence?: string;\n reasoning?: string;\n info?: {\n name: string;\n scientificName: string;\n family: string;\n habitat: string;\n diet: string;\n funFact: string;\n migrationPattern: string;\n migrationMonths: { spring: string; fall: string };\n conservationStatus: string;\n song: string;\n range: string;\n };\n migration?: string;\n inDatabase?: boolean;\n}\n\nexport function App() {\n const [image, setImage] = useState(null);\n const [imagePreview, setImagePreview] = useState(null);\n const [description, setDescription] = useState(\"\");\n const [zipCode, setZipCode] = useState(\"\");\n const [result, setResult] = useState(null);\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n const fileInputRef = useRef(null);\n\n const handleImageChange = (e: React.ChangeEvent) => {\n const file = e.target.files?.[0];\n if (file) {\n setImage(file);\n const reader = new FileReader();\n reader.onload = (ev) => setImagePreview(ev.target?.result as string);\n reader.readAsDataURL(file);\n }\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n if (!image && !description.trim()) {\n setError(\"Please upload a photo or describe the bird/sound you heard.\");\n return;\n }\n\n setLoading(true);\n setError(null);\n setResult(null);\n\n const formData = new FormData();\n if (image) formData.append(\"image\", image);\n if (description.trim()) formData.append(\"description\", description.trim());\n if (zipCode.trim()) formData.append(\"zipCode\", zipCode.trim());\n\n try {\n const resp = await fetch(\"/api/identify\", { method: \"POST\", body: formData });\n const data = await resp.json();\n if (!resp.ok) {\n setError(data.error || \"Something went wrong\");\n } else {\n setResult(data);\n }\n } catch (err) {\n setError(\"Network error — please try again.\");\n } finally {\n setLoading(false);\n }\n };\n\n const reset = () => {\n setImage(null);\n setImagePreview(null);\n setDescription(\"\");\n setResult(null);\n setError(null);\n if (fileInputRef.current) fileInputRef.current.value = \"\";\n };\n\n return (\n

\n {/* Header */}\n

🐦

Bird Identifier

\n Upload a photo or describe a bird & its sounds — I'll tell you what it is and when it visits your area!\n

\n\n {/* Input Form */}\n {!result && (\n

\n\n {/* Description */}\n

\n \n 🎵 Describe the Bird or Its Sound\n \n setDescription(e.target.value)}\n placeholder=\"e.g., 'Small bright red bird with a crest, singing a loud whistle' or 'I heard a cheerily-cheerio song on my lawn at dawn'\"\n className=\"w-full border border-gray-300 rounded-xl p-3 h-24 resize-none focus:ring-2 focus:ring-sky-400 focus:border-sky-400 outline-none\"\n />\n

\n\n {/* Zip Code */}\n

\n 📍 Your Zip Code (for migration info)\n setZipCode(e.target.value.replace(/\\D/g, \"\").slice(0, 5))}\n placeholder=\"e.g., 10001\"\n className=\"w-full border border-gray-300 rounded-xl p-3 focus:ring-2 focus:ring-sky-400 focus:border-sky-400 outline-none\"\n maxLength={5}\n />\n

\n\n {error && (\n

\n ⚠️ {error}\n

\n )}\n\n \n {loading\n ? (\n \n 🔍 Identifying...\n \n )\n : \"🔍 Identify This Bird\"}\n \n \n )}\n\n {/* Results */}\n {result && (\n

\n {result.identified\n ? (\n <>\n {/* Bird Name Card */}\n

🐦

{result.name}

\n {result.info && (\n

{result.info.scientificName}

\n )}\n

\n \n {result.confidence === \"high\" ? \"✅\" : result.confidence === \"medium\" ? \"🟡\" : \"🟠\"}{\" \"}\n {result.confidence} confidence\n \n

{result.reasoning}

\n\n {/* Preview of uploaded image */}\n {imagePreview && (\n

\n $\"Your$ \n

\n )}\n\n {/* Bird Info */}\n {result.info && (\n

📚 About This Bird

\n \n \n \n \n \n \n

\n 💡 Fun Fact: {result.info.funFact}\n

\n )}\n\n {/* Migration Info */}\n {result.migration && (\n

🗺️ Migration Info

\n {result.migration.split(\"**\").map((part, i) =>\n i % 2 === 1 ? {part} : {part}\n )}\n

\n )}\n\n {!result.inDatabase && (\n

\n ℹ️ Detailed species data isn't in our database yet for this bird.\n We identified it using AI — try common North American species for the full experience!\n

\n )}\n \n )\n : (\n

🤔

Couldn't Identify

{result.reasoning}

\n )}\n\n {/* Try Again */}\n \n 🔄 Identify Another Bird\n \n

\n )}\n\n {/* Footer */}\n

Tip: Add an OPENAI_API_KEY env var for AI-powered photo identification

\n View Source\n

\n \n );\n}\n\nfunction InfoItem({ icon, label, value }: { icon: string; label: string; value: string }) {\n return (\n

\n {icon}\n

{label}

{value}

\n );\n}\n",[],[75,119],"3a0ebcbe-5535-11f1-a99b-ee650bb23af1",["D",1779382252086],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Identify birds from photos/sounds and see migration info","imageUrl","userId","5c5a0b7c-5221-42cd-b538-44db01292c62","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","orgId","019e4b70-43f7-759e-85f8-67a6e85ed368","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_178":-5},"org",{"_11":12,"_173":12,"_174":-5,"_136":-5,"_175":176,"_177":56},"branch",{"_17":45,"_13":16,"_36":43,"_165":126,"_166":-5,"_167":-5,"_168":-5,"_169":-5,"_170":-5,"_171":14,"_172":12},"isOwned","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","avatar","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_36":126,"_13":14,"_48":235,"_128":-5,"_129":56,"_130":131,"_132":131,"_133":134,"_135":-5,"_136":137,"_138":40,"_139":47,"_140":-5,"_141":-5,"_142":63,"_143":144,"_145":-5,"_146":-5,"_147":-5,"_148":-5,"_149":150,"_151":150,"_152":153,"_154":153,"_155":153,"_156":150,"_157":150,"_158":236,"_160":237,"_162":238,"_164":56},[214,218,219,220],"files",[214,215,216,217,218,219,220],"counts",{"_205":63,"_206":50,"_207":63,"_31":208,"_209":210},[197,198,199,200],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_36":74,"_13":75,"_39":76,"_41":-5,"_42":43,"_44":77,"_46":47,"_48":78,"_17":63,"_51":79,"_53":-5,"_55":56,"_57":-5,"_18":204},{"_36":67,"_13":68,"_39":69,"_41":-5,"_42":43,"_44":70,"_46":47,"_48":71,"_17":63,"_51":64,"_53":72,"_55":56,"_57":-5,"_18":203},{"_36":59,"_13":60,"_39":61,"_41":-5,"_42":43,"_44":50,"_46":47,"_48":62,"_17":63,"_51":64,"_53":65,"_55":56,"_57":-5,"_18":202},{"_36":37,"_13":38,"_39":40,"_41":-5,"_42":43,"_44":45,"_46":47,"_48":49,"_17":50,"_51":52,"_53":54,"_55":56,"_57":-5,"_18":201},[38],[60],[68],[75],"pulls","branches","forks",{"_211":50,"_213":63},"connections",{"_211":63,"_212":63},"count","unfilledCount","emptyCount",{"_36":74,"_13":75,"_39":76,"_41":-5,"_42":43,"_44":77,"_46":47,"_48":95,"_17":63,"_51":79,"_53":-5,"_55":56,"_57":-5,"_86":233,"_18":234},{"_36":118,"_13":119,"_39":120,"_41":76,"_42":43,"_44":121,"_46":47,"_48":122,"_17":70,"_51":64,"_53":123,"_55":56,"_57":-5,"_86":231,"_18":232},{"_36":109,"_13":110,"_39":111,"_41":76,"_42":43,"_44":112,"_46":47,"_48":113,"_17":114,"_51":24,"_53":115,"_55":56,"_57":-5,"_86":229,"_18":230},{"_36":101,"_13":102,"_39":103,"_41":76,"_42":43,"_44":104,"_46":47,"_48":105,"_17":63,"_51":64,"_53":106,"_55":56,"_57":-5,"_86":227,"_18":228},{"_36":67,"_13":68,"_39":69,"_41":-5,"_42":43,"_44":70,"_46":47,"_48":92,"_17":63,"_51":64,"_53":72,"_55":56,"_57":-5,"_86":225,"_18":226},{"_36":59,"_13":60,"_39":61,"_41":-5,"_42":43,"_44":50,"_46":47,"_48":89,"_17":63,"_51":64,"_53":65,"_55":56,"_57":-5,"_86":223,"_18":224},{"_36":37,"_13":38,"_39":40,"_41":-5,"_42":43,"_44":45,"_46":47,"_48":85,"_17":50,"_51":52,"_53":54,"_55":56,"_57":-5,"_86":221,"_18":222},[],[38],[],[60],[],[68],[],[75,102],[],[75,110],[],[75,119],[215,216,217],[75],["D",1779382252086],{"_11":12,"_178":-5},{"_11":12,"_173":12,"_174":-5,"_136":-5,"_175":176,"_177":56},{"_17":45,"_13":16,"_36":43,"_165":126,"_166":-5,"_167":-5,"_168":-5,"_169":-5,"_170":-5,"_171":14,"_172":12},"ctx",{"_158":-5,"_194":272,"_273":274,"_275":276,"_277":56,"_278":56,"_279":56,"_280":47,"_281":-5,"_282":-7,"_283":-7,"_284":63,"_285":56,"_286":56,"_287":-5,"_288":56,"_289":56,"_290":56,"_291":-5},"ENV",{"_243":244,"_245":246,"_247":16,"_248":249,"_250":251,"_252":253,"_254":255,"_256":257,"_258":259,"_260":261,"_262":263,"_264":265,"_266":267,"_268":269,"_270":271},"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"]