\n\n \n \n",[],[254,256],"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}",[],[254,272,263],"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}",[],[254,272,274],"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}",[],[254,272,283],"ea73f2f6-3f90-11f0-869e-76b3cceeab13",["D",1748855208970],[215,216,217],[254,272],"d621da48-3f90-11f0-97f8-76b3cceeab13",["D",1748855174870],[214,218,219],[254],["D",1748855262994],[],[18,93],"cc1446a8-3f90-11f0-97f8-76b3cceeab13","static.ts","cc144784-3f90-11f0-97f8-76b3cceeab13",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;",[],[18,83,302],"c79f4b40-3f90-11f0-a2ca-76b3cceeab13","reports.ts","c79f4bf4-3f90-11f0-a2ca-76b3cceeab13",["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;",[],[18,83,310],["D",1748855150532],[210,211],[18,83],"bed7cc1c-3f90-11f0-a015-76b3cceeab13","queries.ts","bed7ccee-3f90-11f0-a015-76b3cceeab13",4,["D",1748855135807],"import { sqlite } from \"https://esm.town/v/stevekrouse/sqlite\";\nimport { TABLE_NAME } from \"./migrations.ts\";\nimport type { CrimeReport, CrimeStats, LocationFilter } from \"../../shared/types.ts\";\n\nexport async function createCrimeReport(report: Omit): Promise {\n const result = await sqlite.execute(`\n INSERT INTO ${TABLE_NAME} (\n crime_type, description, latitude, longitude, address,\n reporter_name, reporter_contact, is_anonymous, status\n ) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)\n `, [\n report.crime_type,\n report.description,\n report.latitude,\n report.longitude,\n report.address || null,\n report.reporter_name || null,\n report.reporter_contact || null,\n report.is_anonymous ? 1 : 0,\n report.status\n ]);\n\n return result.lastInsertRowId as number;\n}\n\nexport async function getAllCrimeReports(): Promise {\n const result = await sqlite.execute(`\n SELECT * FROM ${TABLE_NAME} \n ORDER BY created_at DESC\n `);\n\n return result.rows.map(row => ({\n id: row[0] as number,\n crime_type: row[1] as string,\n description: row[2] as string,\n latitude: row[3] as number,\n longitude: row[4] as number,\n address: row[5] as string || undefined,\n reporter_name: row[6] as string || undefined,\n reporter_contact: row[7] as string || undefined,\n is_anonymous: Boolean(row[8]),\n status: row[9] as 'pending' | 'reviewed' | 'resolved',\n created_at: row[10] as string\n }));\n}\n\nexport async function getCrimeReportsInArea(filter: LocationFilter): Promise {\n // Simple bounding box query (for more accuracy, you'd use proper geospatial functions)\n const latDelta = filter.radius / 111; // Rough conversion: 1 degree ≈ 111 km\n const lngDelta = filter.radius / (111 * Math.cos(filter.lat * Math.PI / 180));\n\n const result = await sqlite.execute(`\n SELECT * FROM ${TABLE_NAME} \n WHERE latitude BETWEEN ? AND ?\n AND longitude BETWEEN ? AND ?\n ORDER BY created_at DESC\n `, [\n filter.lat - latDelta,\n filter.lat + latDelta,\n filter.lng - lngDelta,\n filter.lng + lngDelta\n ]);\n\n return result.rows.map(row => ({\n id: row[0] as number,\n crime_type: row[1] as string,\n description: row[2] as string,\n latitude: row[3] as number,\n longitude: row[4] as number,\n address: row[5] as string || undefined,\n reporter_name: row[6] as string || undefined,\n reporter_contact: row[7] as string || undefined,\n is_anonymous: Boolean(row[8]),\n status: row[9] as 'pending' | 'reviewed' | 'resolved',\n created_at: row[10] as string\n }));\n}\n\nexport async function getCrimeStats(): Promise {\n const result = await sqlite.execute(`\n SELECT crime_type, COUNT(*) as count\n FROM ${TABLE_NAME}\n GROUP BY crime_type\n ORDER BY count DESC\n `);\n\n return result.rows.map(row => ({\n crime_type: row[0] as string,\n count: row[1] as number\n }));\n}\n\nexport async function updateReportStatus(id: number, status: 'pending' | 'reviewed' | 'resolved'): Promise {\n await sqlite.execute(`\n UPDATE ${TABLE_NAME} \n SET status = ? \n WHERE id = ?\n `, [status, id]);\n}",[],[18,67,320],"b5b315f6-3f90-11f0-9402-76b3cceeab13","migrations.ts","b5b316dc-3f90-11f0-9402-76b3cceeab13",["D",1748855120462],"import { sqlite } from \"https://esm.town/v/stevekrouse/sqlite\";\n\nconst TABLE_NAME = 'crime_reports_v1';\n\nexport async function initializeDatabase() {\n console.log('Initializing database...');\n \n // Create the crime reports table\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${TABLE_NAME} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n crime_type TEXT NOT NULL,\n description TEXT NOT NULL,\n latitude REAL NOT NULL,\n longitude REAL NOT NULL,\n address TEXT,\n reporter_name TEXT,\n reporter_contact TEXT,\n is_anonymous BOOLEAN NOT NULL DEFAULT 0,\n status TEXT NOT NULL DEFAULT 'pending',\n created_at DATETIME DEFAULT CURRENT_TIMESTAMP\n )\n `);\n\n // Create index for location-based queries\n await sqlite.execute(`\n CREATE INDEX IF NOT EXISTS idx_crime_reports_location \n ON ${TABLE_NAME} (latitude, longitude)\n `);\n\n // Create index for crime type queries\n await sqlite.execute(`\n CREATE INDEX IF NOT EXISTS idx_crime_reports_type \n ON ${TABLE_NAME} (crime_type)\n `);\n\n console.log('Database initialized successfully');\n}\n\nexport { TABLE_NAME };",[],[18,67,328],["D",1748855120462],[207,208],[18,67],["D",1748855120462],[206,209,212],[18],["D",1748855067988],{"_11":12,"_152":73},{"_11":12,"_148":-5,"_72":73,"_31":71,"_149":150,"_151":30},{"_42":139,"_13":16,"_36":39,"_140":106,"_141":-5,"_142":-5,"_143":-5,"_144":-5,"_145":-5,"_146":14,"_147":12},"ctx",{"_55":-5,"_171":377,"_378":379,"_380":381,"_382":30,"_383":30,"_384":30,"_385":24,"_386":-5,"_387":-7,"_388":-7,"_389":26,"_390":30,"_391":30,"_392":-5,"_393":30,"_394":30,"_395":30,"_396":-5},"ENV",{"_348":349,"_350":351,"_352":16,"_353":354,"_355":356,"_357":358,"_359":360,"_361":362,"_363":364,"_365":366,"_367":368,"_369":370,"_371":372,"_373":374,"_375":376},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","5015b8df46402d8bba4f485ecc37aec202b0e06b","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 · backend