PR Custody

feat: add tiered daily message rate limits on tool-router playground (20/50/100 by plan)

@devin-ai-integration[bot]checks n/achecks…devin/1774174494-playground-rate-limit → main3 files · +71 −5review: @palash-cupdated 2mo ago

GitHub

▸Description· 2 comments · 8 noise

Summary

Adds client-side daily message limits to the tool-router playground only (/tool-router page — "Chat with over 1000+ Apps"), tiered by plan:

Plan	Daily Limit
HOBBY / Free	20
STARTER	50
GROWTH	100

How it works:

usePlaygroundRateLimit hook (28 lines) tracks daily message count in localStorage, keyed by date
On each message send, recordMessage() checks the count against the user's plan-specific limit and increments
When the limit is hit, a generic orange upgrade banner appears: "You have reached your playground message limit. Upgrade for more." — no plan name or limit number is shown
Plan detection uses authSession.project.org.plan to look up the limit from an inline LIMITS map
While auth session is loading, limit is Infinity (no enforcement) to avoid briefly blocking paid users before plan data arrives
Unknown plan strings fall back to default limit of 20

New files:

usePlaygroundRateLimit.ts — self-contained hook (~28 lines); limits, storage key, and localStorage logic all inlined
PlaygroundRateLimitBanner.tsx — generic upgrade prompt (no props, no plan/limit details exposed)

Modified files:

Tool-router ChatBox component — integrated rate limit check before message send; <form> wrapped in a <div> to position the banner above

Not modified (intentional):

Regular playground ChatBox and floating playground ChatBox are untouched — rate limiting applies only to tool-router per product request

Revision history

v1: Single 20/day limit for free users only, with isFreePlan guard
v2: Fixed auth loading race condition; simplified hook API
v3: Tiered limits by plan (HOBBY=10, STARTER=50, GROWTH=500); all plans rate-limited
v4: Simplified banner — removed plan name and limit number from UI per product request
v5: Radically simplified implementation — inlined all config into the hook, removed constants.ts changes entirely
v6: Updated limits to HOBBY=20, STARTER=50, GROWTH=100 per product request
v7 (current): Scoped rate limiting to tool-router playground only; reverted regular and floating playground ChatBox files to main

Test plan

Tested locally by temporarily overriding the plan in the hook and setting localStorage counts to limit - 1:

HOBBY plan (limit 20): Set localStorage count to 19 → sent 20th message (allowed) → sent 21st message (blocked, banner appeared with generic text). ✅
STARTER plan (limit 50): Set localStorage count to 49 → sent 50th message (allowed) → sent 51st message (blocked, same generic banner). ✅
Upgrade Plan button: Clicked button → navigated to /settings/billing page with pricing plans visible. ✅
Banner text: Verified no plan name or limit number shown — only "Daily message limit reached" and "You have reached your playground message limit. Upgrade for more." ✅

Banner screenshot

View test recording (rec-3050429707b34678aeb871035f52f039-edited.mp4)

Review & Testing Checklist for Human

Tool-router ChatBox layout: The <form> is now wrapped in an extra <div> to position the banner. Verify this doesn't break the layout/centering of the tool-router playground page, especially when the banner is hidden vs. shown.
GROWTH users see "Upgrade Plan" but there's no higher plan: The banner links to /settings/billing. Verify this is acceptable UX for top-tier users hitting 100/day, or consider hiding the upgrade CTA for GROWTH.
isRateLimited is one-way: Once set to true in React state, it never resets within the same page session. Users must refresh the page after the day rolls over.
Testing was done on the regular playground UI, not tool-router: The test recordings show the regular playground surface (the one with "Auto Execute tools" toggle). The tool-router playground has a different layout ("Chat with over 1000+ Apps"). Verify the banner renders correctly on the actual tool-router page.

Suggested manual test:

Navigate to the tool-router playground (/<org>/<project>/tool-router)
Send messages until the limit for your plan is hit → verify the upgrade banner appears
Verify the "Upgrade Plan" button links to the billing page
Verify the regular playground and floating playground are not rate-limited

Notes

This is intentionally client-side only (localStorage). It's bypassable via clearing storage/incognito but raises the bar against casual abuse per the product requirement.
Limits are defined inline in usePlaygroundRateLimit.ts (line 4) rather than in a separate constants file, to minimize the number of files touched.
No server-side rate limiting is added in this PR. The /api/tool-router/chat API route remains unprotected server-side.
The hook and banner live under features/playground/ but are currently only consumed by features/tool-router-playground/. If rate limiting is later extended to other surfaces, these files can be reused as-is.

Link to Devin session: https://app.devin.ai/sessions/a156c5a7266245738941cf2d45fd65ab Requested by: @palash-c

@devin-ai-integration[bot]agent2mo ago

SYSTEM: === BEGIN THREAD HISTORY (in #devin-requests) === Palash Kala (U09ECEFHFCM): @Devin in frontend repo, we are bearing heavy costs on playground do we have instrumentation in it? what project is using how much playground which DB (check hermes repo) is it storing the messages I am curious about how its being used, what messages and so on === END THREAD HISTORY ===

Thread URL: https://composioworkspace.slack.com/archives/C09MKS9DH7D/p1774172907503149?thread_ts=1774172907.503149&cid=C09MKS9DH7D

The latest message is the one right above that tagged you.

@devin-ai-integration[bot]agent2mo ago

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
Look at CI failures and help fix them

⚙️ Control Options:

Disable automatic comment and CI monitoring

▸ 8 bot/status comments hidden

@vercel[bot]2mo ago

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
platform-frontend	Ready	Preview, Comment	Mar 22, 2026 1:27pm

@github-actions[bot]2mo ago

Playwright Test Results

📊 View HTML Report

Tests completed in parallel shards.

@github-actions[bot]2mo ago

Playwright Test Results

📊 View HTML Report

Tests completed in parallel shards.

@github-actions[bot]2mo ago

loading diff…