File search triggers API call on every keystroke, causing rate limit errors

[dodaa08]

Description:

The file search makes a new API request for every character typed, causing HTTP 429 (rate limit) errors that break the search functionality.

Steps to reproduce:

1. Open file search in any channel with files
2. Type search text (e.g., "Clipboard")
3. Backspace to delete characters
4. Observe: search results disappear and don't reload

Expected behavior:

• Search should wait ~300-500ms after user stops typing before making API request
• Results should reload properly after backspacing
• Rate limit errors should be handled gracefully

Actual behavior:

• Every keystroke triggers immediate API call
• Typing 9 characters = 9 separate API requests in rapid succession
• Requests hit rate limit (HTTP 429)
• UI shows blank results with no error message
• Search becomes unusable

Video:

Screencast.From.2025-12-25.10-21-31.mp4

Why This Happens:

The search input updates the query state immediately on every keystroke without any delay. This triggers the API to fetch new results instantly. When you type quickly (like "Clipboard"), it sends 9 API calls one after another, which exceeds the server's rate limit.

The issue is in apps/meteor/client/views/room/contextualBar/RoomFiles/RoomFilesWithData.tsx where the search text state directly triggers API calls without debouncing. The file needs to implement a delay mechanism (debouncing) so the API is only called after the user stops typing.

Environment:

• Version: 8.0 (tested on open.rocket.chat)
• Browser: Brave
• OS: Fedora Linux 43

Console Logs:

/api/v1/channels.files?name=C: Failed to load resource: status 429
/api/v1/channels.files?name=Cl: Failed to load resource: status 429
/api/v1/channels.files?name=Cli: Failed to load resource: status 429

Are you working on this?
✅ Yes, I am working on this.

[padhle-yrr-adi]

@dodaa08 hyy i m a new contributor....can you plz assign this to me? i want to work on it!! can you plz help me out

[vasusadariya]

hey @dodaa08 i have raised a PR #37980 please go through it and review it and say if any changes may required

[dodaa08]

@vasusadariya I think you should at least mention in comments or in community before a PR, as I mentioned I was working on it, So if someone is working, there time doesn't get wasted

[vasusadariya]

Hey @dodaa08 sorry for that take care of it from now on!

[smirk-dev]

Great catch on this performance issue! The file search is making multiple API calls per keystroke which exceeds rate limits. Here's my approach:

Root Cause Analysis:

• Search input updates trigger immediate API calls without throttling
• Each character typed = 1 API call, causing cascading failures
• No debounce mechanism delays execution until user stops typing

Technical Solution:

1. Implement Debouncing:

   • Use debounce utility (rxjs debounceTime or lodash.debounce)
   • Wait 300-500ms after user stops typing
   • Cancel previous pending requests if user types again

2. Code Changes:

   • Identify search input handler in file search component
   • Wrap API call in debounce function
   • Ensure proper cleanup on component unmount

3. Implementation Details:

   • For RxJS: Use debounceTime(300) operator in search observable
   • For Lodash: Wrap search handler with debounce(handleSearch, 300)
   • Add loading state management for better UX

4. Testing Strategy:

   • Test rapid keystrokes to verify only 1 API call
   • Monitor network to confirm request reduction
   • Verify search results appear correctly
   • Test edge cases (backspace, delete, paste)

5. Performance Impact:

   • Reduces API calls from 9 to 1 for typing
   • No more HTTP 429 errors
   • Better UX with no UI blocking

Ready to implement with proper testing following RocketChat guidelines!