Community Incident Reporter

Lets residents report incidents like crime, disputes, and traffic issues with details, location, and images. AI converts reports into structured, formal documents ready for authorities

Comment

Name: Community Incident Reporter

Basic Overview: Community Incident Reporter is a platform that allows community members to report incidents such as illegal activities, disputes, traffic issues, and crashes. Users can submit reports with details, locations, and images. The platform also features a community discussion section where users can comment on and like reports. A key feature is the integration of AI to automatically generate formal, structured official reports from user-submitted incident data, ready to be sent to relevant authorities.

Technical Explanation

Architecture: The application follows a full-stack architecture using a React frontend and an Express backend, both served together during development using Vite middleware.

  • Frontend: Built with React, utilizing functional components and hooks. It uses Tailwind CSS for styling, Lucide React for icons, and Motion for animations. React-Markdown is used to render the AI-generated reports.
  • Backend: Built with Express.js, providing RESTful API endpoints for user authentication, report submission, commenting, and liking.
  • Database: Uses better-sqlite3 for local, file-based SQLite database storage (incidents.db), managing users, reports, comments, and likes.
  • Real-time: Uses WebSockets (ws) to broadcast new comments and likes to all connected clients in real-time.

Tech Stack:

  • Frontend: React 18, Vite, Tailwind CSS, Lucide React, Motion, React-Markdown, date-fns.
  • Backend: Node.js, Express.js, WebSockets (ws), better-sqlite3.
  • AI Integration: @google/genai SDK for interacting with Gemini models.

Prompt Design

Prompt Engineering Process: The prompt used to generate the official incident report is designed to be clear, structured, and context-rich.

  1. Objective Context: The prompt starts by clearly stating the goal: "Generate a formal incident report for the following activity to be sent to the authority:". This sets the tone and purpose for the AI.
  2. Data Injection: We inject all relevant data points from the user's report directly into the prompt using template literals. This includes:
    • Incident Reference (ID)
    • Type of incident
    • Reporter's name
    • Date and Time
    • Location
    • Description
    • Metadata (JSON stringified for structured key-value pairs)
  3. Formatting Instructions: Finally, the prompt provides specific instructions on the desired output format: "The report should be professional, objective, and structured with clear headings (e.g., Executive Summary, Incident Details, Involved Parties, Conclusion)." This ensures the generated report is ready for official use without requiring significant manual editing.
  4. Model Selection: We use the gemini-3-flash-preview model, which is well-suited for fast, high-quality text generation tasks like summarizing and structuring information.

https://github.com/distareza/GuardianEyes

Built With

  • vibecodingusinggemini
Share this project:

Updates