guibranco / guibranco/logstream-ui

[FEATURE] Rate limit fields in Applications (client management) screen

Open
#163 0 comments 0 reactions 0 assignees View on GitHub
✨ feature enhancement good first issue hacktoberfest help wanted
Dominant language
TypeScript
Stars
1
Forks
0
Avg merge
15m
Merged PRs (30d)
49

Description

## Summary

Extend the Applications screen's client edit form with fields for configuring per-client ingestion rate limits (`rate_limit_per_second` and `rate_limit_burst`), and show a rate limit status badge in the client table.

> **Depends on:** [`[FEATURE] Per-client ingestion rate limiting`](https://github.com/guibranco/logstream-server/issues) in `guibranco/logstream-server`

## Motivation

Rate limits are configured per client. Once the server supports them, operators need a UI to set and adjust them without direct database access.

## Proposed changes

### ClientTable — new column

| Column | Content |
|--------|---------|
| **Rate limit** | `150 req/s (burst: 500)` or `Unlimited` badge |

### ClientForm drawer — new section

Add a **Rate limiting** section below the existing name/active fields:

```
── Rate limiting ─────────────────────────────
Max ingestion rate: [_____] entries / second
Leave blank for unlimited

Burst allowance: [_____] entries
Max entries above the rate
allowed in a short spike
──────────────────────────────────────────────
```

Both fields are optional numbers (blank = no limit). Inline validation: burst must be ≥ rate limit when both are set.

## Files to modify

- `src/components/clients/ClientTable.tsx` — add Rate limit column
- `src/components/clients/ClientForm.tsx` — add rate limiting section
- `src/hooks/useClients.ts` — include `rate_limit_per_second` and `rate_limit_burst` in PUT payload

## Acceptance criteria

- [ ] Rate limit column in client table (shows value or "Unlimited")
- [ ] Rate limit fields in edit form (optional, blank = unlimited)
- [ ] Burst must be ≥ rate limit when both set (client-side validation)
- [ ] Values persisted via `PUT /api/clients/{app_key}`
- [ ] Setting to blank removes the limit (sends `null`)

Contributor guide

Open the contributing guide

Research direction

Start with src/components/clients/ClientTable.tsx and src/components/clients/ClientForm.tsx, then inspect src/hooks/useClients.ts to understand the existing client fields and PUT payload. Run the relevant project checks before editing. Done means the table shows a value or “Unlimited,” the optional fields validate burst ≥ rate, and blank values are persisted as null.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript, vite
Domain
frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Clearly specified
Newbie friendliness
72/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.