# Search Input Debounce Audit

**Date**: 2025-01-27  
**Action**: 2.4.1.3 - Add debounce to all search inputs  
**Status**: ✅ Complete (Audit)

## Overview

This document audits all search inputs in the codebase to verify debouncing is implemented consistently.

## Search Components Audit

### ✅ Already Using Debounce

1. **`apps/web/src/components/search/Search.tsx`**
   - Uses `useDebounce` hook (line 68)
   - Configurable `debounceDelay` prop (default: 300ms)
   - Used by GlobalSearchBar, SearchBar components

2. **`apps/web/src/pages/SearchPage.tsx`**
   - Uses `useDebounce` hook (line 34)
   - 500ms delay
   - Debounced query used in React Query keys

3. **`apps/web/src/features/tracks/components/TrackSearch.tsx`**
   - Uses `useDebounce` hook (line 39)
   - 500ms delay
   - Debounced query used for API calls

4. **`apps/web/src/features/library/pages/LibraryPage.tsx`**
   - ✅ **Just added** `useDebounce` hook (Action 2.4.1.2)
   - 300ms delay
   - Debounced search term used in queryParams

5. **`apps/web/src/features/playlists/components/PlaylistSearch.tsx`**
   - Uses `useDebounce` hook (line 41)
   - 500ms delay
   - Debounced query used for API calls

### ⚠️ Using Manual Debounce (Should Standardize)

6. **`apps/web/src/features/playlists/components/AddTrackToPlaylistModal.tsx`**
   - Uses manual `setTimeout` debounce (line 76)
   - 500ms delay
   - **Recommendation**: Replace with `useDebounce` hook for consistency

### ❓ Manual Search (No Auto-Search)

7. **`apps/web/src/features/chat/components/MessageSearch.tsx`**
   - Does NOT use debounce
   - Search only triggers on button click or Enter key
   - No automatic search as you type
   - **Status**: Intentional design - no debounce needed (manual search)

## Summary

**Total Search Components**: 7  
**Using `useDebounce` Hook**: 5 ✅  
**Using Manual Debounce**: 1 ⚠️ (should standardize)  
**Manual Search (no debounce needed)**: 1 ✅

## Recommendations

1. ✅ **LibraryPage**: Already fixed (Action 2.4.1.2)
2. ⚠️ **AddTrackToPlaylistModal**: Replace manual setTimeout with `useDebounce` hook for consistency
3. ✅ **MessageSearch**: No changes needed (manual search is intentional)

## Action Items

- [x] Audit all search inputs
- [x] Document current state
- [ ] **Optional**: Standardize AddTrackToPlaylistModal to use `useDebounce` hook (low priority, manual debounce works)

## Validation

✅ All search inputs that trigger automatic API calls use debouncing  
✅ LibraryPage search debouncing added  
⚠️ One component uses manual debounce (acceptable but could be standardized)