SIGAP - System Information Geographics Application

Crime Incident Management & Geospatial Intelligence Platform

Built for Polres Jember, Indonesia

Powered by Next.js 15 & React 19

⚠️ INTERNAL USE ONLY
This is a private law enforcement system. Unauthorized access, use, or distribution is strictly prohibited.

Overview

SIGAP is a comprehensive crime incident management and geospatial intelligence platform designed specifically for law enforcement operations in Jember, Indonesia. The system provides real-time crime tracking, advanced analytics, and interactive mapping capabilities to support police operations, investigations, and strategic decision-making.

Key Capabilities

Real-time Crime Monitoring - Track and visualize crime incidents across Jember region
Geospatial Intelligence - Interactive maps with heat maps, clustering, and spatial analysis
Machine Learning Analytics - K-means clustering for crime pattern detection and risk assessment
Evidence Management - Digital evidence tracking with multimedia support
Emergency Response - Panic button system with automated officer dispatch
Performance Metrics - Unit statistics and clearance rate tracking

Technology Stack

Core Framework

Framework - Next.js 15 with App Router
Language - TypeScript
Runtime - Bun for fast package management and execution
Styling - Tailwind CSS v4
Components - Shadcn-ui

Database & Backend

Database - PostgreSQL with PostGIS extension
ORM - Prisma with relationJoins and views
Auth - Supabase Auth
Storage - Supabase Storage for evidence files
Server Actions - Next.js Server Actions with encryption

Geospatial & Mapping

Maps - Mapbox GL JS
Geocoding - @mapbox/mapbox-gl-geocoder
Geospatial Analysis - @turf/turf
Map Components - react-map-gl

Data & Analytics

Machine Learning - ml-kmeans for crime clustering
Statistics - simple-statistics
Charts - Recharts
Data Fetching - TanStack Query
Tables - TanStack Table

State & Forms

State Management - Zustand
URL State - Nuqs
Forms - React Hook Form
Validation - Zod

Developer Experience

Error Tracking - Sentry
Linting - ESLint
Formatting - Prettier
Pre-commit Hooks - Husky
Command Palette - kbar

Additional Libraries

Drag & Drop - @dnd-kit for Kanban board
Animations - Motion (Framer Motion)
Date Handling - date-fns
CSV Processing - csv-parse, csv-parser
Email - Resend with React Email

Features

🗺️ Interactive Crime Map

Real-time geospatial visualization of crime incidents across Jember region.

Multi-layer Mapping - Crime incidents, police units, patrol routes, district boundaries
Heat Maps - Crime density visualization with temporal filtering
Cluster Analysis - Automatic grouping of nearby incidents
Live Markers - Real-time incident markers with detailed popups
EWS Alerts - Early Warning System with audio notifications
Advanced Filtering - By date range, crime type, severity, location, status
Distance Calculations - Nearest police unit routing
Export Capabilities - Map snapshots and filtered data exports

📊 Crime Management System

Comprehensive incident tracking and case management.

Incident Logs - Real-time incident reporting (manual and automated sources)
Crime Incidents - Full CRUD operations for crime cases
Evidence Management - Digital evidence tracking (photos, videos, documents)
Witness Management - Witness information and statement tracking
Timeline Tracking - Chronological event tracking for investigations
Status Workflow - Open, Under Investigation, Resolved, Closed
Crime Categories - Hierarchical categorization system
Victim Tracking - Victim count and information management

🤖 K-Means Clustering Analysis

Machine learning-powered crime pattern detection and risk assessment.

Automated Clustering - K-means algorithm for district risk classification
Risk Levels - Low, Medium, High, Critical classification
Multi-factor Analysis - Crime rates, population density, unemployment data
Temporal Analysis - Monthly and yearly trend analysis
Data Sources - CBT (Crime by Type) and CBU (Crime by Unit)
Interactive Visualizations - Scatter plots, elbow method, silhouette analysis
Batch Processing - Incremental cluster updates for performance
Predictive Analytics - Resource allocation recommendations

👮 Patrol Unit Management

Real-time patrol unit tracking and assignment.

Unit Tracking - GPS-based location monitoring
Patrol Assignment - Individual and group patrol categories
Member Management - Officer assignment to patrol units
Performance Metrics - Unit statistics and response times
Coverage Analysis - Patrol coverage heat maps
Dispatch System - Automated officer dispatch suggestions
Status Monitoring - Active, standby, responding status tracking

🚨 Panic Button System

Emergency alert system for citizens with abuse prevention.

One-tap Emergency - Quick panic button for citizens
Incident Linking - Automatic incident log creation
Strike Tracking - Abuse prevention with strike system
Officer Response - Real-time officer notification and dispatch
Location Tracking - Automatic GPS location capture
Response Metrics - Response time tracking and analytics

📈 Demographics & Geographic Management

Population and geographic data management for analysis.

District Management - Administrative boundary data for Jember
Population Statistics - Population, density, unemployment tracking
Geographic Data - PostGIS-powered coordinate and polygon management
Yearly Trends - Year-over-year demographic analysis
Integration - Seamless integration with crime clustering algorithms
Data Import - CSV import for bulk demographic updates

👥 User & Access Management

Role-based access control for officers and citizens.

User Roles - Citizens, Officers, Administrators, Analysts
Officer Management - Police personnel with ranks and positions
Granular Permissions - Resource-based access control
Profile Management - User profiles with authentication
Session Tracking - Active session monitoring
Audit Logs - Comprehensive user action logging

📋 Task Management

Kanban-style task tracking for investigations and operations.

Kanban Board - Drag-and-drop task management
Task Categories - Report, Investigation, Patrol, Evidence, etc.
Priority Levels - Low, Medium, High priority
Status Workflow - Todo, In Progress, Done, Canceled
Time Tracking - Estimated hours and completion tracking
Assignment - Task assignment to officers
Archive System - Completed task archiving

📬 Messaging & Inbox System

Internal communication between users and officers.

Direct Messaging - User-to-officer and officer-to-officer communication
File Attachments - Support for documents, images, videos
Message Status - New, Read, Replied, Closed tracking
Starred Messages - Important message flagging
Unread Counter - Real-time unread message tracking
Message Types - Categorized message types for organization

Note: Messaging system is currently under active development.

📊 Analytics & Reporting

Comprehensive reporting and data visualization.

Crime Statistics - Total crimes, clearance rates, trends
Unit Performance - Department-level performance metrics
Temporal Analysis - Monthly, yearly, and custom date range reports
Export Formats - CSV, PDF, JSON exports
Chart Visualizations - Line charts, bar charts, pie charts, heat maps
Custom Reports - Configurable report generation
Dashboard Widgets - Real-time KPI monitoring

Project Structure

SIGAP follows a feature-based organization pattern for scalability and maintainability.

sigap/
├── src/
│   ├── app/                          # Next.js App Router
│   │   ├── auth/                     # Authentication routes
│   │   │   ├── sign-in/
│   │   │   ├── sign-up/
│   │   │   ├── forgot-password/
│   │   │   ├── reset-password/
│   │   │   └── otp-verification/
│   │   ├── dashboard/                # Protected dashboard routes
│   │   │   ├── home/                 # Dashboard overview
│   │   │   ├── map/                  # Interactive crime map
│   │   │   ├── crimes/               # Crime management
│   │   │   ├── demographics/         # Demographics data
│   │   │   ├── geographies/          # Geographic data
│   │   │   ├── kmeans/               # K-means clustering
│   │   │   ├── users/                # User management
│   │   │   ├── inbox/                # Messaging system
│   │   │   ├── profile/              # User profile
│   │   │   ├── systems/              # System settings
│   │   │   └── overview/             # Analytics overview
│   │   └── api/                      # API routes
│   │
│   ├── features/                     # Feature modules
│   │   ├── auth/                     # Authentication logic
│   │   ├── crimes/                   # Crime management
│   │   ├── crime-incidents/          # Incident tracking
│   │   ├── crime-categories/         # Crime categorization
│   │   ├── demographics/             # Demographics management
│   │   ├── districts/                # District management
│   │   ├── evidence/                 # Evidence management
│   │   ├── geographics/              # Geographic data
│   │   ├── incident-logs/            # Incident logging
│   │   ├── kmeans/                   # K-means clustering
│   │   ├── locations/                # Location management
│   │   ├── map/                      # Map components
│   │   ├── panic-button/             # Panic button system
│   │   ├── patrol-units/             # Patrol management
│   │   ├── units/                    # Police units
│   │   ├── users/                    # User management
│   │   ├── roles/                    # Role management
│   │   ├── permissions/              # Permission system
│   │   ├── task/                     # Task management
│   │   ├── inbox/                    # Messaging
│   │   ├── timelines/                # Timeline tracking
│   │   └── witneses/                 # Witness management
│   │
│   ├── components/                   # Shared components
│   │   ├── ui/                       # Shadcn-ui components
│   │   ├── layout/                   # Layout components
│   │   └── ...                       # Other shared components
│   │
│   ├── lib/                          # Core utilities
│   │   ├── db/                       # Database utilities
│   │   ├── auth/                     # Auth helpers
│   │   └── utils/                    # Shared utilities
│   │
│   ├── hooks/                        # Custom React hooks
│   ├── stores/                       # Zustand state stores
│   ├── types/                        # TypeScript types
│   ├── constants/                    # App constants
│   ├── config/                       # Configuration files
│   └── supabase/                     # Supabase client
│
├── prisma/                           # Database schema & migrations
│   ├── schema.prisma                 # Prisma schema
│   ├── seed.ts                       # Database seeding
│   └── migrations/                   # Migration files
│
├── public/                           # Static assets
├── docs/                             # Documentation
└── .github/                          # GitHub workflows

Feature Module Structure

Each feature follows a consistent structure:

features/[feature-name]/
├── components/          # Feature-specific components
├── actions/            # Server actions
├── schemas/            # Zod validation schemas
├── hooks/              # Feature-specific hooks
├── utils/              # Feature utilities
└── types/              # Feature types

Getting Started

Prerequisites

Before you begin, ensure you have the following installed:

Bun v1.0 or higher
Node.js v18 or higher (for compatibility)
PostgreSQL v14+ with PostGIS extension
Git

Required Accounts

You'll need accounts for the following services:

Supabase - Database, Auth, and Storage
Mapbox - Map tiles and geocoding
Sentry (optional) - Error tracking
Resend (optional) - Email service

Installation

Clone the repository

git clone https://github.com/vergiLgood1/sigap-website-jember.git
cd sigap-website-jember

Install dependencies

bun install

Set up environment variables

Create a .env.local file by copying the example:

cp .env.example .env.local

Then configure the following environment variables:

# Database
DATABASE_URL="postgresql://user:password@host:5432/sigap?pgbouncer=true"
DB_DIRECT_URL="postgresql://user:password@host:5432/sigap"

# Supabase
NEXT_PUBLIC_SUPABASE_URL="https://your-project.supabase.co"
NEXT_PUBLIC_SUPABASE_ANON_KEY="your-anon-key"
SERVICE_ROLE_SECRET="your-service-role-secret"

# Mapbox
NEXT_PUBLIC_MAPBOX_ACCESS_TOKEN="your-mapbox-token"
NEXT_PUBLIC_MAPBOX_TILESET_ID="your-tileset-id"

# Next.js
NEXT_SERVER_ACTIONS_ENCRYPTION_KEY="your-32-char-encryption-key"

# Sentry (optional)
NEXT_PUBLIC_SENTRY_ORG="your-org"
NEXT_PUBLIC_SENTRY_PROJECT="your-project"
NEXT_PUBLIC_SENTRY_TOKEN="your-token"

# Email (optional)
RESEND_API_KEY="your-resend-key"
SEND_EMAIL_HOOK_SECRET="your-webhook-secret"

# Pexels (optional - for stock images)
PEXELS_API_KEY="your-pexels-key"

Set up the database

Run Prisma migrations to create the database schema:

bun prisma migrate deploy

Generate Prisma client:

bun prisma generate

Seed the database (optional)

Populate the database with initial data:

bun prisma db seed

To reset and reseed:

bun prisma db seed:reset

Run the development server

bun dev

The application will be available at http://localhost:3000

Database Setup

Supabase Setup

Create a new project on Supabase
Enable PostGIS extension:
- Go to Database → Extensions
- Search for "postgis" and enable it
Copy your connection strings from Settings → Database
Update your .env.local with the connection strings

Local PostgreSQL Setup

If you prefer to run PostgreSQL locally:

# Install PostgreSQL with PostGIS
# Ubuntu/Debian
sudo apt-get install postgresql postgis

# macOS
brew install postgresql postgis

# Create database
createdb sigap

# Enable PostGIS extension
psql sigap -c "CREATE EXTENSION postgis;"

Development Commands

# Development
bun dev                    # Start development server
bun build                  # Build for production
bun start                  # Start production server

# Database
bun prisma migrate dev     # Create and apply migrations
bun prisma migrate deploy  # Apply migrations (production)
bun prisma generate        # Generate Prisma client
bun prisma studio          # Open Prisma Studio
bun prisma db seed         # Seed database

# Code Quality
bun lint                   # Run ESLint
bun lint:fix               # Fix ESLint errors
bun lint:strict            # Strict linting (max warnings = 0)
bun format                 # Format with Prettier
bun format:check           # Check formatting

# Testing
bun test                   # Run tests (if configured)

Deployment

Docker Deployment

SIGAP includes Docker support for containerized deployment.

Build and Run with Docker Compose

# Build and start containers
docker compose up --build

# Run in detached mode
docker compose up -d --build

# Stop containers
docker compose down

The application will be available at http://localhost:3000

Build Docker Image

# Build for your platform
docker build -t sigap:latest .

# Build for specific platform (e.g., for cloud deployment)
docker build --platform=linux/amd64 -t sigap:latest .

# Push to registry
docker tag sigap:latest your-registry.com/sigap:latest
docker push your-registry.com/sigap:latest

Environment Variables for Docker

Create a .env file for Docker deployment with production values:

NODE_ENV=production
DATABASE_URL="your-production-db-url"
NEXT_PUBLIC_SUPABASE_URL="your-supabase-url"
# ... other production variables

Vercel Deployment

SIGAP is optimized for deployment on Vercel.

Prerequisites

Install Vercel CLI: npm i -g vercel
Link your project: vercel link

Deploy to Vercel

# Deploy to preview
vercel

# Deploy to production
vercel --prod

Environment Variables on Vercel

Add environment variables via Vercel Dashboard or CLI:

# Via CLI
vercel env add DATABASE_URL
vercel env add NEXT_PUBLIC_SUPABASE_URL
# ... add all required variables

Or via Vercel Dashboard:

Go to your project settings
Navigate to Environment Variables
Add all variables from .env.example

Vercel Configuration

The project includes next.config.ts with:

Standalone output mode for optimal performance
Sentry integration (optional)
Image optimization for remote patterns

Production Checklist

Before deploying to production:

Security Considerations

⚠️ IMPORTANT: This is a law enforcement system handling sensitive data.

Data Protection

All user passwords are hashed using Supabase Auth
Server Actions are encrypted with NEXT_SERVER_ACTIONS_ENCRYPTION_KEY
Database connections use SSL/TLS in production
File uploads are scanned and validated
Sensitive data is never logged or exposed in client-side code

Access Control

Role-based access control (RBAC) for all features
Resource-level permissions for granular access
Session management with automatic expiration
IP-based access restrictions (configure as needed)
Audit logging for all critical operations

Best Practices

Never commit .env or .env.local files
Rotate API keys and secrets regularly
Use environment-specific credentials
Enable Supabase Row Level Security (RLS) policies
Implement rate limiting for public endpoints
Regular security audits and dependency updates
Monitor for suspicious activities via Sentry

Contributing

This is a private internal system. Contributions are limited to authorized personnel only.

Development Workflow

Create a feature branch: git checkout -b feature/your-feature
Make your changes following the project structure
Run linting and formatting: bun lint:fix && bun format
Test your changes thoroughly
Commit with descriptive messages
Push and create a pull request

Code Standards

Follow TypeScript best practices
Use Zod for all data validation
Write server actions for data mutations
Keep components small and focused
Document complex logic with comments
Use feature-based organization

Troubleshooting

Common Issues

Database Connection Errors

# Check if PostGIS is enabled
psql your-database -c "SELECT PostGIS_version();"

# Regenerate Prisma client
bun prisma generate

Mapbox Not Loading

Verify NEXT_PUBLIC_MAPBOX_ACCESS_TOKEN is set
Check token restrictions in Mapbox dashboard
Ensure token has appropriate scopes

Build Errors

# Clear Next.js cache
rm -rf .next

# Clear node_modules and reinstall
rm -rf node_modules bun.lock
bun install

Supabase Auth Issues

Verify Supabase URL and keys are correct
Check if email confirmation is required
Review Supabase Auth settings and providers

License

This project is licensed under the MIT License - see the LICENSE file for details.

Note: While the codebase is MIT licensed, this is an internal law enforcement system. Deployment and use are restricted to authorized personnel only.

Author

Diyo Anggara

GitHub: @vergiLgood1

Acknowledgments

Built with modern web technologies:

Next.js - React framework
Supabase - Backend infrastructure
Mapbox - Mapping platform
Shadcn-ui - UI components
Prisma - Database ORM

Support

For technical support or questions, contact the development team.

System Version: 1.0.0
Last Updated: May 2026

SIGAP - Sistem Informasi Geografis Aplikasi Polres Jember
Empowering law enforcement with geospatial intelligence

Name		Name	Last commit message	Last commit date
.github		.github
.husky		.husky
.vscode		.vscode
docs		docs
prisma		prisma
public		public
src		src
.dockerignore		.dockerignore
.eslintrc.json		.eslintrc.json
.gitignore		.gitignore
.npmrc		.npmrc
.prettierignore		.prettierignore
.prettierrc		.prettierrc
.sentryclirc		.sentryclirc
CONTRIBUTING.md		CONTRIBUTING.md
Dockerfile		Dockerfile
LICENSE		LICENSE
README.md		README.md
SECURITY.md		SECURITY.md
bun.lock		bun.lock
components.json		components.json
compose.yaml		compose.yaml
next.config.ts		next.config.ts
package.json		package.json
postcss.config.js		postcss.config.js
tsconfig.json		tsconfig.json

Latest commit

History

Folders and files

Repository files navigation

SIGAP - System Information Geographics Application

Overview

Key Capabilities

Technology Stack

Core Framework

Database & Backend

Geospatial & Mapping

Data & Analytics

State & Forms

Developer Experience

Additional Libraries

Features

🗺️ Interactive Crime Map

📊 Crime Management System

🤖 K-Means Clustering Analysis

👮 Patrol Unit Management

🚨 Panic Button System

📈 Demographics & Geographic Management

👥 User & Access Management

📋 Task Management

📬 Messaging & Inbox System

📊 Analytics & Reporting

Project Structure

Feature Module Structure

Getting Started

Prerequisites

Required Accounts

Installation

Database Setup

Supabase Setup

Local PostgreSQL Setup

Development Commands

Deployment

Docker Deployment

Build and Run with Docker Compose

Build Docker Image

Environment Variables for Docker

Vercel Deployment

Prerequisites

Deploy to Vercel

Environment Variables on Vercel

Vercel Configuration

Production Checklist

Security Considerations

Data Protection

Access Control

Best Practices

Contributing

Development Workflow

Code Standards

Troubleshooting

Common Issues

License

Author

Acknowledgments

Support

About

Topics

Resources

Contributing

Security policy

Stars

Watchers

Forks

Releases

Sponsor this project

Packages

Contributors

Languages