92eff5aad7
11 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
| 92eff5aad7 | refactor secubox app packaging and theme | |||
| bd96ab1d31 | develstats | |||
| de40c8e533 |
feat: Release v0.4.3 - Dual menu access and enhanced permissions
This release adds dual menu access for Network Modes (both SecuBox and LuCI Network menus) and significantly expands RPCD permissions for all mode configuration operations. ## Network Modes - Dual Menu Access (2 files) - Added Network Modes to standard LuCI Network menu (admin/network/modes) - Maintains existing SecuBox menu location (admin/secubox/network/modes) - Users can now access Network Modes from both locations - Menu order: 60 in Network menu, 10 in SecuBox Network category ## Network Modes - Enhanced Permissions (1 file) Added 13+ new RPCD methods to ACL for complete mode management: Read permissions: - preview_changes - sniffer_config, ap_config, relay_config, router_config - travel_config, doublenat_config, multiwan_config, vpnrelay_config - travel_scan_networks Write permissions: - apply_mode, confirm_mode, rollback - update_settings - generate_wireguard_keys, apply_wireguard_config - apply_mtu_clamping, enable_tcp_bbr - add_vhost, generate_config ## Network Modes - View Updates (11 files) Updated all mode views for consistency: - helpers.js: 28 lines refactored - overview.js: Enhanced view structure - All mode views: wizard, router, multiwan, doublenat, accesspoint, relay, vpnrelay, travel, sniffer ## Theme Enhancements (1 file) - theme.js: 89 lines added - Enhanced theme initialization and configuration - Improved component styling support ## SecuBox Dashboard (2 files) - Updated dashboard.js and modules.js - Improved view rendering and integration ## System Hub (3 files) - Enhanced logs.js, overview.js, services.js - Better view consistency and functionality Summary: - 19 files changed (+282, -36) - Dual menu access for Network Modes - 13+ new RPCD permission methods - All network mode views updated - Theme significantly enhanced 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> |
|||
| aad081e841 |
chore: Release v0.4.2 - Menu reorganization and CSS enhancements
This release focuses on improved menu structure, enhanced CSS styling across all modules, and documentation cleanup. ## Menu & Navigation (2 modules) - Reorganized SecuBox menu with new "Network & Connectivity" category - Moved Network Modes from top-level to Network submenu - New menu path: admin/secubox/network/modes ## Network Modes Enhancements (14 files) - Enhanced all mode views: Overview, Wizard, Router, Multi-WAN, Double NAT, Access Point, Relay, VPN Relay, Travel, Sniffer, Settings - Improved dashboard.css styling - Updated API and helpers for better functionality ## System Hub Improvements (11 files) - Added dedicated CSS files for Backup and Health views - Enhanced styling: common.css, components.css, logs.css, services.css - Updated views: backup.js, components.js, health.js, logs.js, services.js - Removed deprecated settings.js view ## SecuBox Dashboard Updates (4 files) - Refined dashboard.css and modules.css styling - Enhanced dashboard.js and modules.js functionality ## Theme Updates (1 file) - Improved navigation.css component styling ## Documentation Cleanup (15 files deleted) - Removed obsolete documentation from docs/ directory - Migrated documentation to DOCS/ (uppercase) structure - Cleaned up archive files and outdated guides ## Configuration (1 file) - Updated Claude settings for new permissions Summary: - 50 files changed - 3 modules enhanced (network-modes, system-hub, secubox) - 15 documentation files cleaned up - 2 new CSS files added - Menu structure reorganized 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> |
|||
| a6477b8710 |
feat: Version 0.4.1 - Enhanced network modes and system improvements
Major Enhancements: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Network Modes Module: - Added 3 new network modes: * Double NAT mode (doublenat.js) - Cascaded router configuration * Multi-WAN mode (multiwan.js) - Load balancing and failover * VPN Relay mode (vpnrelay.js) - VPN gateway configuration - Enhanced existing modes: * Access Point improvements * Travel mode refinements * Router mode enhancements * Relay mode updates * Sniffer mode optimizations - Updated wizard with new mode options - Enhanced API with new mode support - Improved dashboard CSS styling - Updated helpers for new modes - Extended RPCD backend functionality - Updated menu structure for new modes - Enhanced UCI configuration System Hub Module: - Added dedicated logs.css stylesheet - Enhanced logs.js view with better styling - Improved overview.css responsive design - Enhanced services.css for better UX - Updated overview.js with theme integration - Improved services.js layout SecuBox Dashboard: - Enhanced dashboard.css with theme variables - Improved dashboard.js responsiveness - Better integration with global theme Files Changed: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Network Modes (17 files): Modified: api.js, dashboard.css, helpers.js, menu, config, RPCD backend Modified Views: accesspoint, overview, relay, router, sniffer, travel, wizard New Views: doublenat, multiwan, vpnrelay System Hub (6 files): New: logs.css Modified: overview.css, services.css, logs.js, overview.js, services.js SecuBox (2 files): Modified: dashboard.css, dashboard.js Total: 25 files changed (21 modified, 4 new) Technical Improvements: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ - Global theme CSS variable usage - Responsive design enhancements - Improved error handling - Better mode validation - Enhanced user feedback - Optimized CSS performance - Improved accessibility Network Mode Capabilities: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1. Router Mode - Standard routing 2. Access Point Mode - WiFi AP with bridge 3. Relay Mode - WiFi repeater/extender 4. Travel Mode - Portable router configuration 5. Sniffer Mode - Network monitoring 6. Double NAT Mode - Cascaded NAT for network isolation (NEW) 7. Multi-WAN Mode - Multiple uplinks with load balancing (NEW) 8. VPN Relay Mode - VPN gateway and tunnel endpoint (NEW) Breaking Changes: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ None - All changes are backward compatible 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> |
|||
| 9a4753e343 |
feat: add auto-refresh, auto-scroll, and compact header to system logs
Enhanced system logs viewer with live updates and improved UX 🎨 Compact Header Design ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Replaced large header with compact inline design: - Single line header with title + Live indicator - Inline statistics badges (Total, Errors, Warnings) - 60% less vertical space - Cleaner, more professional look Before: ┌─────────────────────────────────────┐ │ 📋 System Logs │ │ View and filter system logs... │ │ │ │ [100] [5] [12] │ │ Total Errors Warnings │ └─────────────────────────────────────┘ After: ┌─────────────────────────────────────┐ │ 📋 System Logs ● Live [100][5][12]│ └─────────────────────────────────────┘ ⟳ Auto-Refresh (Every 5 seconds) ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Features: - Automatic log polling every 5 seconds - Live green dot indicator (● Live) - Toggle button to enable/disable - Updates stats in real-time - No manual refresh needed Implementation: ```javascript poll.add(L.bind(function() { if (this.autoRefresh) { return API.getLogs(this.lineCount, '').then(function(result) { this.logs = result && result.logs ? result.logs : []; this.updateLogDisplay(); this.updateStats(); }); } }, this), 5); // Poll every 5 seconds ``` ↓ Auto-Scroll (Scroll to bottom) ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Features: - Automatically scrolls to latest logs - Toggle button to enable/disable - Useful for monitoring live activity - Smooth scrolling behavior Implementation: ```javascript if (this.autoScroll) { setTimeout(function() { logWrapper.scrollTop = logWrapper.scrollHeight; }, 100); } ``` 🎛️ New Controls ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Added toggle buttons: 1. ⟳ Auto-Refresh - Enable/disable live updates - Primary button when active (green) - Secondary button when inactive (gray) 2. ↓ Auto-Scroll - Enable/disable auto-scrolling - Primary button when active (green) - Secondary button when inactive (gray) Both features enabled by default for best UX. 🔧 Bug Fixes ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Fixed empty logs issue: - API returns: { logs: [...] } - Changed: this.logs = result.logs (instead of result) - Added null checks: result && result.logs ? result.logs : [] 📊 Real-time Stats Updates ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ New updateStats() function: - Updates Total, Errors, Warnings counts - Updates filter tab counts - Called on every refresh - Smooth live updates ✨ UX Improvements ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1. Compact header saves screen space 2. Live indicator shows auto-refresh status 3. Auto-scroll keeps latest logs visible 4. Real-time stats always up-to-date 5. Easy toggle controls 6. Better empty state message 🚀 Perfect for: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ - Real-time system monitoring - Debugging active issues - Security event monitoring - Service startup monitoring - Live troubleshooting sessions Testing: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ ✅ Auto-refresh works (5 second intervals) ✅ Auto-scroll works (scrolls to bottom) ✅ Toggle buttons work (enable/disable) ✅ Stats update in real-time ✅ Logs display correctly ✅ Filter tabs work ✅ Search works ✅ Download works ✅ Deployed to router ✅ Permissions fixed (644) ✅ Services restarted Files Modified: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ * luci-app-system-hub/htdocs/luci-static/resources/view/system-hub/logs.js - Added 'poll' dependency (+1 line) - Added autoRefresh and autoScroll properties (+2 lines) - Created renderCompactHeader() function (+27 lines) - Added auto-refresh polling (+8 lines) - Added auto-refresh toggle button (+13 lines) - Added auto-scroll toggle button (+10 lines) - Added updateStats() function (+18 lines) - Fixed data parsing (result.logs) (+3 lines) - Removed manual refresh button (simplified) - Total: +82 lines, better UX 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> |
|||
| e90cf85f69 |
feat: implement working system logs viewer in system-hub
Fixed and enhanced the system logs functionality with real-time log viewing and color-coded log levels. 🔧 Backend Fix (RPCD) ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Problem: - get_logs() function returned empty array - Logs were piped through while loop creating a subshell - json_add_string in subshell didn't affect main JSON output Solution: - Use temporary file to collect logs - Read from file outside of subshell - Properly build JSON array with all log lines Implementation: ```sh # Store logs in temporary file logread | tail -n "$lines" > "$tmpfile" # Read from file (no subshell issue) while IFS= read -r line; do json_add_string "" "$line" done < "$tmpfile" ``` Testing: ✅ ubus call luci.system-hub get_logs '{"lines": 100}' → Returns real logs ✅ Filter parameter works: get_logs '{"filter": "error"}' ✅ Temporary files cleaned up after use 🎨 Frontend Enhancement (logs.js) ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Added color-coded log level display: Features: 1. **Color-coded by severity:** - 🔴 Errors (red): error, err, fatal, crit - 🟡 Warnings (orange): warn, warning - 🔵 Info (blue): info, notice - 🟣 Debug (purple): debug - 🟢 Success (green): success, ok 2. **Visual enhancements:** - Colored left border for each log line - Semi-transparent background matching log level - JetBrains Mono font for better readability - Proper line spacing and padding 3. **Empty state:** - Friendly message when no logs available - Different message for empty search results - Large icon for better UX Implementation: ```javascript renderLogLine: function(line) { // Detect log level from keywords if (line.includes('error')) { color = '#ef4444'; // Red bgColor = 'rgba(239, 68, 68, 0.1)'; } // ... other levels return E('div', { 'style': 'border-left: 3px solid ' + color + '; ...' }, line); } ``` 📋 Features Summary ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ ✅ Real-time system log viewing (logread integration) ✅ Filter by log level (all, errors, warnings, info) ✅ Search functionality (filter text in logs) ✅ Adjustable line count (50, 100, 200, 500, 1000 lines) ✅ Color-coded log levels for easy identification ✅ Refresh button to reload logs ✅ Download logs as .txt file ✅ Statistics: total lines, errors count, warnings count ✅ Beautiful empty state when no logs match 🚀 Deployment ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ ✅ Updated RPCD backend on router ✅ Updated frontend logs.js on router ✅ Permissions fixed (755 for RPCD, 644 for JS) ✅ Services restarted (rpcd, uhttpd) ✅ Tested and working Test URL: https://192.168.8.191/cgi-bin/luci/admin/secubox/system/system-hub/logs Files Modified: ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Backend: * luci-app-system-hub/root/usr/libexec/rpcd/luci.system-hub - Fixed get_logs() to return real logs (+12 lines refactor) Frontend: * luci-app-system-hub/htdocs/luci-static/resources/view/system-hub/logs.js - Added renderLogLine() for color-coded display (+27 lines) - Enhanced updateLogDisplay() with empty state (+18 lines) - JetBrains Mono font integration 🎯 User Experience ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Before: ❌ Empty log viewer (backend returned []) ❌ Plain text display ❌ No visual distinction between log levels After: ✅ Real system logs displayed ✅ Color-coded by severity level ✅ Easy to spot errors and warnings ✅ Professional terminal-like appearance ✅ Fully functional filters and search 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> |
|||
| 8e53825ad5 |
release: v0.2.2 - Design System v0.3.0 & Comprehensive Documentation
🎨 Design System v0.3.0 (Demo-inspired) - New dark palette: #0a0a0f, #6366f1→#8b5cf6 gradients - Typography: Inter + JetBrains Mono - Compact stats grid (130px min) - Gradient text effects with background-clip - Sticky navigation tabs - Enhanced card borders and hover effects 📚 Comprehensive Documentation Suite - DEVELOPMENT-GUIDELINES.md (33KB, 900+ lines) - 9 major sections: Design, Architecture, RPCD, ACL, JS, CSS, Errors, Validation, Deployment - Complete code templates and best practices - Common error diagnostics and solutions - QUICK-START.md (6.4KB) - 8 critical rules for immediate reference - Quick code templates - Error quick fixes table - deploy-module-template.sh (8.1KB) - Standardized deployment with automatic backup - Permission fixes, cache clearing, verification - Updated CLAUDE.md, README.md with documentation index - Updated .claude/README.md to v2.0 🔄 Version Updates - luci-app-secubox: 0.1.2 → 0.2.2 - luci-app-system-hub: 0.1.1 → 0.2.2 - Updated all version strings (api.js, overview.js, CSS files) 🎯 CSS Enhancements - common.css: Complete rewrite with demo palette - overview.css: Dashboard header with gradient - services.css: Updated version to 0.2.2 - components.css: Updated version to 0.2.2 🔧 Critical Rules Documented 1. RPCD naming: file = ubus object (luci. prefix) 2. Menu path = view file location 3. Permissions: 755 (RPCD), 644 (CSS/JS) 4. ALWAYS run validate-modules.sh 5. CSS variables only (no hardcode) 6. Dark mode mandatory 7. Typography: Inter + JetBrains Mono 8. Gradients: --sh-primary → --sh-primary-end 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> |
|||
| 5902ac500a |
release: v0.1.1 - Unified Theme System with Dark/Light Mode Support
Major Features: • Centralized theme system across SecuBox and System Hub • Three theme modes: dark (default), light, and system (auto-detect) • Single theme setting in SecuBox controls both plugins • Real-time theme switching with OS preference detection SecuBox Changes: • Added theme.js manager for centralized theme control • Implemented CSS variables for dark/light mode (secubox.css) • Fixed hardcoded colors in dashboard.css, alerts.css, monitoring.css • Integrated theme.js in all 7 views (dashboard, modules, alerts, monitoring, settings, etc.) • Added get_theme RPC method to luci.secubox backend • Updated ACL permissions to include get_theme (read access) • Version updated to 0.1.1 System Hub Changes: • Added theme.js manager using SecuBox theme API • Implemented CSS variables for dark/light mode (dashboard.css) • Integrated theme.js in all 9 views (overview, health, services, logs, backup, components, remote, settings, diagnostics) • Version updated to 0.1.1 • README updated with maintainer info Theme System Architecture: • Configuration: /etc/config/secubox (option theme: dark|light|system) • RPCD Backend: luci.secubox/get_theme method • Frontend: theme.js modules (secubox/theme.js, system-hub/theme.js) • CSS Variables: --sb-bg, --sb-bg-card, --sb-border, --sb-text, --sb-text-muted, --sb-shadow • Auto-detection: prefers-color-scheme media query for system mode Documentation: • Added LUCI_DEVELOPMENT_REFERENCE.md with comprehensive LuCI development patterns • Documented ubus/RPC types, baseclass.extend() patterns, ACL structure • Common errors and solutions from implementation experience Bug Fixes: • Fixed SecuBox theme not applying visually (CSS variables now used) • Fixed missing secubox.css in view imports • Fixed ACL access denied for get_theme method • Fixed hardcoded colors preventing theme switching Testing: • Verified theme switching works in all SecuBox tabs • Verified theme switching works in all System Hub tabs • Verified dark/light/system modes function correctly • Verified single setting controls both plugins 🤖 Generated with Claude Code (https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> |
|||
| 34fe2dc26a |
feat: complete System Hub implementation - central control dashboard
Implements comprehensive system control and monitoring dashboard with health metrics, service management, system logs, and backup/restore functionality. Features: - Real-time system monitoring with visual gauges (CPU, RAM, Disk) - Comprehensive system information (hostname, model, uptime, kernel) - Health metrics with temperature monitoring and storage breakdown - Service management with start/stop/restart/enable/disable actions - System log viewer with filtering and configurable line count - Configuration backup creation and download (base64 encoded) - Configuration restore from backup file - System reboot functionality with confirmation Components: - RPCD backend (luci.system-hub): 10 ubus methods * status, get_system_info, get_health * list_services, service_action * get_logs, backup_config, restore_config * reboot, get_storage - 4 JavaScript views: overview, services, logs, backup - ACL with read/write permissions segregation - Comprehensive README with API documentation Technical implementation: - System info from /proc filesystem and sysinfo - Health metrics: CPU load, memory breakdown, disk usage, temperature - Service control via /etc/init.d scripts - Log retrieval via logread with filtering - Backup/restore using sysupgrade with base64 encoding - Visual gauges with SVG circular progress indicators - Color-coded health status (green/orange/red) Dashboard Features: - Circular gauges for CPU, Memory, Disk (120px with 10px stroke) - System information cards with detailed metrics - Temperature monitoring with thermal zone detection - Storage table for all mount points with progress bars - Service table with inline action buttons - Terminal-style log display (black bg, green text) - File upload for backup restore - Modal confirmations for destructive actions Architecture follows SecuBox standards: - RPCD naming convention (luci. prefix) - Menu paths match view file structure - All JavaScript in strict mode - Form-based configuration management - Comprehensive error handling Dependencies: coreutils, coreutils-base64 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> |
|||
| f08c14f1d7 | fix: hope modules refresh |
