Skip to content

feat(frontend): rate limiting and anti-DDoS shield dashboard#654

Open
Adeolu01 wants to merge 1 commit into
SoroLabs:mainfrom
Adeolu01:feat/582-rate-limiting-anti-ddos-shield
Open

feat(frontend): rate limiting and anti-DDoS shield dashboard#654
Adeolu01 wants to merge 1 commit into
SoroLabs:mainfrom
Adeolu01:feat/582-rate-limiting-anti-ddos-shield

Conversation

@Adeolu01

Copy link
Copy Markdown

Summary

Implements the Rate Limiting & Anti-DDoS Frontend Shield dashboard (issue #582): a resilient, off-main-thread component that performs real-time rate limiting and DDoS threat detection without blocking the UI thread.

All work is additive — no existing files are modified. New code lives under frontend/src/lib/shield, frontend/src/components/shield, and frontend/src/hooks/useShield.ts.

What's included

Core engine (src/lib/shield/engine.ts) — a dependency-free, time-pure rate-limiting core:

  • Sliding window bounds sustained per-client cost; token bucket absorbs short bursts.
  • Anomaly detection: volumetric (global RPS), concentration (single-source dominance), and burst (block-rate spike) signals derive a normal → elevated → high → critical threat level.
  • Bounded memory via stale-client eviction; hardened against malformed clientId/cost input.

Off-main-thread processing

  • shield.worker.ts runs the engine inside a Web Worker.
  • bridge.ts provides a uniform interface that transparently falls back to the main thread when workers are unavailable (SSR, jsdom, restrictive sandboxes) and recovers from worker crashes (restart once, then degrade) so the dashboard never goes dark.

React layer

  • useShield hook, stable against unstable config/workerFactory props (no effect loops).
  • Composable dashboard: threat-level gauge, headline metrics, live anomaly list, and top-offenders table — each with empty/zero-traffic states and a worker-health badge.

Testing

  • 56 unit/integration tests covering the engine (all verdict/anomaly branches), the worker handler, the bridge (worker path, fallback, crash recovery), the hook, and every UI component.
  • Coverage on the feature: 97% statements / 93% branches / 96% functions — exceeds the >90% requirement.
npx jest src/lib/shield src/hooks/__tests__/useShield src/components/shield

Documentation

frontend/docs/ANTI_DDOS_SHIELD.md documents the architecture, detection model, usage, and resilience guarantees.

Acceptance criteria

  • Feature implemented to requirements (off-main-thread, fault-tolerant, fallback systems)
  • Unit and integration tests passing (>90% coverage)
  • Security review: input sanitization, bounded memory, no unsafe eval/DOM injection
  • Comprehensive documentation

closes #582

Implements an off-main-thread Rate Limiting & Anti-DDoS Frontend Shield.

- ShieldEngine: dependency-free, time-pure rate-limiting core combining a
  sliding window, a token-bucket burst allowance, and anomaly detection
  (volumetric, source-concentration, burst) with bounded-memory client eviction
  and hardened input handling.
- Web Worker runtime that runs the engine off the main thread, with a thin
  message handler shared by the worker and the fallback path.
- Resilient bridge that transparently falls back to the main thread when
  workers are unavailable and recovers from worker crashes (restart once, then
  degrade) so the dashboard never goes dark.
- useShield hook stable against unstable config/factory props, plus a composable
  dashboard (threat gauge, metrics, anomaly list, top-offenders table).
- 56 unit/integration tests; 97% statements / 93% branch coverage on the
  feature, and documentation in docs/ANTI_DDOS_SHIELD.md.
@drips-wave

drips-wave Bot commented Jun 28, 2026

Copy link
Copy Markdown

@Adeolu01 Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@GBOYEE

GBOYEE commented Jun 28, 2026

Copy link
Copy Markdown

@GBOYEE has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Implement following existing patterns and conventions. Add tests, ensure CI passes, and document any new API surface.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @GBOYEE to this issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Frontend] Create Rate Limiting and Anti-DDoS Frontend Shield Dashboard

2 participants