Skip to content

Latest commit

Β 

History

History
329 lines (192 loc) Β· 5.91 KB

File metadata and controls

329 lines (192 loc) Β· 5.91 KB

🌍 Community Issue Reporting Platform (CIRP) – Community Problem Reporting System

πŸš€ Features

User Portal (Reporter)

πŸ“ Submit new reports (title, description, category, location)

πŸ“Œ View all submitted reports

πŸ–ΌοΈ Optional: Upload image (placeholder logic supported)

πŸ” View the status of each report (Pending β†’ In Progress β†’ Resolved)

πŸ•’ Track creation timeline

Admin Portal

πŸ‘€ View all reports from users

πŸ”§ Update report status (workflow-based)

πŸ—‘οΈ Delete or archive reports

πŸ“Š Monitor report trends and categories

πŸ—‚οΈ Filter reports by status/category

Super Admin Portal (Optional for Expansion)

πŸ‘” Manage admin accounts

πŸŽ›οΈ Full control over system settings

🎯 Access logs and maintenance tools

πŸ›‘οΈ Configure security & roles


πŸ› οΈ Tech Stack

Frontend: Next.js 15 (App Router), React, TailwindCSS

Backend: NestJS (Controllers β†’ Services β†’ Repositories)

Database: PostgreSQL

Authentication (optional): JWT (Admin login)

Realtime Updates (optional): Socket.io

Deployment: Vercel (Frontend), Supabase / Railway / Render (Backend)

Language: TypeScript


πŸ“¦ Quick Start

Prerequisites

Node.js 18+

PostgreSQL installed locally or cloud database

(Optional) Docker for easy setup

Installation

  1. Clone repository & install dependencies:

npm install

  1. Configure environment variables:

cp .env.example .env

Then edit .env with your database credentials:

DATABASE_URL=postgres://user:password@localhost:5432/irp JWT_SECRET=your_secret_key PORT=3000

  1. Set up PostgreSQL database:

manually run SQL from database/schema.sql

  1. Run backend server:
npm run start:dev
  1. Run frontend server:

npm run dev

Then open: πŸ‘‰ http://localhost:3000/


πŸ“ Project Structure

issue-reporting-platform/


Next.js App Router with Serverless API + Layered (Controller–Service) Architecture

β”œβ”€β”€ app/
β”‚   β”œβ”€β”€ admin/
β”‚   β”‚   └── (admin-related pages and components)
β”‚   β”œβ”€β”€ dashboard/
β”‚   β”‚   β”œβ”€β”€ components/
β”‚   β”‚   β”‚   └── api.ts
β”‚   β”‚   └── (dashboard-related pages and components)
β”‚   β”œβ”€β”€ [[...sign-in]]/
β”‚   β”‚   └── page.tsx
β”‚   β”œβ”€β”€ [[...sign-up]]/
β”‚   β”‚   └── page.tsx
β”‚   β”œβ”€β”€ components/
β”‚   β”‚   β”œβ”€β”€ EnhancedQRCode.tsx
β”‚   β”‚   β”œβ”€β”€ FeaturesSection.tsx
β”‚   β”‚   β”œβ”€β”€ HeroSection.tsx
β”‚   β”‚   β”œβ”€β”€ Navbar.tsx
β”‚   β”‚   └── TestimonialCarousel.tsx
β”‚   β”œβ”€β”€ hooks/
β”‚   β”‚   └── useProfileStatus.ts
β”‚   β”œβ”€β”€ types/
β”‚   β”‚   └── (type definitions)
β”‚   β”œβ”€β”€ layout.tsx
β”‚   └── page.tsx
β”œβ”€β”€ backend/
β”‚   β”œβ”€β”€ controllers/
β”‚   β”‚   └── services/
β”‚   β”‚       └── db/
β”‚   β”‚           └── utils/
β”‚   β”œβ”€β”€ db/
β”‚   β”œβ”€β”€ services/
β”‚   β”œβ”€β”€ types/
β”‚   └── utils/
β”œβ”€β”€ components/
β”‚   └── (Global reusable components if any)
β”œβ”€β”€ hooks/
β”‚   └── (Global reusable hooks if any)
β”œβ”€β”€ lib/
β”‚   └── supabaseClient.ts
β”œβ”€β”€ public/
β”‚   └── (Static assets like images, fonts, etc.)
β”œβ”€β”€ .env.example
β”œβ”€β”€ .gitignore
β”œβ”€β”€ api.rest
β”œβ”€β”€ eslint.config.mjs
β”œβ”€β”€ next.config.ts
β”œβ”€β”€ package.json
β”œβ”€β”€ postcss.config.mjs
β”œβ”€β”€ README.md
└── tsconfig.json


πŸ—„οΈ Database Schema

reports

Column Type Description

-- Create reports table
CREATE TABLE reports (
  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
  user_id TEXT NOT NULL,
  title TEXT NOT NULL,
  description TEXT NOT NULL,
  category TEXT NOT NULL,
  location TEXT NOT NULL,
  image_url TEXT,
  status TEXT NOT NULL DEFAULT 'pending',
  created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
  updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW()
);

-- Enable RLS
ALTER TABLE reports ENABLE ROW LEVEL SECURITY;

-- Policy: Users can view all reports (public read)
CREATE POLICY "Anyone can view reports"
  ON reports FOR SELECT
  USING (true);

-- Policy: Users can insert their own reports
CREATE POLICY "Users can insert their own reports"
  ON reports FOR INSERT
  WITH CHECK (auth.uid()::text = user_id);

-- Policy: Users can update their own reports
CREATE POLICY "Users can update their own reports"
  ON reports FOR UPDATE
  USING (auth.uid()::text = user_id)
  WITH CHECK (auth.uid()::text = user_id);

-- Policy: Users can delete their own reports
CREATE POLICY "Users can delete their own reports"
  ON reports FOR DELETE
  USING (auth.uid()::text = user_id);

-- Optional: Create index on user_id for faster queries
CREATE INDEX reports_user_id_idx ON reports(user_id);
CREATE INDEX reports_created_at_idx ON reports(created_at DESC);

See database/schema.sql for full schema.


πŸ” Authentication (Bonus Feature)

User Roles

  1. User (Reporter) – Create & view reports

  2. Admin – Manage reports

  3. Super Admin – Manage admins + full control

JWT-based login for Admin (optional enhancement).


🧭 API Endpoints

POST /api/report

Create a new report

GET /api/report

Fetch all reports

GET /api/report/:id

Fetch single report by ID

PATCH /api/report/:id/status

Update report status

DELETE /api/report/:id

Delete or archive report

All responses return structured JSON.


🚒 Deployment

Frontend (Next.js) β†’ Deploy to Vercel

vercel

Add environment variables to Vercel dashboard

Backend (NextJS) β†’ Deploy to Render / Railway / Supabase

Add environment variables

Connect PostgreSQL instance

Build & deploy


πŸ“ Development Timeline

βœ… Week 1: Project scaffolding, DB design, backend modules

πŸ”„ Week 2: API development, frontend pages

⏳ Week 3: Admin panel + workflows

⏳ Week 4: Testing, optimization, documentation, deployment


πŸ‘¨β€πŸ’» Author

Ugwoke Levi Soromto (Levibliz)

GitHub: (Add your GitHub link here)

Email: levisoromto1m@gmail.com


Built with NestJS & Next.js | Powered by PostgreSQL