- cscli metrics sometimes outputs empty string keys ("": {...})
- This causes RPC parsing errors in LuCI
- Added sed filter to replace empty keys with "unknown"
- Fixes "No related RPC reply" error in metrics view
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Add parseScenario() to format scenario names
- Add getCountryFlag() to display country flag emojis
- Add formatRelativeTime() for relative timestamps
- Fix decisions data flattening in handleUnban, handleBulkUnban, submitBan, and polling
- Fix getDashboardData to properly flatten alerts->decisions structure
- Fix context error in overview renderDecisionsTable (this vs self)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fix invisible checkboxes in Step 3 collections:
- Add explicit inline styles to checkbox inputs
- Set width: 18px, height: 18px with cursor: pointer
- Add 'for' attribute to label for better click handling
- Replace null rendering with empty element E([])
- Fixes "null" text appearing on screen
Issue: Collection items not selectable, checkboxes invisible
Cause: Checkboxes may be hidden by browser default styles
Solution: Add explicit inline styles and proper label association
Frontend Changes:
- htdocs/luci-static/resources/view/crowdsec-dashboard/wizard.js
- Add inline styles to checkbox inputs
- Add 'for' attribute linking label to checkbox
- Replace ': null' with ': E([])' to avoid "null" text
Checkboxes now have:
- Explicit dimensions (18x18px)
- Proper cursor styling
- Label association via 'for' attribute
- No more "null" text rendering
Version: 0.6.0-7
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fix Next button remaining disabled despite correct status:
- Change renderStep1 to read from data parameter instead of wizardData
- Read status.crowdsec and status.lapi_status from passed data
- Ensures button state reflects actual API response
Issue: Next button not clickable even with LAPI available
Cause: renderStep1 reading from stale wizardData instead of fresh data
Solution: Read from data parameter passed by render()
Frontend Changes:
- htdocs/luci-static/resources/view/crowdsec-dashboard/wizard.js
- renderStep1: Read from data.status instead of this.wizardData
- Extract crowdsecRunning and lapiAvailable from data parameter
Version: 0.6.0-5
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fix missing navigation buttons in wizard:
- Add explicit CSS loading in render() method
- Use L.resource() to load wizard.css
- Inject <link> tag into document head
- Ensures wizard styling is applied
Issue: Navigation buttons (Cancel, Next) not visible
Cause: wizard.css was not being loaded
Solution: Add CSS file loading in render method
Frontend Changes:
- htdocs/luci-static/resources/view/crowdsec-dashboard/wizard.js
- Add CSS link injection in render()
- Load crowdsec-dashboard/wizard.css via L.resource()
Version: 0.6.0-4
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fix wizard Next button being disabled issue:
- Add lapi_status field to get_status() RPC method
- Check LAPI availability using 'cscli lapi status'
- Returns 'available' or 'unavailable' status
- Enables wizard to proceed when LAPI is accessible
Backend Changes:
- root/usr/libexec/rpcd/luci.crowdsec-dashboard
- Add LAPI status check before json_dump
- Run 'cscli lapi status' to verify Local API accessibility
Issue: Wizard showed LAPI as UNAVAILABLE even when working
Cause: Missing lapi_status field in status RPC response
Solution: Add LAPI availability check to backend
Version: 0.6.0-3
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fix file permissions for wizard.js and wizard.css:
- Change from 600 (root-only) to 644 (world-readable)
- Allows web server to serve JavaScript and CSS files
- Resolves HTTP 403 Forbidden error when loading wizard
Files Fixed:
- htdocs/luci-static/resources/view/crowdsec-dashboard/wizard.js
- htdocs/luci-static/resources/crowdsec-dashboard/wizard.css
Version: 0.6.0-2
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Added missing RPCD ACL permissions for the new firewall bouncer
management methods to resolve "Access denied" errors.
ACL Changes:
- Added read permissions:
* firewall_bouncer_status - Get service and nftables status
* firewall_bouncer_config - Read UCI configuration
* nftables_stats - Get blocked IPs and rules statistics
- Added write permissions:
* control_firewall_bouncer - Start/stop/restart/enable/disable service
* update_firewall_bouncer_config - Modify UCI settings
These permissions allow the bouncers page to fully manage the firewall
bouncer service through the LuCI web interface.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Enhanced CrowdSec Dashboard bouncers page with comprehensive firewall
bouncer management capabilities.
New Features:
- Dedicated Firewall Bouncer management card with 3 status panels:
* Service Status: Running/stopped, boot start enabled/disabled, configured status
* Blocked IPs: Real-time IPv4/IPv6 blocked IP counts with View Details modal
* nftables Status: IPv4/IPv6 table active status
- Service Control Buttons:
* Start/Stop service (contextual based on current state)
* Restart service
* Enable/Disable boot start (contextual)
* Configuration viewer
- Real-time Updates:
* Auto-refresh every 10 seconds via polling
* Manual refresh button
* Live status badge updates
- nftables Details Modal:
* Lists all blocked IPv4 addresses (scrollable)
* Lists all blocked IPv6 addresses (scrollable)
* Shows IPv4/IPv6 rules count
* Formatted with monospace font
- Configuration Viewer Modal:
* Displays all UCI configuration settings
* Shows enabled/disabled status
* Shows IPv4/IPv6 support
* Shows API URL, update frequency, deny action
* Shows deny logging and log prefix
* Shows configured network interfaces
* Handles unconfigured state with installation prompt
UI Enhancements:
- Responsive grid layout for status cards
- Color-coded status indicators (green=active, red=stopped, gray=disabled, yellow=warning)
- Material design badges for all status indicators
- Visual feedback for all operations with notifications
- Loading spinners for async operations
- Professional styling consistent with SecuBox theme
Integration:
- Utilizes new API methods: getFirewallBouncerStatus, controlFirewallBouncer,
getFirewallBouncerConfig, getNftablesStats
- Error handling with user-friendly notifications
- Proper promise chaining and async/await patterns
Technical Details:
- Added renderFirewallBouncerCard() method (125 lines)
- Added handleFirewallBouncerControl() method for service actions
- Added handleFirewallBouncerRefresh() for manual/auto refresh
- Added showNftablesDetails() modal for blocked IPs
- Added showFirewallBouncerConfig() modal for UCI settings
- Enhanced load() to fetch firewall bouncer data
- Updated polling to refresh firewall bouncer status
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Add comprehensive backend support for managing the CrowdSec Firewall Bouncer
through the dashboard with full control and monitoring capabilities.
RPC Backend Enhancements (luci.crowdsec-dashboard):
- get_firewall_bouncer_status: Detailed status (running, enabled, UCI config, nftables)
- control_firewall_bouncer: Service control (start/stop/restart/enable/disable)
- get_firewall_bouncer_config: Read UCI configuration
- update_firewall_bouncer_config: Modify UCI settings
- get_nftables_stats: nftables statistics (blocked IPs, rules count)
API Methods Added (api.js):
- getFirewallBouncerStatus(): Get bouncer status and health
- controlFirewallBouncer(action): Control service lifecycle
- getFirewallBouncerConfig(): Read configuration
- updateFirewallBouncerConfig(key, value): Update settings
- getNftablesStats(): Get firewall statistics
Features:
- Real-time service status monitoring
- nftables table detection (IPv4/IPv6)
- Blocked IP counting
- UCI configuration management
- Service lifecycle control
- Comprehensive error handling
Status Information Provided:
- Service running state
- Init script enabled state
- UCI configuration status
- nftables tables active (crowdsec, crowdsec6)
- Blocked IPv4/IPv6 count
- Rules count per table
Configuration Options Supported:
- enabled, ipv4, ipv6 (boolean)
- api_url, update_frequency, deny_action, log_level (string)
- deny_log, filter_input, filter_forward (boolean)
- interfaces list
Next: Frontend UI enhancements for bouncer management panel
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fixed "[object HTMLElement]" display bugs in CrowdSec dashboard views by properly structuring DOM element children arrays.
## Problem:
Multiple CrowdSec dashboard views were showing "[object HTMLElement]" instead of properly rendered content. This occurred when JavaScript code tried to concatenate strings with E() DOM elements using the + operator.
## Root Cause:
```javascript
// WRONG: String concatenation with DOM elements
E('p', {}, _('Access metrics at: ') + E('code', {}, url))
// Results in: "Access metrics at: [object HTMLElement]"
```
When you concatenate a string with a DOM element, JavaScript converts the DOM element to its string representation "[object HTMLElement]", which then gets rendered as text.
## Solution:
Changed from string concatenation to proper children arrays:
```javascript
// CORRECT: Array of children
E('p', {}, [
_('Access metrics at: '),
E('code', {}, url)
])
```
## Files Fixed:
### metrics.js (line 299-302):
- Fixed "Access metrics at: [object HTMLElement]" in metrics export info box
- Changed from concatenation to children array
### settings.js (line 217-220):
- Fixed "Or use: [object HTMLElement]" in collections empty state
- Changed from concatenation to children array
### waf.js (lines 123-126):
- Fixed 4 instances in WAF setup instructions:
- "Install AppSec collections: [object HTMLElement]"
- "Restart CrowdSec service: [object HTMLElement]"
- "Verify status: [object HTMLElement]"
- Changed all from concatenation to children arrays
## Technical Notes:
- The E() helper function expects children to be:
1. A single string
2. A single DOM element
3. An array of strings and/or DOM elements
- String concatenation (+) cannot be used to combine text with DOM elements
- Always use array notation when mixing text and elements
## Testing:
- Deployed to router 192.168.8.191
- Metrics view now displays "Access metrics at: http://127.0.0.1:6060/metrics" correctly
- Settings view shows "Or use: cscli hub update" properly
- WAF view renders all setup instructions with code blocks correctly
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Fixed pgrep command to detect running CrowdSec process:
- Changed from `pgrep -x crowdsec` to `pgrep crowdsec`
- The -x flag requires exact process name match which wasn't working
- Affects both check_cscli() and get_status() functions
- Now correctly detects service as running in dashboard
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Enhanced dashboard UX when CrowdSec service is not running:
API module (api.js):
- Modified getDashboardData() to handle error responses gracefully
- Returns empty arrays/objects for stats when service is stopped
- Includes error flag in response data
Overview module (overview.js):
- Added 'fs' module import for service control
- Added startCrowdSec() function to start service from UI
- Display warning banner when service is stopped
- Provide actionable message with start service link
Dashboard CSS (dashboard.css):
- Added .cs-warning-banner styles for error messages
- Professional warning styling with icon and content layout
This resolves XHR timeout errors by showing friendly error messages
instead of hanging requests.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Added service status check in check_cscli() function to immediately return
an error instead of timing out when crowdsec service is not running.
This fixes the 'XHR request timed out' error in the dashboard when CrowdSec
is stopped.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Changed 'new api()' to 'api' in all dashboard views since the API module
exports an object, not a constructor class.
Fixed files:
- overview.js
- decisions.js
- alerts.js
- metrics.js
- waf.js
This resolves the 'TypeError: api is not a constructor' error.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Changed menu dependency from 'luci-app-crowdsec' to 'luci-app-crowdsec-dashboard'
to match the actual ACL name, making CrowdSec visible in LuCI interface.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Removed hard dependency on crowdsec package to fix recursive dependency error:
- luci-app-crowdsec-dashboard previously depended on crowdsec
- This created circular dependency with secubox-app-crowdsec
CrowdSec should be installed separately or via catalog if needed.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
