Skip to content

exploopio/ui

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

187 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Exploop CTEM Platform

Next.js TypeScript License Docker

Continuous Threat Exposure Management (CTEM) platform built with Next.js 16, featuring the complete 5-stage CTEM process: Scoping, Discovery, Prioritization, Validation, and Mobilization.

Rediver Dashboard

Overview

Rediver is an enterprise-grade Attack Surface Management (ASM) and Vulnerability Management platform that helps security teams continuously monitor, assess, and remediate security risks across their digital infrastructure.

Key Features

CTEM 5-Stage Process

  • Scoping - Define attack surface boundaries and business context
  • Discovery - Automated asset discovery (domains, websites, services, repositories, cloud, credentials)
  • Prioritization - Risk-based vulnerability prioritization with business impact analysis
  • Validation - Attack simulation and security control testing
  • Mobilization - Remediation task management with workflow automation

Asset Management

  • 6 Asset Types - Domains, Websites, Services, Repositories, Cloud Assets, Credential Leaks
  • Asset Groups - Organize assets by environment (Production, Staging, Development)
  • Risk Scoring - 0-100 risk scores with severity-based visualization

Scan Management

  • Single Scans - One-time scans with custom configuration
  • Workflow Scans - Predefined multi-tool workflows (Full Recon, Vuln Assessment, etc.)
  • Scan Runners - Distributed scan execution with runner management
  • Agent Preference - Choose between tenant-owned or platform agents:
    • Auto - Platform decides based on quota and availability
    • Tenant - Use only tenant-owned agents
    • Platform - Use shared platform agents (quota-based)

Findings & Remediation

  • Severity Classification - Critical, High, Medium, Low, Info
  • CVSS Scoring - Industry-standard vulnerability scoring
  • Task Management - Kanban-style remediation workflow
  • Assignee Tracking - Team-based task assignment

Security & Authentication

  • Keycloak OAuth2/OIDC - Enterprise-grade authentication
  • Role-Based Access Control - Fine-grained permissions
  • Secure Cookies - HttpOnly, Secure, SameSite
  • CSRF Protection - Cross-site request forgery prevention

Deployment & Operations

  • Docker Support - Multi-stage optimized build with health checks
  • Nginx Configuration - Reverse proxy with SSL/TLS and rate limiting
  • Health Monitoring - Built-in /api/health endpoint
  • Production-Ready - Environment validation, security hardening

📚 Documentation

Guide Description
Getting Started Quick start guide
Development Setup IDE, debugging, testing
Authentication JWT & OIDC auth flow
Multi-tenancy Teams & tenant switching
Permissions Role-based access control
API Reference Complete API endpoints
Configuration Environment variables
Troubleshooting Common issues

🛠️ Tech Stack

Framework & Runtime:

  • Next.js 16.0.8 (App Router)
  • React 19
  • Node.js 20+

Authentication:

  • Keycloak (OAuth2/OIDC)
  • JWT token validation
  • Cookie-based sessions

UI & Styling:

  • Tailwind CSS 4
  • shadcn/ui components
  • Radix UI primitives

State & Data:

  • Zustand (global state)
  • SWR (data fetching)
  • Zod (validation)

Testing:

  • Vitest
  • React Testing Library
  • V8 coverage

DevOps:

  • Docker
  • Nginx
  • Sentry (optional)

📋 Prerequisites

Before you begin, ensure you have:

  • Node.js 20+ - Download
  • npm (comes with Node.js)
  • Keycloak Server - Setup Guide
  • Backend API (optional) - Your separate backend service

🚀 Quick Start

1. Clone & Install

# Clone repository
git clone <repository-url>
cd codebase-nextjs

# Install dependencies
npm install

2. Environment Setup

# Copy environment template
cp .env.example .env.local

# Generate CSRF secret
npm run generate-secret

# Edit .env.local with your values
nano .env.local

Required environment variables:

# Keycloak Configuration
NEXT_PUBLIC_KEYCLOAK_URL=http://localhost:8080
NEXT_PUBLIC_KEYCLOAK_REALM=your-realm
NEXT_PUBLIC_KEYCLOAK_CLIENT_ID=your-client-id
KEYCLOAK_CLIENT_SECRET=your-client-secret

# Backend API
NEXT_PUBLIC_BACKEND_API_URL=http://localhost:8000

# Security
CSRF_SECRET=<generated-secret>
SECURE_COOKIES=false  # Set to true in production

# Application
NEXT_PUBLIC_APP_URL=http://localhost:3000
NODE_ENV=development

3. Setup Keycloak

Follow the Keycloak Setup Guide to:

  1. Install Keycloak server
  2. Create realm and client
  3. Configure redirect URIs
  4. Get client credentials

4. Run Development Server

npm run dev

Open http://localhost:3000 in your browser.


📚 Documentation

Comprehensive documentation is available in the docs/ directory:

Getting Started

Authentication

Backend Integration

Deployment


🔧 Available Scripts

# Development
npm run dev              # Start development server (port 3000)

# Building
npm run build            # Create production build
npm start                # Start production server

# Code Quality
npm run lint             # Run ESLint
npm run type-check       # Run TypeScript checks
npm test                 # Run tests
npm run test:coverage    # Run tests with coverage
npm run test:ui          # Run tests with UI

# Utilities
npm run generate-secret  # Generate CSRF secret

Project Structure

ui/
├── src/
│   ├── app/                      # Next.js App Router pages
│   │   ├── (auth)/               # Auth pages (login, register)
│   │   ├── (dashboard)/          # Protected dashboard pages
│   │   │   ├── page.tsx          # CTEM Dashboard
│   │   │   ├── asset-groups/     # Asset Groups management
│   │   │   ├── discovery/        # Discovery pages
│   │   │   │   ├── scans/        # Scan management
│   │   │   │   ├── runners/      # Scan runners
│   │   │   │   └── assets/       # Asset inventory (6 types)
│   │   │   ├── findings/         # Findings list
│   │   │   └── mobilization/     # Remediation tasks
│   │   └── api/                  # API routes
│   │       └── health/           # Health check endpoint
│   ├── components/               # Shared components
│   │   ├── ui/                   # shadcn/ui components
│   │   └── layout/               # Layout components
│   ├── features/                 # Feature-based modules
│   │   ├── auth/                 # Authentication
│   │   ├── assets/               # Asset management
│   │   ├── findings/             # Findings & vulnerabilities
│   │   ├── scans/                # Scan management
│   │   ├── remediation/          # Remediation tasks
│   │   └── shared/               # Shared CTEM components
│   ├── lib/                      # Shared utilities
│   └── stores/                   # Zustand stores
├── docs/                         # Documentation
├── nginx/                        # Nginx configuration
│   ├── nginx.conf               # Main Nginx config (SSL, rate limiting)
│   ├── ssl/                     # SSL certificates directory
│   └── README.md                # SSL setup instructions
├── docs/images/                  # README images/screenshots
├── Dockerfile                    # Multi-stage build (dev & prod targets)
├── docker-compose.yml            # Development with hot reload
├── docker-compose.prod.yml       # Production with Nginx/SSL
└── docker-compose.prod-simple.yml # Production without Nginx

🧪 Testing

Run Tests

# Run all tests
npm test

# Run with coverage
npm run test:coverage

# Run with UI
npm run test:ui

# Watch mode
npm test -- --watch

Coverage Report

Current coverage: 84.28% overall, 95%+ on critical auth components

src/
├── features/auth/        95.2% ✅
├── lib/keycloak/         94.8% ✅
├── stores/auth-store.ts  98.1% ✅
└── Overall               84.28% ✅

🚀 Deployment

Option 1: Vercel (Recommended for quick deployment)

# Install Vercel CLI
npm i -g vercel

# Deploy
vercel

See Deployment Guide for details.

Option 2: Docker (Recommended for production)

Docker Compose Files

File Purpose Includes Nginx
docker-compose.yml Development No
docker-compose.prod.yml Production (full) Yes (SSL/TLS)
docker-compose.prod-simple.yml Production (simple) No

Development (with hot reload)

docker compose up --build

Features:

  • Hot reload with volume mounts
  • Port 3000 exposed
  • Environment from .env.local

Production with Nginx (Recommended)

Full production setup with built-in Nginx reverse proxy for SSL/TLS termination.

# 1. Setup SSL certificates (see nginx/README.md)
#    - Option A: Let's Encrypt (recommended for public domains)
#    - Option B: Self-signed (for testing only)

# 2. Update nginx/nginx.conf with your domain
sed -i 's/your-domain.com/yourdomain.com/g' nginx/nginx.conf

# 3. Create .env file
cp .env.example .env
# Edit with your values

# 4. Start
docker compose -f docker-compose.prod.yml up --build -d

# View logs
docker compose -f docker-compose.prod.yml logs -f

Features:

  • Nginx reverse proxy (ports 80, 443)
  • HTTP to HTTPS redirect
  • SSL/TLS termination
  • Security headers (HSTS, X-Frame-Options, etc.)
  • Rate limiting
  • Gzip compression
  • Static asset caching

Production without Nginx (External Proxy)

Use this when you have an external reverse proxy (cloud load balancer, Traefik, Kubernetes Ingress).

docker compose -f docker-compose.prod-simple.yml up --build -d

When to use:

  • AWS ALB, GCP Load Balancer, Azure App Gateway
  • Kubernetes Ingress
  • Traefik, Caddy as external proxy
  • Cloudflare Tunnel

Docker Image Sizes:

Target Size Use Case
development ~1.3GB Local dev with hot reload
production ~341MB Optimized production

See Docker Setup Guide for details.

Option 3: Traditional Server

# Build
npm run build

# Start
npm start

See Deployment Guide for details.

Pre-Deployment Checklist

Before deploying to production, complete the Production Checklist:

  • Environment variables configured
  • SECURE_COOKIES=true
  • CSRF_SECRET generated (64+ characters)
  • Keycloak configured with HTTPS
  • Backend API accessible
  • Build passes successfully
  • Tests passing
  • Security headers configured

🔒 Security

This project implements multiple security layers:

  • Secure Authentication - OAuth2/OIDC with Keycloak
  • Cookie Security - HttpOnly, Secure, SameSite=Lax
  • CSRF Protection - Double-submit cookie pattern
  • XSS Prevention - Content Security Policy headers
  • Clickjacking Protection - X-Frame-Options
  • MIME Sniffing Protection - X-Content-Type-Options
  • Open Redirect Prevention - URL validation
  • Environment Validation - Build-time checks
  • Input Validation - Zod schemas

See Security Documentation for details.


🐛 Troubleshooting

Common Issues

Authentication errors:

API connection issues:

  • Check NEXT_PUBLIC_BACKEND_API_URL in .env.local
  • Verify backend is running
  • Check CORS configuration on backend

Build errors:

  • Ensure all environment variables are set
  • Run npm run type-check to find TypeScript errors
  • Check Node.js version (requires 20+)

Docker issues:


📞 Support


Project Status

Version: 1.0.0 Status: UI Complete - Ready for Backend Integration Last Updated: 2026-01-08

Completed (UI - 95%)

  • CTEM Dashboard with 5-stage process visualization
  • Asset Management (6 types with full CRUD)
  • Asset Groups with risk scoring
  • Findings management with severity classification
  • Scan Management (Single + Workflow modes)
  • Scan Runners with status monitoring
  • Remediation Tasks with Kanban view
  • Docker deployment with health checks
  • Keycloak authentication integration
  • Security hardening
  • Platform Agent Support:
    • Agent preference selection in Create Scan form
    • Platform agent status indicator in Runs table
    • Queue position display for platform jobs
    • Platform usage quota card

Pending (Backend - 0%)

  • Backend API development
  • Database schema implementation
  • Real scan engine integration
  • User management system
  • Report generation

Roadmap

  • CI/CD pipeline
  • Real-time notifications
  • Performance monitoring (Sentry)
  • Multi-tenancy support

💖 Support

If you find Rediver useful, please consider supporting the project:

BSC Network (BEP-20):

0x97f0891b4a682904a78e6Bc854a58819Ea972454

📄 License

MIT License - See LICENSE file for details.


🙏 Acknowledgments

Built with:


For detailed documentation, see docs/README.md

About

Rediver

Resources

License

Stars

0 stars

Watchers

0 watching

Forks

Packages

 
 
 

Contributors