Admin Panel

User search

Debounced search filters the table and preserves the active filter when paginating.

User story

As an admin, I want to search users by partial name/email and keep my filter when paging through results.

Acceptance criteria

  • Search debounces to 250ms
  • Filter persists across page navigation
  • Empty result shows a 'no users matched' state
  • Clear button resets the filter without losing the page size

Manual test steps

  1. 1.Open /users
  2. 2.Type 'ale' into the search field
  3. 3.Wait for the table to update
  4. 4.Navigate to page 2 and confirm filter persists

Expected result

Page 2 still shows only users matching 'ale'.

Possible bug risks

  • Debounce drops the latest character on fast typing
  • Pagination resets to page 0 on every keystroke
  • Clear button forgets the page size selection

Reference Playwright spec

user-search.spec.ts
ts
1
2
3
4
5
6
7
8
9
10
import { test, expect } from '@playwright/test';

test('search persists across pagination @smoke', async ({ page }) => {
  await page.goto('https://lab.hakdogan.com/users');

  await page.getByLabel(/search users/i).fill('ale');
  await page.getByRole('button', { name: /next page/i }).click();

  await expect(page.getByLabel(/search users/i)).toHaveValue('ale');
});