secubox-openwrt/luci-app-wireguard-dashboard/README.md
CyberMind-FR 403283419c docs: Reorganize documentation structure and add architecture diagrams
Major documentation improvements and restructuring for better maintainability
and navigation.

## Structural Changes

### New Documentation Organization
- Move all documentation to DOCS/ directory for better organization
- Create DOCS/archive/ for historical documents
- Move deployment scripts to secubox-tools/ directory

### Archived Documents
- COMPLETION_REPORT.md → archive/ (project milestone)
- MODULE-ENABLE-DISABLE-DESIGN.md → archive/ (feature implemented)
- BUILD_ISSUES.md → archive/ (issues resolved)
- Add archive/README.md with archiving policy and document index

## Documentation Enhancements

### Version Standardization
- Add version headers to CLAUDE.md (v1.0.0)
- Add version headers to BUILD_ISSUES.md (v1.0.0)
- Standardize date format to YYYY-MM-DD across all docs

### Cross-References & Navigation
- Add "See Also" sections to PERMISSIONS-GUIDE.md
- Add "See Also" sections to VALIDATION-GUIDE.md
- Link quick references to detailed guides
- Improve documentation discoverability

### Architecture Diagrams (Mermaid)
Add 3 professional diagrams to DEVELOPMENT-GUIDELINES.md:

1. **System Architecture Diagram** (§2)
   - Complete data flow: Browser → LuCI → RPCD → ubus → System
   - Color-coded components by layer
   - Shows JavaScript, RPC, RPCD daemon, UCI, system services

2. **Deployment Workflow Diagram** (§9)
   - Step-by-step deployment process with validation checkpoints
   - Error recovery paths for common issues (403, 404, -32000)
   - Local validation, file transfer, permission fixes, service restarts

3. **Component Hierarchy Diagram** (§1)
   - Standard page structure and CSS class relationships
   - Page → Header → Stats → Content → Cards → Buttons
   - Shows design system component organization

## New Files

### TODO-ANALYSE.md
- Comprehensive documentation improvement roadmap
- Tasks categorized: Immediate, Short-term, Long-term, Optional
- Progress tracking with acceptance criteria
- Covers testing, security, performance guides
- Documentation automation plans

## Benefits

 Cleaner project structure (docs in DOCS/, tools in secubox-tools/)
 Better documentation navigation with cross-references
 Visual understanding through architecture diagrams
 Historical documents archived but accessible
 Standardized versioning across all documentation
 Clear roadmap for future documentation improvements

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2025-12-28 09:52:15 +01:00

6.9 KiB

LuCI WireGuard Dashboard

Version: 1.0.0
Last Updated: 2025-12-28
Status: Active

Version License OpenWrt

Modern and intuitive dashboard for WireGuard VPN monitoring on OpenWrt. Visualize tunnels, peers, and traffic in real-time.

Dashboard Preview

Features

🔐 Tunnel Status

  • Real-time interface monitoring
  • Public key display
  • Listen port and MTU info
  • Interface state (up/down)

👥 Peer Management

  • Active/idle/inactive status
  • Endpoint tracking
  • Last handshake time
  • Allowed IPs display
  • Preshared key indicator

📊 Traffic Statistics

  • Per-peer RX/TX bytes
  • Per-interface totals
  • Combined traffic view
  • Visual progress bars

⚙️ Configuration View

  • WireGuard config syntax display
  • Interface and peer sections
  • Tunnel visualization
  • UCI integration info

🎨 Modern Interface

  • Cyan/blue VPN tunnel theme
  • Animated status indicators
  • Responsive grid layout
  • Real-time updates

Screenshots

Status Overview

Status

Peers List

Peers

Traffic Statistics

Traffic

Configuration

Config

Installation

Prerequisites

  • OpenWrt 21.02 or later
  • WireGuard installed (kmod-wireguard, wireguard-tools)
  • LuCI web interface
# Install WireGuard
opkg update
opkg install kmod-wireguard wireguard-tools luci-proto-wireguard

From Source

# Clone into OpenWrt build environment
cd ~/openwrt/feeds/luci/applications/
git clone https://github.com/gkerma/luci-app-wireguard-dashboard.git

# Update feeds and install
cd ~/openwrt
./scripts/feeds update -a
./scripts/feeds install -a

# Enable in menuconfig
make menuconfig
# Navigate to: LuCI > Applications > luci-app-wireguard-dashboard

# Build package
make package/luci-app-wireguard-dashboard/compile V=s

Manual Installation

# Transfer package to router
scp luci-app-wireguard-dashboard_1.0.0-1_all.ipk root@192.168.1.1:/tmp/

# Install on router
ssh root@192.168.1.1
opkg install /tmp/luci-app-wireguard-dashboard_1.0.0-1_all.ipk

# Restart services
/etc/init.d/rpcd restart

Usage

After installation, access the dashboard at:

VPN → WireGuard Dashboard

The dashboard has four tabs:

  1. Status: Overview with interfaces and active peers
  2. Peers: Detailed peer information and status
  3. Traffic: Bandwidth statistics per peer/interface
  4. Configuration: Config file view and tunnel visualization

Architecture

┌─────────────────────────────────────────────────────────┐
│                    LuCI JavaScript                       │
│          (status.js, peers.js, traffic.js)              │
└───────────────────────────┬─────────────────────────────┘
                            │ ubus RPC
                            ▼
┌─────────────────────────────────────────────────────────┐
│                    RPCD Backend                          │
│           /usr/libexec/rpcd/wireguard-dashboard         │
└───────────────────────────┬─────────────────────────────┘
                            │ executes
                            ▼
┌─────────────────────────────────────────────────────────┐
│                     wg show                              │
│                  WireGuard CLI Tool                      │
└───────────────────────────┬─────────────────────────────┘
                            │ manages
                            ▼
┌─────────────────────────────────────────────────────────┐
│                   WireGuard Kernel Module                │
│                    Encrypted Tunnels                     │
└─────────────────────────────────────────────────────────┘

API Endpoints

Method Description
status Overall VPN status, interface/peer counts, total traffic
interfaces Detailed interface info (pubkey, port, IPs, state)
peers All peers with endpoint, handshake, traffic, allowed IPs
traffic Per-peer and per-interface RX/TX statistics
config Configuration display (no private keys exposed)

Peer Status Indicators

Status Meaning Handshake Age
🟢 Active Recent communication < 3 minutes
🟡 Idle No recent traffic 3-10 minutes
Inactive No handshake > 10 minutes or never

Requirements

  • OpenWrt 21.02+
  • kmod-wireguard (kernel module)
  • wireguard-tools (wg command)
  • luci-proto-wireguard (optional, for LuCI config)
  • LuCI (luci-base)
  • rpcd with luci module

Dependencies

  • luci-base
  • luci-lib-jsonc
  • rpcd
  • rpcd-mod-luci
  • wireguard-tools

Security Notes

  • Private keys are never exposed through the dashboard
  • Only public keys and configuration are displayed
  • All data is read-only (no config modifications)
  • RPCD ACLs restrict access to authorized users

Contributing

Contributions are welcome! Please feel free to submit issues and pull requests.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

License

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

Credits


Made with 🔐 for secure networking

WireGuard is a registered trademark of Jason A. Donenfeld.