Taylan Bakırcıoğlu 7d3eeebcb7 fix(waf): Require frontend selection with backend + frontend validation ...

COMPLETE UX FIX: Backend validation + Frontend required field

Changes Summary:
1. Backend API validation (waf.py)
2. Frontend API validation (frontend.py)
3. Frontend UI required field (WAFManagement.js)

Problem:
- User creates WAF without selecting frontends
- Backend applies WAF to ALL frontends (unintentional)
- No visual indication that frontend selection is required
- User confused about where WAF is applied

Solution - Part 1: Backend API Validation

waf.py CREATE (lines 418-426):
- Validate frontend_ids not empty
- HTTP 400 if no frontends selected
- Error: "At least one frontend must be selected"

waf.py UPDATE (lines 686-693):
- Validate if frontend_ids explicitly provided
- HTTP 400 if trying to clear all frontends
- Allow config-only updates (preserve frontends)

Solution - Part 2: Frontend Validation

frontend.py CREATE (lines 408-428):
- Validate backend has active servers
- HTTP 400 if backend has no servers
- Error: "Backend has no active servers. Add servers first."

frontend.py UPDATE (lines 650-670):
- Same validation when changing default_backend
- Prevent routing to DOWN backends

Solution - Part 3: Frontend UI (User Experience)

WAFManagement.js (lines 1473-1508):
BEFORE:
- Label: "Target Frontends"
- Tooltip: "Can be left empty for globally available WAF"
- Placeholder: "Select frontends"
- No validation
- Optional field appearance

AFTER:
- Label: "Target Frontends" (with red asterisk)
- Required validation rules:
  * Antd required: true
  * Custom validator: at least 1 frontend
- Placeholder: "Select frontends (Required *)"
- Tooltip: "At least one frontend is required"
- Search enabled for easy filtering
- Error messages:
  * "Please select at least one frontend"
  * "At least one frontend must be selected for WAF rule"

User Experience Improvements:
1. Visual indication: Red asterisk on label
2. Clear placeholder text: "(Required *)"
3. Helpful tooltip: Explains requirement
4. Client-side validation: Immediate feedback
5. Server-side validation: Safety net
6. Searchable dropdown: Easy to find frontends
7. Clear error messages: User knows what to do

Test Scenarios:
1. Create WAF without selecting frontend:
   - UI: Red error "Please select at least one frontend"
   - Submit blocked (client-side)

2. Bypass client-side, try API:
   - API: HTTP 400 "At least one frontend must be selected"

3. Create frontend with server-less backend:
   - UI: Can select backend
   - API: HTTP 400 "Backend has no active servers"

4. Update WAF remove all frontends:
   - UI: Red error message
   - API: HTTP 400 if bypassed

Related: bcb8ef0 (backend without servers)
Refs: #waf-validation #frontend-validation #ux-improvement

2025-11-17 14:15:44 +03:00

..

public

Initial commit

2025-10-27 12:14:03 +03:00

src

fix(waf): Require frontend selection with backend + frontend validation

2025-11-17 14:15:44 +03:00

Dockerfile

feat: Add SSL usage_type (Frontend/Server) with conditional private key requirement

2025-11-11 03:41:47 +03:00

Dockerfile.test

Initial commit

2025-10-27 12:14:03 +03:00

package.json

Initial commit

2025-10-27 12:14:03 +03:00

package.json.test

Initial commit

2025-10-27 12:14:03 +03:00