kyle/vip-coordinator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Create reusable DataTable and list page infrastructure #16

New Issue
Closed
opened 2026-02-08 06:44:20 -08:00 by kyle · 1 comment
kyle commented 2026-02-08 06:44:20 -08:00
Owner
Copy Link

Context: VipList, DriverList, EventList, and UserList all duplicate significant patterns:

  • CRUD mutation hooks with identical toast/error handling and cache invalidation
  • Search, filter, sort, and debounce state management
  • Sortable table header columns with sort indicators
  • Mobile card view / desktop table view dual rendering
  • Components are 500-570+ lines each

Files affected:

  • frontend/src/pages/VipList.tsx (570 lines)
  • frontend/src/pages/DriverList.tsx (570 lines)
  • frontend/src/pages/EventList.tsx (509 lines)
  • frontend/src/pages/UserList.tsx (300+ lines)

Suggested fix:

  • Create <SortableHeader> component for table headers with sort state
  • Create useListPage(config) hook for shared search/filter/sort/debounce logic
  • Create <ConfirmDeleteModal> to replace inline confirm() dialogs
  • Break monolithic list pages into composed sub-components

Effort: Medium

**Context:** VipList, DriverList, EventList, and UserList all duplicate significant patterns: - CRUD mutation hooks with identical toast/error handling and cache invalidation - Search, filter, sort, and debounce state management - Sortable table header columns with sort indicators - Mobile card view / desktop table view dual rendering - Components are 500-570+ lines each **Files affected:** - `frontend/src/pages/VipList.tsx` (570 lines) - `frontend/src/pages/DriverList.tsx` (570 lines) - `frontend/src/pages/EventList.tsx` (509 lines) - `frontend/src/pages/UserList.tsx` (300+ lines) **Suggested fix:** - Create `<SortableHeader>` component for table headers with sort state - Create `useListPage(config)` hook for shared search/filter/sort/debounce logic - Create `<ConfirmDeleteModal>` to replace inline `confirm()` dialogs - Break monolithic list pages into composed sub-components **Effort:** Medium
kyle commented 2026-02-08 07:34:35 -08:00
Author
Owner
Copy Link

Created SortableHeader component and useListPage hook. Updated VipList, DriverList, and EventList to use shared infrastructure.

Created SortableHeader component and useListPage hook. Updated VipList, DriverList, and EventList to use shared infrastructure.
kyle closed this issue 2026-02-08 07:34:36 -08:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
No items
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
kyle
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: kyle/vip-coordinator#16
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?