member badge
George Jabbour
## Summary
Two issues on the matches page:
  1. Lag in filtering
    : Noticeable lag when using filters
  2. Format filter not working
    : Format filter does not apply correctly
---
## Technical Analysis
### Issue 1: Filtering Lag
Root Cause
: No debouncing on filter changes. The
MatchesFilters
component calls
onFiltersChange
immediately on every filter change, triggering instant API calls.
Affected Files
:
  • apps/frontend/src/components/matches/filters/matches-filters.tsx
    - Filter UI (line 74-79)
  • apps/frontend/src/hooks/useMatches.ts
    - Hook that manages filter state (line 81-84)
Fix
: Add debouncing to
useMatches.ts
using the existing
useDebounce
hook:
```typescript
const debouncedFilters = useDebounce(filters, 300);
// Use debouncedFilters in queryParams instead of filters
```
### Issue 2: Format Filter Not Working
Current Flow
:
  • Frontend sends
    format=<uuid>
    via query params
  • Backend
    MatchFilter
    has
    format = filters.UUIDFilter(field_name="format_id")
Investigation Needed
: Debug to confirm the format UUID is being passed correctly. Check browser network tab and Django backend logs.
Affected Files
:
  • apps/frontend/src/components/matches/filters/matches-filters.tsx
    (line 229-247)
  • apps/backend/apps/matches/views/match.py
    - MatchFilter class (line 42)
---
## Implementation Steps
  1. Add debouncing (300ms) to
    useMatches.ts
    filter state
  2. Add console logging to debug format filter
  3. Write backend test for format filtering
  4. Verify all filters work: date, result, deck, format, player
## Acceptance Criteria
  • [ ] Filters debounced by 300ms (no lag)
  • [ ] Format filter correctly filters matches
  • [ ] All other filters still work
  • [ ] Loading state shown during filter application
  • [ ] Backend tests cover format filtering
## Complexity: Medium (M)