Updated luci-app-secubox internal version to 0.4.6-r2.
Version update:
- luci-app-secubox: 0.4.6-r1 → 0.4.6-r2
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Updated internal version numbers to 0.4.6 across all core modules
for consistency and alignment with the latest development cycle.
Version updates:
- luci-app-network-modes: 0.4.5-r1 → 0.4.6-r1
- luci-theme-secubox: 0.4.5-r1 → 0.4.6-r1
- luci-app-secubox: 0.4.5-r1 → 0.4.6-r1
- luci-app-system-hub: 0.4.5-r1 → 0.4.6-r1
All modules now synchronized at version 0.4.6.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Updated internal version numbers to align with v0.4.5 release tag.
Version updates:
- luci-app-network-modes: 0.3.6-r2 → 0.4.5-r1
- luci-theme-secubox: 0.4.0-r1 → 0.4.5-r1
- luci-app-secubox: 0.3.1-r1 → 0.4.5-r1
- luci-app-system-hub: 0.4.0-r1 → 0.4.5-r1
All modules now synchronized at version 0.4.5, reflecting the latest
improvements including:
- Menu reorganization (Network & Connectivity category)
- Dual menu access for Network Modes
- Enhanced RPCD permissions
- Robust version handling across all modules
- Improved OOP structure for helpers
- SecuBox overview modules updates
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This release focuses on consistent version display across all modules
and proper OOP structure for network-modes helpers.
## Version Display Improvements (3 files)
Added robust version resolution functions to handle various version field names:
**SecuBox Dashboard** (dashboard.js):
- Added getModuleVersion() function with fallback chain
- Checks: version, pkg_version, package_version, packageVersion, Version
- Handles both string and number types
- Returns '—' if no version found
- Loads modules list from API for accurate version data
**SecuBox Modules** (modules.js):
- Added resolveModuleVersion() function with same fallback logic
- Ensures consistent version display in module cards
- Handles missing or undefined versions gracefully
**System Hub Components** (components.js):
- Added getComponentVersion() function with version fallback chain
- Consistent version display across all components
- Proper handling of edge cases (null, undefined, empty strings)
## Network Modes Refactoring (1 file)
**helpers.js**:
- Refactored from plain object export to baseclass.extend()
- Proper OOP structure following LuCI conventions
- Added 'require baseclass' import
- All helper functions now properly encapsulated
- Better integration with LuCI module system
## Benefits
- Consistent version display across SecuBox, System Hub, and Components
- Handles version field name variations (legacy, OpenWrt, custom)
- Type-safe version handling (numbers → strings)
- Improved code maintainability with proper OOP structure
- Better error handling for missing version information
Summary:
- 4 files changed (+85, -8)
- 3 new version resolution functions
- 1 OOP refactoring for helpers
- Improved consistency and reliability
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Migrated three core modules to use the global secubox-theme package:
Modules Updated:
- luci-app-secubox (dashboard, modules views)
- luci-app-network-modes (overview view)
- luci-app-system-hub (overview, services views)
Changes Per Module:
- Replaced module-specific theme imports with 'require secubox-theme/theme as Theme'
- Updated CSS imports to use global secubox-theme.css bundle
- Initialized global theme with Theme.init({ theme: 'dark', language: 'en' })
- Removed redundant theme.getTheme() calls from load() functions
- Added global theme CSS link tags to view renders
Benefits:
- Unified CyberMood design system across all modules
- Access to 100+ CSS variables (colors, spacing, effects)
- Theme switching support (dark, light, cyberpunk)
- Multi-language support (en, fr, de, es) via Theme.t()
- Reduced CSS duplication
- Consistent UI components (cards, buttons, badges)
Deployment:
- Created deploy-modules-with-theme.sh for batch deployment
- All modules successfully deployed to router 192.168.8.191
- Verified HTTP access to updated JavaScript files
Testing:
- ✅ SecuBox dashboard loads with global theme
- ✅ Network-modes overview uses theme CSS
- ✅ System-hub views integrate theme properly
- ✅ All 27 view files deployed successfully
Next Steps:
- Modules can now use Theme.createCard(), createButton(), createBadge()
- Translation keys available for internationalization
- Theme variants switchable via Theme.apply('dark'|'light'|'cyberpunk')
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Created help system (help.js, help.css) for all modules
- Integrated help button in network-modes module
- Fixed menu structure: removed empty Network Management category
- Fixed all dashboard and modules page links
- Added website deployment script
- Created comprehensive documentation
New Files:
- DOCS/HELP_INTEGRATION_PLAN.md
- DOCS/WEBSITE_DEPLOYMENT_GUIDE.md
- EXAMPLES/help-button-integration.js
- luci-app-secubox/htdocs/luci-static/resources/secubox/help.js
- luci-app-secubox/htdocs/luci-static/resources/secubox/help.css
- secubox-tools/deploy-website.sh
Modified:
- luci-app-network-modes: Added help button integration
- luci-app-secubox: Fixed menu paths and module links
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
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>
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>
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>
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>
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>
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>
Final version with modern light theme dashboard:
- Beautiful clean design with gradient header
- Dynamic circular gauges with real-time updates
- Auto-refresh functionality
- Responsive layout
- All permissions fixed
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
