- Add ninja-build to package build workflow (build-openwrt-packages.yml)
- Add ninja-build to image build workflow (build-secubox-images.yml)
- Update secubox-tools/README.md with ninja-build dependency
- Update secubox-tools/local-build.sh dependency check and install instructions
- Ninja is required by OpenWrt build system for some compilation tasks
This resolves missing ninja errors in GitHub Actions builds.
Added 2 new performance widgets:
🌐 Network Stats:
- Online/Offline status with badge
- Total download (RX) in GB
- Total upload (TX) in GB
- Network status indicator
- Cyan → Blue gradient
⚙️ Services Monitor:
- Running/Total services count
- Failed services count
- Health percentage (running/total)
- Status badges: healthy/issues/critical
- Green → Emerald gradient
All widgets now visible by default (6 total):
1. CPU Performance (with load histogram)
2. Memory Usage (with swap visualization)
3. Disk Space
4. Temperature
5. Network Stats (NEW)
6. Services Monitor (NEW)
Grid layout auto-adapts: 280px min per widget
Fixed updateDashboard() to properly convert childNodes to array
before passing to dom.content(). Was showing '[object HTMLCollection]'
instead of rendering the updated metrics.
Changed from:
- dom.content(el, element.children)
To:
- Array.prototype.slice.call(element.childNodes)
This ensures proper DOM manipulation and fixes the refresh cycle.
- Add network throughput stats (RX/TX total bytes)
- Add process count display (running/total)
- Add swap usage information
- Add dynamic status indicators (✓, ⚡, ⚠️) with pulse animation
- Add detailed tooltips with absolute values
- Add detail text under each stat card
- Enhance stats grid layout for 5 cards
- Update version from 0.3.1 to 0.3.2
Backend enhancements:
- Extract process count from /proc/loadavg
- Calculate swap usage from /proc/meminfo
- Aggregate network throughput from all interfaces
Frontend enhancements:
- Display process count alongside CPU load
- Show swap usage when available
- Display total RX/TX in GB
- Add pulsing status icons
- Show contextual details (MB/GB values, process count, load average)
CSS improvements:
- Add .sh-stat-status-icon with subtle pulse animation
- Add .sh-stat-overview-detail for contextual information
- Add network gradient color scheme
- Adjust grid for better 5-card layout
The enable_module() and disable_module() functions were incorrectly also
starting/stopping services. They should only manage UCI configuration flags.
Service lifecycle (start/stop/restart) should be handled by dedicated functions.
**Changes:**
**enable_module():**
- ✅ Sets UCI `secubox.{module}.enabled = '1'`
- ✅ Commits UCI changes
- ❌ Removed: Service enable/start commands
- ✅ Returns success with note to use start_module()
**disable_module():**
- ✅ Sets UCI `secubox.{module}.enabled = '0'`
- ✅ Commits UCI changes
- ❌ Removed: Service stop/disable commands
- ✅ Returns success with note to use stop_module()
**Behavior:**
Before:
```bash
ubus call luci.secubox enable_module '{"module":"example"}'
# Would: Set enabled=1 + Enable service + Start service
```
After:
```bash
ubus call luci.secubox enable_module '{"module":"example"}'
# Only: Set enabled=1 in UCI config
ubus call luci.secubox start_module '{"module":"example"}'
# Separately: Start the actual service
```
**Benefits:**
- ✅ Clear separation of concerns
- ✅ Enable/disable = logical flag in UCI
- ✅ Start/stop/restart = actual service control
- ✅ More predictable behavior
- ✅ Aligns with user expectations
**Testing:**
```bash
# Enable in config
ubus call luci.secubox enable_module '{"module":"network_modes"}'
→ UCI: enabled='1' ✓
# Disable in config
ubus call luci.secubox disable_module '{"module":"network_modes"}'
→ UCI: enabled='0' ✓
# Services not affected, use start/stop separately
```
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
GitHub Actions workflow hardcoded .ipk extension, causing artifacts to fail
for OpenWrt 25.12+ which uses .apk format. Updated all package handling to
dynamically detect format based on OpenWrt version.
**Changes:**
1. **Package Format Detection:**
- Detect apk (25.12+/SNAPSHOT) vs ipk (24.10 and earlier) in each step
- Set PKG_EXT variable based on OPENWRT_VERSION environment variable
2. **Download Dependencies Step:**
- Removed broken env.PKG_EXT reference (set before variable exists)
- Add local detection of package format
- Download correct package index (APKINDEX.tar.gz vs Packages)
3. **Publish Artifacts Step:**
- Detect format and copy *.apk or *.ipk files accordingly
- Use dynamic PKG_EXT in archive creation
- Update package counting to support both formats
4. **Upload Artifacts:**
- Renamed from "secubox-all-ipk" to "secubox-all-packages"
- Upload both *.ipk and *.apk patterns
5. **Release Step:**
- Update package listing to find both .ipk and .apk files
- Update sed pattern to handle both naming formats
- Add separate installation instructions for apk vs opkg
6. **Build Summary:**
- Count both .ipk and .apk files in summary
- Fix stdout redirect for package list
**Installation Instructions Updated:**
- Added separate sections for apk (25.12+) and opkg (24.10)
- Clear commands for each package manager
**Tested Formats:**
- ✅ OpenWrt 25.12.0-rc1: .apk files
- ✅ OpenWrt 24.10.5: .ipk files
- ✅ OpenWrt 23.05.5: .ipk files
- ✅ SNAPSHOT: .apk files
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
The get_dashboard_data endpoint was missing version information for modules.
Updated to include version extraction from package manager (apk/opkg).
**Changes:**
- Add package and version config variables in get_dashboard_data
- Extract real version from apk (OpenWrt 25.12+) or opkg (24.10)
- Include version field in JSON output for each module
**Dashboard Data Now Includes:**
- Module version for installed packages (e.g., "0.3.1")
- Default version "0.0.9" for non-installed modules
- Consistent version format across all endpoints
**Benefits:**
- Dashboard can display installed package versions
- Users can see which version of each module is running
- Consistent with modules endpoint behavior
Tested on OpenWrt 25.12.0-rc1 with apk package manager.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
OpenWrt 25.12+ uses apk instead of opkg, causing module detection to fail.
Updated all package manager operations to support both:
**Changes:**
- check_module_installed(): Detect and use apk or opkg
- detect_real_modules(): Parse both apk and opkg output formats
- Version extraction: Use grep pattern matching for apk (portable)
- get_status(): Count modules from UCI config instead of RPCD scripts
**Detection Logic:**
- Check /usr/bin/apk → use apk commands (OpenWrt 25.12+)
- Check /bin/opkg or /usr/bin/opkg → use opkg (24.10 and earlier)
- Fallback to config file existence check
**Version Extraction:**
- apk: Extract X.Y.Z from "luci-app-name-X.Y.Z-rN" format
- opkg: Extract version from "package version" format
**Module Counting:**
- Now counts all modules from UCI config (14 total)
- Correctly detects installed packages (2 installed)
- Properly tracks running services (0 running)
Tested on OpenWrt 25.12.0-rc1 with apk package manager.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Updated three core modules with significant UI/UX improvements:
SecuBox Central Hub (luci-app-secubox):
- Changed header icon from 🛡️ to 🚀 ("SecuBox Control Center")
- Added module filter tabs (All/Security/Network/System/Monitoring)
- Implemented alert dismiss and clear functionality
- Enhanced backend RPCD methods for alert management
- Updated ACL permissions for new alert methods
System Hub (luci-app-system-hub):
- Changed header icon from 🖥️ to ⚙️ ("System Control Center")
- Added 4-column System Info Grid with interactive cards
- Implemented Quick Status Indicators (Internet/DNS/NTP/Firewall)
- Added hostname edit and kernel version copy features
- Enhanced CSS with monospace fonts and responsive design
Network Modes (luci-app-network-modes):
- Changed header icon from ⚙️ to 🌐 ("Network Configuration")
- Added Current Mode Display Card with config summary
- Implemented Mode Comparison Table (5 modes, 6 features)
- Active mode highlighting with gradient effects
- Added "Change Mode" button with gradient styling
All modules validated with comprehensive checks (RPCD, ACL, permissions).
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Add complete documentation suite for AI-assisted module regeneration:
New Documentation:
- CODE-TEMPLATES.md: Working code templates from production modules
* API, View, RPCD, Menu, ACL templates
* Complete minimal working example
* Common pitfalls and solutions (~1,200 lines)
- MODULE-IMPLEMENTATION-GUIDE.md: Master implementation guide
* Step-by-step regeneration workflow with Claude.ai
* Common implementation patterns library
* Comprehensive troubleshooting guide
* Best practices and deployment checklist (~800 lines)
- FEATURE-REGENERATION-PROMPTS.md: Ready-to-use AI prompts
* Complete specifications for all 15 SecuBox modules
* Design system reference (CSS variables, typography, components)
* Common UI patterns across modules (~2,000 lines)
- DOCUMENTATION-INDEX.md: Central documentation hub
* Quick lookup by task
* Learning paths for all skill levels
* Documentation comparison matrix (~400 lines)
Features:
- AI-optimized prompts for Claude.ai code generation
- Real code examples from production codebase
- Complete design system documentation
- Multi-tab dashboard patterns
- Form validation patterns
- Real-time data update patterns
- Error handling best practices
Total Coverage:
- ~5,000+ lines of comprehensive documentation
- All 15 SecuBox modules documented
- Complete code templates for all components
- Validated against live demo at secubox.cybermood.eu
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
OpenWrt 25.12.0-rc1 introduced a major change: switching from opkg
to apk (Alpine Package Manager). This commit adds full support for
building both package formats based on the OpenWrt version.
**Package Build Workflow (.github/workflows/build-openwrt-packages.yml):**
- Added automatic version detection for package format
- 25.12+ and SNAPSHOT → .apk format
- 24.10 and earlier → .ipk format
- Updated feeds configuration to use correct branch (openwrt-25.12, openwrt-24.10, etc.)
- Modified artifact collection to handle both .apk and .ipk files
- Updated build summary to show package format
- Added PKG_EXT environment variable to track format across workflow steps
- Updated dependency download to handle both APKINDEX.tar.gz and Packages formats
- Skip dependency downloads for RC versions (repos may not be stable)
**Local Build Script (secubox-tools/local-build.sh):**
- Added package format detection based on OPENWRT_VERSION
- Updated feeds.conf generation to select correct branch dynamically
- Modified build_packages() to detect and build correct package format
- Updated collect_artifacts() to collect both .apk and .ipk files
- Updated SHA256SUMS generation for both formats
- Export PKG_EXT variable for use across functions
**Documentation:**
- CLAUDE.md: Added package format support details
- README.md: Updated compatibility table with package format column
- Added note explaining apk vs ipk distinction
**Key Changes:**
- Backwards compatible: existing workflows continue to work for .ipk
- Future-proof: ready for OpenWrt 25.12 stable release
- Automatic detection: no manual configuration needed
- Comprehensive: covers all build scenarios (GitHub Actions, local builds)
Tested scenarios:
- OpenWrt 24.10.5 → builds .ipk ✅
- OpenWrt 25.12.0-rc1 → builds .apk ✅
- SNAPSHOT → builds .apk ✅🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Updated GitHub Actions workflows and build scripts to support the
latest OpenWrt versions:
- Added 25.12.0-rc1 (latest release candidate) for testing
- Added 24.10.5 (latest stable release)
- Changed default version from 23.05.5 to 24.10.5
Changes:
- .github/workflows/build-secubox-images.yml: Added new versions, updated default
- .github/workflows/build-openwrt-packages.yml: Added new versions, updated default
- secubox-tools/local-build.sh: Updated default version and added comment
- CLAUDE.md: Updated documentation with supported versions
- README.md: Updated build instructions and compatibility table
- secubox-tools/README.md: Updated environment variables documentation
The 25.12.0-rc1 includes major changes:
- Switch from opkg to apk package manager
- Integration of attended Sysupgrade into default LuCI
- Wi-Fi scripts converted to ucode
- Support for 160+ new devices (2180+ total)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fixed HTTP 404 errors for common.css in secubox monitoring and settings pages
Problem:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
- monitoring.js and settings.js were loading 'system-hub/common.css'
- This file doesn't exist (404 Not Found)
- Error: GET http://192.168.8.191/luci-static/resources/system-hub/common.css [404]
- Pages loaded but with missing styles
Solution:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Changed CSS path to correct module resource:
- FROM: L.resource('system-hub/common.css')
- TO: L.resource('secubox/common.css')
This references the secubox module's own common.css file which exists
at: /www/luci-static/resources/secubox/common.css
Files Fixed:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
1. luci-app-secubox/htdocs/luci-static/resources/view/secubox/monitoring.js
Line 79: system-hub/common.css → secubox/common.css
2. luci-app-secubox/htdocs/luci-static/resources/view/secubox/settings.js
Line 25: system-hub/common.css → secubox/common.css
CSS Loading Order (Correct):
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
1. secubox/common.css ← Fixed (was system-hub/common.css)
2. secubox/secubox.css ← Already correct
3. secubox/monitoring.css ← Module-specific (monitoring page only)
Testing:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✅ Deployed to router
✅ Permissions fixed (644)
✅ Cache cleared
✅ Services restarted
Test URLs:
- Monitoring: https://192.168.8.191/cgi-bin/luci/admin/secubox/monitoring/overview
- Settings: https://192.168.8.191/cgi-bin/luci/admin/secubox/settings
Expected Result:
✅ No 404 errors in browser console
✅ All styles load correctly
✅ Pages render with proper theming
Root Cause:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Copy-paste error from system-hub module templates. These view files were
likely created using system-hub as a reference and the CSS path wasn't
updated to match the secubox module structure.
Related:
- secubox/common.css exists and has correct permissions (644)
- No changes needed to CSS file itself
- Only view file CSS references needed correction
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fixed TypeError: Theme.getTheme is not a function error in settings.js
Problem:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
- settings.js calls Theme.getTheme() on line 14
- theme.js did not export getTheme() function
- Error: TypeError: Theme.getTheme is not a function
- SecuBox settings page failed to load
Solution:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Added getTheme() function to theme.js module:
- Returns Promise that resolves with theme preference
- Calls API.getTheme() to fetch theme from backend
- Returns 'dark' as fallback if API call fails
- Consistent with other theme module functions
Implementation:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
```javascript
/**
* Get theme preference from backend
* @returns {Promise<string>} Theme preference ('dark', 'light', or 'system')
*/
getTheme: function() {
return API.getTheme().then(function(data) {
return data.theme || 'dark';
}).catch(function(err) {
console.error('Failed to load theme preference:', err);
return 'dark';
});
}
```
Module now exports 4 functions:
1. init() - Initialize theme system
2. applyTheme(theme) - Apply theme to page
3. getCurrentTheme() - Get effective theme from DOM
4. getTheme() - Get theme preference from backend (NEW)
Testing:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✅ Deployed to router
✅ Permissions fixed (644)
✅ Cache cleared
✅ Services restarted
Test URL: https://192.168.8.191/cgi-bin/luci/admin/secubox/settings
Files Modified:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
* luci-app-secubox/htdocs/luci-static/resources/secubox/theme.js (+13 lines)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Added comprehensive pre-deployment verification to prevent common issues:
🔍 Pre-Deployment Checks (CRITICAL)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
1. Disk Space Verification
- Check overlay usage before deployment
- Stop if ≥90% full
- Emergency cleanup procedures
2. Permissions Verification (Prevent HTTP 403)
- RPCD: 755 (rwxr-xr-x)
- CSS/JS: 644 (rw-r--r--)
- Common error: Files created with 600 instead of 644
- Symptom: HTTP 403 Forbidden on resource loading
3. Post-Deployment Verification
- 6-point checklist script
- Verify disk space, permissions, ubus objects
- Automated validation
4. Common Deployment Errors Table
- HTTP 403 Forbidden → Permission fix
- No space left → Cleanup procedure
- Object not found → RPCD permission check
- Module not appearing → Cache clearing
- Changes not visible → Browser cache
5. Emergency Disk Space Recovery
- Analysis commands
- Cleanup procedures
- Netdata web UI removal option (saves 22MB)
📝 Files Updated:
- DEVELOPMENT-GUIDELINES.md: Added ~175 lines at section 9
- QUICK-START.md: Added rules #4 and #5
Based on real deployment issues encountered:
- Router overlay 100% full (98.8M/98.8M)
- HTTP 403 on netdata-dashboard (permissions 600 vs 644)
- Common.css deployment failures due to space
These checks are now MANDATORY before any deployment.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fixed issue where validate-modules.sh would exit prematurely during check 3
due to grep failures in while loops with set -e enabled.
Changes:
- Added set -o pipefail for better error handling
- Temporarily disable set -e during grep checks in view file validation loop
- Script now completes all 6 validation checks successfully
- Exit code 0 when only warnings present (debug files without menu entries)
Validation results:
✓ Check 1: RPCD naming vs ubus objects (15 modules)
✓ Check 2: Menu paths vs view files (15 modules, 100+ views)
✓ Check 3: View files have menu entries (2 warnings for debug files)
✓ Check 4: RPCD permissions (15 scripts executable)
✓ Check 5: JSON syntax validation (30 files)
✓ Check 6: ubus naming convention (17 objects)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Complete redesign of Overview page with modern dashboard layout:
Features:
• Health Score circle with visual status (excellent/good/warning/critical)
• Metric cards with progress bars (CPU, Memory, Disk, Temperature)
• Color-coded status indicators
• System Information card with icons
• Network Status card with connection state
• Services card with quick actions link
• Auto-refresh every 30 seconds
• Responsive grid layout
• Full dark mode support
Design:
• Gradient score circle (120px)
• Modern metric cards with hover effects
• Info cards with organized data rows
• Status badges (ok/warning/error)
• Smooth transitions and animations
• Cohesive with SecuBox design language
Replaces old cbi-based layout with modern component-based design.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Same fix as secubox: removed expect: { modules: [] } from RPC declarations.
This was auto-extracting the modules property, causing components list to be empty.
Now both SecuBox Modules and System Hub Components work correctly.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fixed RPC declare to return full object instead of extracting modules array.
The expect: { modules: [] } was auto-extracting the modules property,
causing data to be the array directly instead of { modules: [...] }.
This caused:
- data.modules to be undefined
- Module count to show 0
- Empty module lists in UI
Now returns the full response object as expected by the views.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fixed two issues preventing components page from loading:
1. Added getTheme() method to theme.js
- components.js was calling Theme.getTheme() which didn't exist
- Added method to return theme data from SecuBox
2. Updated ACL to grant access to new methods
- Added get_components and get_components_by_category to read permissions
- Added luci.secubox methods (modules, modules_by_category, get_theme)
- Resolves "Access denied" error (-32002)
This fixes the "Theme.getTheme is not a function" and "Access denied" errors.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fixed get_components() to call luci.secubox 'modules' instead of 'get_modules'
Fixed get_components_by_category() to call 'modules_by_category' instead of 'get_modules_by_category'
This resolves the "No related RPC reply" error in System Hub overview.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Major Features:
• SecuBox v0.1.2: Real-time module auto-detection via opkg
• System Hub: Dynamic component detection leveraging SecuBox
• Responsive card grid layout for modules and components
• Category filtering tabs (All/Security/Monitoring/Network/System)
• Auto-refresh every 30 seconds with real-time status
SecuBox Changes:
• Added detect_real_modules() function to scan opkg for installed packages
• Enhanced get_modules() with dual-source detection (UCI + auto-detected)
• Enhanced get_modules_by_category() with same dual-source logic
• Auto-categorization based on package name patterns
• Real version detection from opkg for installed packages
• Added in_uci flag to distinguish module sources
• Responsive modules.js with card-based layout
• New modules.css with theme support and animations
System Hub Changes:
• Added get_components() and get_components_by_category() to RPCD
• Components leverage SecuBox module detection via ubus
• Completely rewritten components.js with responsive cards
• New components.css matching SecuBox design language
• Extended API with getComponents() methods
• Unified component management with quick actions
Deployment:
• Added deploy-secubox-v0.1.2.sh for SecuBox deployment
• Added deploy-system-hub-dynamic.sh for System Hub deployment
• Added deploy-dynamic-modules.sh for combined deployment
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Major improvements to modules page:
- Responsive grid layout with modern card design
- Module versions display (v0.0.9)
- Category filter tabs (All, Security, Monitoring, Network, System)
- Quick actions (Start/Stop/Restart/Dashboard)
- Real-time status indicators with animations
- Emoji icons properly displayed
- Auto-refresh every 30 seconds
Changes:
- modules.js: Complete rewrite with responsive cards
- modules.css: New CSS with theme support and animations
- secubox config: Added emoji icons and version fields
- RPCD backend: Added version field to module data
Features:
✨ Responsive 3-column grid (auto-adapts to screen size)
🎯 Category filtering with animated tabs
▶️ One-click start/stop/restart actions
📊 Dashboard quick links for each module
💫 Smooth animations and hover effects
🌓 Full dark/light theme support
📱 Mobile-friendly design
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
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>
Root Cause:
- baseclass.extend() in LuCI only preserves RPC methods (rpc.declare)
- Non-RPC functions passed to baseclass.extend() are filtered out
- This caused TypeError: api.callGetComponents is not a function
Solution:
- Simplified api.js to contain ONLY RPC methods (10 methods)
- Moved all stub functions and helpers directly into the views that use them
- Each view now defines its own local functions for planned features
API Changes (api.js):
- Removed all stub functions (callGetComponents, callManageComponent, etc.)
- Removed all helper functions (formatUptime, formatBytes, getComponentIcon, getHealthStatus)
- Kept only RPC methods: getStatus, getSystemInfo, getHealth, listServices,
serviceAction, getLogs, backupConfig, restoreConfig, reboot, getStorage
View Changes:
- components.js: Added local getComponents(), getComponentIcon(), manageComponent()
- health.js: Added local getHealthStatus(), formatBytes(), inline report stub
- remote.js: Added local getRemoteConfig(), inline session stub
- settings.js: Fixed to use api.getStatus() instead of api.callStatus()
All 9 views now functional with proper stub data for planned features.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fixed TypeError: "factory yields invalid constructor" by:
- Adding 'require baseclass' directive
- Using baseclass.extend() to return proper constructor
- Added formatUptime() helper function
- Added formatBytes() helper function
This matches the pattern used in luci-app-secubox and other LuCI modules.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
First alpha release of System Hub with core functionality:
📊 Features Implemented:
- System monitoring (CPU, Memory, Disk, Network)
- Service management (Start, Stop, Restart, Enable/Disable)
- System logs viewer with filtering
- Backup & restore functionality
- System information dashboard
- Health monitoring with visual gauges
- Storage monitoring
- Temperature sensors
🔧 Components:
- Complete RPCD backend (luci.system-hub)
- JavaScript API wrapper
- 9 UI views (overview, services, logs, backup, etc.)
- UCI configuration support
- ACL permissions configured
📦 Version:
- Package: 0.0.1-alpha
- Status: Alpha - Core features ready for testing
This is an initial alpha release for testing and feedback.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Updated hardcoded version strings in UI:
- Settings page: 0.0.1-beta → 0.1.0
- Dashboard fallback: 0.0.1-beta → 0.1.0
The version is now consistent across all interfaces.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This marks the first stable and functional release of SecuBox.
Version Updates:
- Package version: 0.0.5-beta → 0.1.0
- Backend RPCD version: 0.0.1-beta → 0.1.0
- Internal version display: 0.0.1-beta → 0.1.0
Features Complete:
✅ Modern dashboard with dynamic circular gauges
✅ Real-time auto-refresh (30s interval)
✅ System health monitoring (CPU, Memory, Disk, Network)
✅ Module management with status tracking
✅ Settings page with 40+ configuration options
✅ Alerts page with filtering and sorting
✅ Monitoring page with historical graphs
✅ Quick actions panel
✅ Responsive design with animations
✅ All file permissions corrected
This is a fully functional reference version ready for production use.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
