Skip to content

Improvement: Align data tables and pagination across settings (Teams, Members, …) #2792

Description

@yannickmonney

Problem

Standard data tables in the app do not share one look-and-feel, especially pagination. Teams and Members are a clear example of the same settings area feeling like two different products.

Current behaviour

  • Shared primitives: DataTable, DataTablePagination, useDataTable, useListPage under app/components/ui/data-table/ and app/hooks/use-list-page.ts.
  • Teams (TeamsTable + useTeamsTableConfig): useListPage search toolbar, pageSize: 20, stickyLayout: false, no page-size selector — sits in SettingsPage / SettingsSection.
  • Members (MembersSettings + MemberTable): external SearchInput + client filter/sort (not useListPage); DataTable client pagination with pageSize: 10 and showPageSizeSelector: true; different column-size assumptions (≤940px / org page).
  • Other settings tables (providers, API keys) follow the Teams / useListPage pattern more closely than Members.

Proposed change

  • Pick one canonical settings-table pattern (prefer useListPage + DataTable as used by Teams/providers) and migrate Members and other divergent settings lists to it where client-side lists make sense.
  • Unify pagination chrome: default page size, whether a page-size selector appears, footer copy, search placement (in-table vs external).
  • Leave intentionally different tables alone only where the interaction model truly differs (e.g. infinite-scroll knowledge lists) — document those exceptions in the PR.

Acceptance criteria

Affected service

Platform (web app)

Related

Closed: #2646 (DataTable footer entity pluralization), #1463 (org page pagination).

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions