\n\n \n \n",[],[233,235],"a3ded09e-3f9b-11f0-bbad-76b3cceeab13","ReportForm.tsx","08dd17d6-3f91-11f0-825c-76b3cceeab13","b4050c00-2af5-4c47-853b-b480158d8ce5",34,["D",1748859815015],8,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport { CRIME_TYPES } from \"../../shared/types.ts\";\n\ninterface ReportFormProps {\n location: { lat: number; lng: number };\n onSubmit: (data: any) => void;\n onClose: () => void;\n}\n\nexport default function ReportForm({ location, onSubmit, onClose }: ReportFormProps) {\n const [formData, setFormData] = useState({\n crime_type: \"\",\n description: \"\",\n address: \"\",\n reporter_name: \"\",\n reporter_contact: \"\",\n is_anonymous: false,\n });\n\n const [isSubmitting, setIsSubmitting] = useState(false);\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n\n if (!formData.crime_type || !formData.description) {\n alert(\"Please fill in all required fields\");\n return;\n }\n\n setIsSubmitting(true);\n try {\n await onSubmit(formData);\n } finally {\n setIsSubmitting(false);\n }\n };\n\n const handleChange = (e: React.ChangeEvent) => {\n const { name, value, type } = e.target;\n setFormData(prev => ({\n ...prev,\n [name]: type === \"checkbox\" ? (e.target as HTMLInputElement).checked : value,\n }));\n };\n\n return (\n

Report a Crime

\n \n ×\n \n

\n\n

\n 📍 Location: {location.lat.toFixed(4)}, {location.lng.toFixed(4)}\n

\n\n

\n {/* Crime Type */}\n

\n \n Crime Type *\n \n \n \n {CRIME_TYPES.map(type => )}\n \n

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

\n \n Description *\n \n \n

\n\n {/* Address */}\n

\n \n Address (Optional)\n \n \n

\n\n {/* Anonymous Reporting */}\n

\n \n \n Submit anonymously\n \n

\n\n {/* Reporter Information (only if not anonymous) */}\n {!formData.is_anonymous && (\n <>\n

\n \n Your Name\n \n \n

\n\n

\n \n Contact Information\n \n \n

\n \n )}\n\n {/* Disclaimer */}\n

\n ⚠️ Important:{\" \"}\n This is not a substitute for emergency services. If you are in immediate danger, call 911 or your local\n emergency number.\n

\n\n {/* Submit Buttons */}\n

\n \n Cancel\n \n \n {isSubmitting ? \"Submitting...\" : \"Submit Report\"}\n \n

\n );\n}",[],[233,251,242],"components","ffebed5e-3f9b-11f0-9f02-76b3cceeab13","CrimeMap.tsx","f7ebfa3c-3f90-11f0-9d2c-76b3cceeab13",36,["D",1748859969451],15,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useRef } from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport type { CrimeReport } from \"../../shared/types.ts\";\n\ninterface CrimeMapProps {\n reports: CrimeReport[];\n selectedLocation: { lat: number; lng: number } | null;\n onLocationSelect: (lat: number, lng: number) => void;\n}\n\ndeclare global {\n interface Window {\n L: any;\n }\n}\n\nexport default function CrimeMap({ reports, selectedLocation, onLocationSelect }: CrimeMapProps) {\n const mapRef = useRef(null);\n const mapInstanceRef = useRef(null);\n const markersRef = useRef([]);\n const selectedMarkerRef = useRef(null);\n\n useEffect(() => {\n if (!mapRef.current || !window.L) return;\n\n // Initialize map\n const map = window.L.map(mapRef.current).setView([40.7128, -74.0060], 13);\n\n // Add tile layer\n window.L.tileLayer(\"https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png\", {\n attribution: \"© OpenStreetMap contributors\",\n }).addTo(map);\n\n // Try to get user's location\n if (navigator.geolocation) {\n navigator.geolocation.getCurrentPosition(\n (position) => {\n const { latitude, longitude } = position.coords;\n map.setView([latitude, longitude], 13);\n },\n (error) => {\n console.log(\"Geolocation error:\", error);\n // Keep default location\n },\n );\n }\n\n // Add click handler for location selection\n map.on(\"click\", (e: any) => {\n const { lat, lng } = e.latlng;\n onLocationSelect(lat, lng);\n });\n\n mapInstanceRef.current = map;\n\n return () => {\n map.remove();\n };\n }, [onLocationSelect]);\n\n // Update crime report markers\n useEffect(() => {\n if (!mapInstanceRef.current) return;\n\n // Clear existing markers\n markersRef.current.forEach(marker => {\n mapInstanceRef.current.removeLayer(marker);\n });\n markersRef.current = [];\n\n // Add markers for each crime report\n reports.forEach(report => {\n const crimeIcon = window.L.divIcon({\n className: \"crime-marker\",\n html: getCrimeEmoji(report.crime_type),\n iconSize: [20, 20],\n iconAnchor: [10, 10],\n });\n\n const marker = window.L.marker([report.latitude, report.longitude], {\n icon: crimeIcon,\n }).addTo(mapInstanceRef.current);\n\n // Add popup with crime details\n const popupContent = `\n

${report.crime_type}

${report.description}

Status: ${report.status}

Reported: ${new Date(report.created_at || \"\").toLocaleDateString()}

\n ${report.address ? `

Address: ${report.address}

` : \"\"}\n

\n `;\n\n marker.bindPopup(popupContent);\n markersRef.current.push(marker);\n });\n }, [reports]);\n\n // Update selected location marker\n useEffect(() => {\n if (!mapInstanceRef.current) return;\n\n // Remove existing selected marker\n if (selectedMarkerRef.current) {\n mapInstanceRef.current.removeLayer(selectedMarkerRef.current);\n selectedMarkerRef.current = null;\n }\n\n // Add new selected marker\n if (selectedLocation) {\n const selectedIcon = window.L.divIcon({\n className: \"selected-location-marker\",\n html: \"📍\",\n iconSize: [24, 24],\n iconAnchor: [12, 12],\n });\n\n selectedMarkerRef.current = window.L.marker([selectedLocation.lat, selectedLocation.lng], {\n icon: selectedIcon,\n }).addTo(mapInstanceRef.current);\n\n selectedMarkerRef.current.bindPopup(\"Selected location for crime report\").openPopup();\n }\n }, [selectedLocation]);\n\n return (\n

\n Crime Reports\n

\n Selected Location\n

\n );\n}\n\nfunction getCrimeEmoji(crimeType: string): string {\n const emojiMap: Record = {\n \"Theft\": \"💰\",\n \"Burglary\": \"🏠\",\n \"Assault\": \"👊\",\n \"Vandalism\": \"🔨\",\n \"Drug-related\": \"💊\",\n \"Vehicle Crime\": \"🚗\",\n \"Fraud\": \"💳\",\n \"Domestic Violence\": \"🏠\",\n \"Public Disorder\": \"📢\",\n \"Other\": \"⚠️\",\n };\n\n return emojiMap[crimeType] || \"⚠️\";\n}",[],[233,251,253],"ea73dce4-3f90-11f0-869e-76b3cceeab13","App.tsx","ea73ddb6-3f90-11f0-869e-76b3cceeab13",10,["D",1748855208970],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport CrimeMap from \"./CrimeMap.tsx\";\nimport ReportForm from \"./ReportForm.tsx\";\nimport type { CrimeReport } from \"../../shared/types.ts\";\n\nexport default function App() {\n const [reports, setReports] = useState([]);\n const [selectedLocation, setSelectedLocation] = useState<{lat: number, lng: number} | null>(null);\n const [showForm, setShowForm] = useState(false);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState(null);\n\n // Fetch crime reports\n const fetchReports = async () => {\n try {\n setLoading(true);\n const response = await fetch('/api/reports');\n if (!response.ok) {\n throw new Error('Failed to fetch reports');\n }\n const data = await response.json();\n setReports(data);\n } catch (err) {\n setError(err instanceof Error ? err.message : 'An error occurred');\n } finally {\n setLoading(false);\n }\n };\n\n useEffect(() => {\n fetchReports();\n }, []);\n\n const handleLocationSelect = (lat: number, lng: number) => {\n setSelectedLocation({ lat, lng });\n setShowForm(true);\n };\n\n const handleReportSubmit = async (reportData: any) => {\n try {\n const response = await fetch('/api/reports', {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json',\n },\n body: JSON.stringify({\n ...reportData,\n latitude: selectedLocation?.lat,\n longitude: selectedLocation?.lng,\n }),\n });\n\n if (!response.ok) {\n throw new Error('Failed to submit report');\n }\n\n // Refresh reports and close form\n await fetchReports();\n setShowForm(false);\n setSelectedLocation(null);\n alert('Crime report submitted successfully!');\n } catch (err) {\n alert('Failed to submit report: ' + (err instanceof Error ? err.message : 'Unknown error'));\n }\n };\n\n const handleCloseForm = () => {\n setShowForm(false);\n setSelectedLocation(null);\n };\n\n if (loading) {\n return (\n

Loading crime reports...

\n );\n }\n\n if (error) {\n return (\n

⚠️ Error

{error}

\n \n

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

\n {/* Header */}\n

🚨 Crime Reporting

Report crimes in your local area

\n {reports.length} reports total\n

\n\n {/* Main Content */}\n

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

Crime Map

\n Click on the map to select a location and report a crime\n

\n \n

\n\n {/* Sidebar */}\n

\n {/* Instructions */}\n

How to Report

\n 1\n Click on the map where the crime occurred\n
\n 2\n Fill out the crime report form\n
\n 3\n Submit your report\n

\n\n {/* Recent Reports */}\n

Recent Reports

\n {reports.slice(0, 10).map((report) => (\n

\n {report.crime_type}\n \n {report.status}\n \n

{report.description}

\n {report.address || `${report.latitude.toFixed(4)}, ${report.longitude.toFixed(4)}`}\n

\n ))}\n

\n\n {/* Report Form Modal */}\n {showForm && selectedLocation && (\n \n )}\n

\n );\n}",[],[233,251,262],"ea73f2f6-3f90-11f0-869e-76b3cceeab13",["D",1748855208970],[194,195,196],[233,251],"d621da48-3f90-11f0-97f8-76b3cceeab13",["D",1748855174870],[193,197,198],[233],"0aa7d48e-3f91-11f0-a354-76b3cceeab13","index.ts",13,["D",1748855262994],"http","import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { initializeDatabase } from \"./database/migrations.ts\";\nimport reports from \"./routes/reports.ts\";\nimport staticRoutes from \"./routes/static.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Initialize database on startup\nawait initializeDatabase();\n\n// API routes\napp.route(\"/api/reports\", reports);\n\n// Static file serving and main page\napp.route(\"/\", staticRoutes);\n\n// Health check endpoint\napp.get(\"/health\", (c) => {\n return c.json({ status: \"healthy\", timestamp: new Date().toISOString() });\n});\n\n// 404 handler\napp.notFound((c) => {\n return c.json({ error: \"Not found\" }, 404);\n});\n\nexport default app.fetch; // This is the entry point for HTTP vals",[],[162,278],"cc1446a8-3f90-11f0-97f8-76b3cceeab13","static.ts","cc144784-3f90-11f0-97f8-76b3cceeab13","a038936b-2995-4d64-9846-4c2e9a03310f",6,["D",1748855158013],"import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n\nconst staticRoutes = new Hono();\n\n// Serve frontend files\nstaticRoutes.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n// Serve shared files\nstaticRoutes.get(\"/shared/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n// Serve the main page with initial data injection\nstaticRoutes.get(\"/\", async (c) => {\n try {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n \n // You could inject initial data here if needed\n // const initialData = await fetchInitialData();\n // const dataScript = ``;\n // html = html.replace(\"\", `${dataScript}`);\n \n return c.html(html);\n } catch (error) {\n console.error(\"Error serving index:\", error);\n return c.text(\"Error loading page\", 500);\n }\n});\n\nexport default staticRoutes;",[],[162,294,286],"routes","c79f4b40-3f90-11f0-a2ca-76b3cceeab13","reports.ts","c79f4bf4-3f90-11f0-a2ca-76b3cceeab13",5,["D",1748855150532],"import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport type { CrimeReport, LocationFilter } from \"../../shared/types.ts\";\nimport {\n createCrimeReport,\n getAllCrimeReports,\n getCrimeReportsInArea,\n getCrimeStats,\n updateReportStatus\n} from \"../database/queries.ts\";\n\nconst reports = new Hono();\n\n// Get all crime reports or filter by location\nreports.get(\"/\", async (c) => {\n try {\n const lat = c.req.query(\"lat\");\n const lng = c.req.query(\"lng\");\n const radius = c.req.query(\"radius\");\n\n if (lat && lng && radius) {\n const filter: LocationFilter = {\n lat: parseFloat(lat),\n lng: parseFloat(lng),\n radius: parseFloat(radius)\n };\n const reports = await getCrimeReportsInArea(filter);\n return c.json(reports);\n } else {\n const reports = await getAllCrimeReports();\n return c.json(reports);\n }\n } catch (error) {\n console.error(\"Error fetching reports:\", error);\n return c.json({ error: \"Failed to fetch reports\" }, 500);\n }\n});\n\n// Create a new crime report\nreports.post(\"/\", async (c) => {\n try {\n const body = await c.req.json();\n \n // Validate required fields\n if (!body.crime_type || !body.description || !body.latitude || !body.longitude) {\n return c.json({ error: \"Missing required fields\" }, 400);\n }\n\n const report: Omit = {\n crime_type: body.crime_type,\n description: body.description,\n latitude: parseFloat(body.latitude),\n longitude: parseFloat(body.longitude),\n address: body.address,\n reporter_name: body.is_anonymous ? undefined : body.reporter_name,\n reporter_contact: body.is_anonymous ? undefined : body.reporter_contact,\n is_anonymous: Boolean(body.is_anonymous),\n status: 'pending'\n };\n\n const reportId = await createCrimeReport(report);\n \n return c.json({ \n success: true, \n id: reportId,\n message: \"Crime report submitted successfully\" \n }, 201);\n } catch (error) {\n console.error(\"Error creating report:\", error);\n return c.json({ error: \"Failed to create report\" }, 500);\n }\n});\n\n// Get crime statistics\nreports.get(\"/stats\", async (c) => {\n try {\n const stats = await getCrimeStats();\n return c.json(stats);\n } catch (error) {\n console.error(\"Error fetching stats:\", error);\n return c.json({ error: \"Failed to fetch statistics\" }, 500);\n }\n});\n\n// Update report status (for admin use)\nreports.patch(\"/:id/status\", async (c) => {\n try {\n const id = parseInt(c.req.param(\"id\"));\n const { status } = await c.req.json();\n \n if (![\"pending\", \"reviewed\", \"resolved\"].includes(status)) {\n return c.json({ error: \"Invalid status\" }, 400);\n }\n\n await updateReportStatus(id, status);\n return c.json({ success: true, message: \"Status updated successfully\" });\n } catch (error) {\n console.error(\"Error updating status:\", error);\n return c.json({ error: \"Failed to update status\" }, 500);\n }\n});\n\nexport default reports;",[],[162,294,296],"c79f5cb6-3f90-11f0-a2ca-76b3cceeab13",["D",1748855150532],[189,190],[162,294],["D",1748855135807],[],[162,82,80],["D",1748855120462],[],[162,82,65],["D",1748855120462],[186,187],[162,82],"b5b31b82-3f90-11f0-9402-76b3cceeab13",["D",1748855120462],[185,188,191],[162],["D",1748855067988],{"_11":12,"_132":71},{"_11":12,"_128":-5,"_70":71,"_31":69,"_129":130,"_131":30},{"_40":119,"_13":16,"_34":37,"_120":85,"_121":-5,"_122":-5,"_123":-5,"_124":-5,"_125":-5,"_126":14,"_127":12},"ctx",{"_53":-5,"_151":357,"_358":359,"_360":361,"_362":30,"_363":30,"_364":30,"_365":24,"_366":-5,"_367":-7,"_368":-7,"_369":26,"_370":30,"_371":30,"_372":-5,"_373":30,"_374":30,"_375":30,"_376":-5},"ENV",{"_328":329,"_330":331,"_332":16,"_333":334,"_335":336,"_337":338,"_339":340,"_341":342,"_343":344,"_345":346,"_347":348,"_349":350,"_351":352,"_353":354,"_355":356},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","811aa22498c9b0b5a47e8d778de579cdb990f332","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"]

History · database