feat: repository issues table toolbar#1163
Conversation
|
Hi @anderdc, First of all, thanks for taking the time to review. I opened this PR as an updated version because #738 was closed without being resolved. Please review it when you have a chance. If there are any other issues, feel free to leave a comment and I’ll fix them as soon as possible. Thanks again. |
|
fix conflicts |
anderdc
left a comment
There was a problem hiding this comment.
Two blockers before this can merge:
-
The toolbar and search UI don't match the sibling RepositoryPRsTable, so the two repository tables now look like different products. RepositoryPRsTable keeps one horizontal toolbar row (title + filter Stack, space-between) and its search is AuthorFilter — a button that opens a popover containing the search field. This PR instead splits the toolbar into two stacked rows, adds an always-visible inline TextField (different border radius and background than AuthorFilter's field), and introduces a mobile expand-icon with open/close state that no other table has. Rebuild the toolbar to match RepositoryPRsTable: single-row layout, and use the existing AuthorFilter-style search affordance rather than a new inline one. The search-filtering logic (issueMatchesSearch, searchFilteredIssues, count integration) and the FilterButton typography change are fine to keep.
-
The pagination-reset effect — useEffect(() => setPage(0), [filter, sortKey, sortDirection]) — omits searchQuery. On page 2+, typing a search that narrows results leaves page stale, pagedIssues slices past the end of the array, and the table renders "No issues found" even though matches exist. Add searchQuery to that dependency array.
|
I just fixed always-visible inline TextField as you required, but RepositoryPRsTable provide filter functionality by Author value, but this pr provide search functionality by 3 values includes issue number, title and author. |
Summary
The repository Issues table toolbar lacked client-side search, filter pills had uneven label/count presentation, and the header layout did not adapt well on small screens (no compact search entry point, filters competing with the title on one wrapped row).
Related Issues
Closes #1164
Type of Change
Screenshots
Before
before.mp4
After
after.mp4
Checklist
npm run formatandnpm run lint:fixhave been runnpm run buildpassesSolution
Files
src/components/repositories/RepositoryIssuesTable.tsxsrc/components/FilterButton.tsx