[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_196":197,"_198":199},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":-7,"_18":19,"_17":-7,"_147":-5,"_20":148,"_22":149,"_150":151,"_152":153,"_25":154,"_24":-5,"_155":-5,"_156":-5,"_157":55,"_158":159,"_160":46,"_161":-5,"_162":-5,"_163":164},"routes/_app.x.$handle.$name.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":-7,"_25":26,"_27":-5,"_28":-5,"_29":-5,"_30":-5,"_31":-5},"handle","tempa","name","find-my-food","branchName","main","version","path","","project",{"_35":94,"_13":14,"_47":95,"_96":-5,"_97":55,"_98":99,"_100":99,"_101":102,"_103":-5,"_104":105,"_106":39,"_107":46,"_108":-5,"_109":-5,"_110":49,"_111":112,"_113":-5,"_114":-5,"_115":-5,"_116":-5,"_117":118,"_119":118,"_120":121,"_122":121,"_123":121,"_124":118,"_125":118,"_126":127,"_128":129,"_130":131,"_132":55},"tree",[72,73,74],"file","contents",[32,33,34],"upstream","pull","ahead","behind","envVars",{"_35":65,"_13":66,"_38":67,"_40":-5,"_41":42,"_43":68,"_45":46,"_47":69,"_17":49,"_50":70,"_52":-5,"_54":55,"_56":-5,"_18":71},{"_35":58,"_13":59,"_38":60,"_40":-5,"_41":42,"_43":61,"_45":46,"_47":62,"_17":49,"_50":24,"_52":63,"_54":55,"_56":-5,"_18":64},{"_35":36,"_13":37,"_38":39,"_40":-5,"_41":42,"_43":44,"_45":46,"_47":48,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_18":57},"id","1af65c74-3ded-11f1-bb08-42b51c65c3df","main.ts","fileId","1af65e04-3ded-11f1-bb08-42b51c65c3df","parentId","branchId","f36e7470-3dec-11f1-bda3-42b51c65c3df","branchVersion",3,"latest",true,"createdAt",["D",1776822399400],0,"fileType","http","content","import { Hono } from \"npm:hono@4\";\nimport { serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\n\nconst app = new Hono();\n\napp.onError((err) => Promise.reject(err));\n\n// API: fetch nearby restaurants & cafes from OpenStreetMap Overpass\napp.get(\"/api/places\", async (c) => {\n const lat = parseFloat(c.req.query(\"lat\") || \"0\");\n const lon = parseFloat(c.req.query(\"lon\") || \"0\");\n const radius = 1500; // 1.5km\n\n const query = `\n [out:json][timeout:10];\n (\n node[\"amenity\"=\"restaurant\"](around:${radius},${lat},${lon});\n node[\"amenity\"=\"cafe\"](around:${radius},${lat},${lon});\n );\n out body;\n `;\n\n try {\n const res = await fetch(\"https://overpass-api.de/api/interpreter\", {\n method: \"POST\",\n body: `data=${encodeURIComponent(query)}`,\n headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },\n });\n\n if (!res.ok) throw new Error(\"Overpass API error\");\n\n const data = await res.json();\n\n const places = data.elements\n .filter((el: any) => el.tags?.name)\n .map((el: any) => {\n const dlat = (el.lat - lat) * 111320;\n const dlon = (el.lon - lon) * 111320 * Math.cos(lat * Math.PI / 180);\n const distance = Math.sqrt(dlat * dlat + dlon * dlon);\n\n return {\n id: el.id,\n name: el.tags.name,\n type: el.tags.amenity === \"cafe\" ? \"cafe\" : \"restaurant\",\n lat: el.lat,\n lon: el.lon,\n distance: Math.round(distance),\n address: [el.tags[\"addr:street\"], el.tags[\"addr:housenumber\"]].filter(Boolean).join(\" \")\n || el.tags[\"addr:full\"]\n || el.tags.cuisine\n || \"\",\n tags: el.tags,\n };\n })\n .sort((a: any, b: any) => a.distance - b.distance)\n .slice(0, 50);\n\n return c.json(places);\n } catch (e: any) {\n return c.json({ error: e.message }, 500);\n }\n});\n\n// View source\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// Serve frontend files\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path));\n\n// Serve index\napp.get(\"/\", (c) => serveFile(\"/index.html\"));\n\nexport default app.fetch;\n","deleted",false,"label",[37],"f80805b4-3dec-11f1-bb08-42b51c65c3df","index.html","f80806d6-3dec-11f1-bb08-42b51c65c3df",1,["D",1776822340794],"\n\n\n \n \n Find My Food\n \n \n \n \n \n\n\n

\n \n\n\n",[59],"130006b4-3ded-11f1-bb08-42b51c65c3df","frontend","64c34d53-fdfb-4f07-85c0-884dfac216d1",2,["D",1776822386038],"directory",[66],{"_35":65,"_13":66,"_38":67,"_40":-5,"_41":42,"_43":68,"_45":46,"_47":82,"_17":49,"_50":70,"_52":-5,"_54":55,"_56":-5,"_76":83,"_18":84},{"_35":58,"_13":59,"_38":60,"_40":-5,"_41":42,"_43":61,"_45":46,"_47":79,"_17":49,"_50":24,"_52":63,"_54":55,"_56":-5,"_76":80,"_18":81},{"_35":36,"_13":37,"_38":39,"_40":-5,"_41":42,"_43":44,"_45":46,"_47":75,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_76":77,"_18":78},["D",1776822399400],"children",[],[37],["D",1776822340794],[],[59],["D",1776822386038],[85],[66],{"_35":86,"_13":87,"_38":88,"_40":67,"_41":42,"_43":68,"_45":46,"_47":89,"_17":49,"_50":90,"_52":91,"_54":55,"_56":-5,"_76":92,"_18":93},"12ffb93e-3ded-11f1-bb08-42b51c65c3df","app.tsx","12ffb9f2-3ded-11f1-bb08-42b51c65c3df",["D",1776822386038],"script","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect, useRef, useCallback } from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\n\ninterface Place {\n id: number;\n name: string;\n type: \"restaurant\" | \"cafe\";\n lat: number;\n lon: number;\n distance: number;\n address: string;\n tags: Record;\n}\n\nfunction getIcon(type: string) {\n return type === \"cafe\" ? \"☕\" : \"🍽️\";\n}\n\nfunction formatDistance(meters: number) {\n if (meters < 1000) return `${Math.round(meters)}m away`;\n return `${(meters / 1000).toFixed(1)}km away`;\n}\n\nfunction PulsingDot() {\n return (\n

\n );\n}\n\nfunction PlaceCard({ place, selected, onClick }: { place: Place; selected: boolean; onClick: () => void }) {\n return (\n \n

{getIcon(place.type)}

{place.name}

{place.address || \"Address unavailable\"}

\n \n {place.type === \"cafe\" ? \"Café\" : \"Restaurant\"}\n \n {formatDistance(place.distance)}\n

\n \n

\n \n );\n}\n\nfunction App() {\n const [places, setPlaces] = useState([]);\n const [userPos, setUserPos] = useState<{ lat: number; lon: number } | null>(null);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState(null);\n const [selected, setSelected] = useState(null);\n const [filter, setFilter] = useState<\"all\" | \"restaurant\" | \"cafe\">(\"all\");\n const [sidebarOpen, setSidebarOpen] = useState(true);\n const mapRef = useRef(null);\n const mapContainer = useRef(null);\n const markersRef = useRef([]);\n const userMarkerRef = useRef(null);\n\n const initMap = useCallback((lat: number, lon: number) => {\n if (mapRef.current || !mapContainer.current) return;\n const L = (window as any).L;\n\n const map = L.map(mapContainer.current, {\n zoomControl: false,\n attributionControl: false,\n }).setView([lat, lon], 15);\n\n L.tileLayer(\"https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}{r}.png\", {\n maxZoom: 19,\n }).addTo(map);\n\n L.control.zoom({ position: \"topright\" }).addTo(map);\n\n // User location marker\n const userIcon = L.divIcon({\n html: `

\n `,\n className: \"\",\n iconSize: [32, 32],\n iconAnchor: [16, 16],\n });\n userMarkerRef.current = L.marker([lat, lon], { icon: userIcon }).addTo(map);\n\n mapRef.current = map;\n }, []);\n\n const updateMarkers = useCallback((places: Place[], selectedId: number | null) => {\n if (!mapRef.current) return;\n const L = (window as any).L;\n\n markersRef.current.forEach((m) => mapRef.current.removeLayer(m));\n markersRef.current = [];\n\n places.forEach((place) => {\n const isSelected = place.id === selectedId;\n const emoji = getIcon(place.type);\n const icon = L.divIcon({\n html: `

${emoji}

`,\n className: \"\",\n iconSize: [isSelected ? 48 : 40, isSelected ? 48 : 40],\n iconAnchor: [isSelected ? 24 : 20, isSelected ? 24 : 20],\n });\n const marker = L.marker([place.lat, place.lon], { icon })\n .addTo(mapRef.current)\n .on(\"click\", () => setSelected(place.id));\n if (isSelected) {\n marker.bindPopup(\n `

\n ${emoji} ${place.name}
\n ${place.address || \"\"}
\n ${formatDistance(place.distance)}\n

`,\n { className: \"dark-popup\" }\n ).openPopup();\n }\n markersRef.current.push(marker);\n });\n }, []);\n\n useEffect(() => {\n navigator.geolocation.getCurrentPosition(\n async (pos) => {\n const { latitude: lat, longitude: lon } = pos.coords;\n setUserPos({ lat, lon });\n initMap(lat, lon);\n\n try {\n const res = await fetch(`/api/places?lat=${lat}&lon=${lon}`);\n const data = await res.json();\n if (data.error) throw new Error(data.error);\n setPlaces(data);\n } catch (e: any) {\n setError(e.message);\n } finally {\n setLoading(false);\n }\n },\n (err) => {\n // Fallback to a default location (San Francisco)\n const lat = 37.7749, lon = -122.4194;\n setUserPos({ lat, lon });\n initMap(lat, lon);\n fetch(`/api/places?lat=${lat}&lon=${lon}`)\n .then(r => r.json())\n .then(data => { setPlaces(data); setLoading(false); })\n .catch(e => { setError(e.message); setLoading(false); });\n },\n { enableHighAccuracy: true, timeout: 10000 }\n );\n }, []);\n\n const filtered = places.filter((p) => filter === \"all\" || p.type === filter);\n\n useEffect(() => {\n updateMarkers(filtered, selected);\n }, [filtered, selected]);\n\n useEffect(() => {\n if (selected && mapRef.current) {\n const place = places.find((p) => p.id === selected);\n if (place) mapRef.current.flyTo([place.lat, place.lon], 17, { duration: 0.8 });\n }\n }, [selected]);\n\n const recenter = () => {\n if (userPos && mapRef.current) {\n mapRef.current.flyTo([userPos.lat, userPos.lon], 15, { duration: 0.8 });\n setSelected(null);\n }\n };\n\n return (\n

\n {/* Sidebar */}\n

\n {/* Header */}\n

\n 📍\n

Find My Food

Discover restaurants & cafés nearby

\n\n {/* Filter pills */}\n

\n {([\"all\", \"restaurant\", \"cafe\"] as const).map((f) => (\n { setFilter(f); setSelected(null); }}\n className={`px-3 py-1.5 rounded-full text-xs font-medium transition-all ${\n filter === f\n ? \"bg-blue-600 text-white\"\n : \"bg-gray-800 text-gray-400 hover:bg-gray-700\"\n }`}\n >\n {f === \"all\" ? \"All\" : f === \"cafe\" ? \"☕ Cafés\" : \"🍽️ Restaurants\"}\n \n ))}\n

\n\n {/* Count */}\n

\n {filtered.length} places found\n

\n\n {/* List */}\n

\n {loading ? (\n

Finding nearby places...

\n ) : error ? (\n

{error}

\n ) : filtered.length === 0 ? (\n

\n 🔍\n

No places found nearby

\n ) : (\n filtered.map((place) => (\n setSelected(selected === place.id ? null : place.id)}\n />\n ))\n )}\n

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

\n \n View Source ↗\n \n

\n\n {/* Map */}\n

\n\n {/* Toggle sidebar button */}\n setSidebarOpen(!sidebarOpen)}\n className=\"absolute top-4 left-4 z-[1000] bg-gray-900/90 backdrop-blur p-2.5 rounded-xl border border-gray-700 hover:bg-gray-800 transition-colors\"\n >\n \n \n\n {/* Recenter button */}\n \n \n \n

\n );\n}\n\ncreateRoot(document.getElementById(\"app\")!).render();\n",[],[66,87],"f36dde84-3dec-11f1-bda3-42b51c65c3df",["D",1776822333080],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Apple Find My clone for finding nearest restaurants and cafes","imageUrl","userId","302148de-c05b-4fcf-af06-7ae168f6f7a7","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","orgId","019db2dc-0e1f-759e-93bc-98b03f01ede2","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_146":19},"org",{"_11":12,"_141":-5,"_142":19,"_104":105,"_143":144,"_145":55},"branch",{"_17":44,"_13":16,"_35":42,"_133":94,"_134":-5,"_135":-5,"_136":-5,"_137":-5,"_138":-5,"_139":14,"_140":12},"isOwned","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","avatar","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_35":94,"_13":14,"_47":192,"_96":-5,"_97":55,"_98":99,"_100":99,"_101":102,"_103":-5,"_104":105,"_106":39,"_107":46,"_108":-5,"_109":-5,"_110":49,"_111":112,"_113":-5,"_114":-5,"_115":-5,"_116":-5,"_117":118,"_119":118,"_120":121,"_122":121,"_123":121,"_124":118,"_125":118,"_126":193,"_128":194,"_130":195,"_132":55},[180,182,183],"files",[180,181,182,183],"counts",{"_171":49,"_172":61,"_173":49,"_31":174,"_175":176},[165,166,167],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_35":65,"_13":66,"_38":67,"_40":-5,"_41":42,"_43":68,"_45":46,"_47":69,"_17":49,"_50":70,"_52":-5,"_54":55,"_56":-5,"_18":170},{"_35":58,"_13":59,"_38":60,"_40":-5,"_41":42,"_43":61,"_45":46,"_47":62,"_17":49,"_50":24,"_52":63,"_54":55,"_56":-5,"_18":169},{"_35":36,"_13":37,"_38":39,"_40":-5,"_41":42,"_43":44,"_45":46,"_47":48,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_18":168},[37],[59],[66],"pulls","branches","forks",{"_177":49,"_179":49},"connections",{"_177":49,"_178":49},"count","unfilledCount","emptyCount",{"_35":65,"_13":66,"_38":67,"_40":-5,"_41":42,"_43":68,"_45":46,"_47":82,"_17":49,"_50":70,"_52":-5,"_54":55,"_56":-5,"_76":190,"_18":191},{"_35":86,"_13":87,"_38":88,"_40":67,"_41":42,"_43":68,"_45":46,"_47":89,"_17":49,"_50":90,"_52":91,"_54":55,"_56":-5,"_76":188,"_18":189},{"_35":58,"_13":59,"_38":60,"_40":-5,"_41":42,"_43":61,"_45":46,"_47":79,"_17":49,"_50":24,"_52":63,"_54":55,"_56":-5,"_76":186,"_18":187},{"_35":36,"_13":37,"_38":39,"_40":-5,"_41":42,"_43":44,"_45":46,"_47":75,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_76":184,"_18":185},[],[37],[],[59],[],[66,87],[181],[66],["D",1776822333080],{"_11":12,"_146":19},{"_11":12,"_141":-5,"_142":19,"_104":105,"_143":144,"_145":55},{"_17":44,"_13":16,"_35":42,"_133":94,"_134":-5,"_135":-5,"_136":-5,"_137":-5,"_138":-5,"_139":14,"_140":12},"ctx",{"_126":-5,"_162":229,"_230":231,"_232":233,"_234":55,"_235":55,"_236":55,"_237":46,"_238":-5,"_239":-7,"_240":-7,"_241":49,"_242":55,"_243":55,"_244":-5,"_245":55,"_246":55,"_247":55,"_248":-5},"ENV",{"_200":201,"_202":203,"_204":16,"_205":206,"_207":208,"_209":210,"_211":212,"_213":214,"_215":216,"_217":218,"_219":220,"_221":222,"_223":224,"_225":226,"_227":228},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","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"]

Code