The TCP monitor creation form showed a placeholder that instructed users to enter a URL with the tcp:// scheme prefix (e.g., tcp://192.168.1.1:8080). Following this guidance caused a silent HTTP 500 error because Go's net.SplitHostPort rejects any input containing a scheme prefix, expecting bare host:port format only.
- Corrected the urlPlaceholder translation key to remove the tcp:// prefix
- Added per-type dynamic placeholder (urlPlaceholderHttp / urlPlaceholderTcp) so the URL input shows the correct example format as soon as the user selects a monitor type
- Added per-type helper text below the URL input explaining the required format, updated in real time when the type selector changes
- Added client-side validation: typing a scheme prefix (://) in TCP mode shows an inline error and blocks form submission before the request reaches the backend
- Reordered the Create Monitor form so the type selector appears before the URL input, giving users the correct format context before they type
- Type selector onChange now clears any stale urlError to prevent incorrect error messages persisting after switching from TCP back to HTTP
- Added 5 new i18n keys across all 5 supported locales (en, de, fr, es, zh)
- Added 10 RTL unit tests covering all new validation paths including the type-change error-clear scenario
- Added 9 Playwright E2E tests covering placeholder variants, helper text, inline error lifecycle, submission blocking, and successful TCP creation
Closes #issue-5 (TCP monitor UI cannot add monitor when following placeholder)
When CrowdSec is first enabled, the 10-60 second startup window caused
the toggle to immediately flicker back to unchecked, the card badge to
show 'Disabled' throughout startup, CrowdSecKeyWarning to flash before
bouncer registration completed, and CrowdSecConfig to show alarming
LAPI-not-ready banners to the user.
Root cause: the toggle, badge, and warning conditions all read from
stale sources (crowdsecStatus local state and status.crowdsec.enabled
server data) which neither reflects user intent during a pending mutation.
- Derive crowdsecChecked from crowdsecPowerMutation.variables during
the pending window so the UI reflects intent immediately on click,
not the lagging server state
- Show a 'Starting...' badge in warning variant throughout the startup
window so the user knows the operation is in progress
- Suppress CrowdSecKeyWarning unconditionally while the mutation is
pending, preventing the bouncer key alert from flashing before
registration completes on the backend
- Broadcast the mutation's running state to the QueryClient cache via
a synthetic crowdsec-starting key so CrowdSecConfig.tsx can read it
without prop drilling
- In CrowdSecConfig, suppress the LAPI 'not running' (red) and
'initializing' (yellow) banners while the startup broadcast is active,
with a 90-second safety cap to prevent stale state from persisting
if the tab is closed mid-mutation
- Add security.crowdsec.starting translation key to all five locales
- Add two backend regression tests confirming that empty-string setting
values are accepted (not rejected by binding validation), preventing
silent re-introduction of the Issue 4 bug
- Add nine RTL tests covering toggle stabilization, badge text, warning
suppression, and LAPI banner suppression/expiry
- Add four Playwright E2E tests using route interception to simulate
the startup delay in a real browser context
Fixes Issues 3 and 4 from the fresh-install bug report.
