Skip to content

[WIP] Add list details page for managing include/exclude list values - #3264

Draft
zackcl wants to merge 1 commit into
devfrom
feature/3255-list-details-page
Draft

[WIP] Add list details page for managing include/exclude list values#3264
zackcl wants to merge 1 commit into
devfrom
feature/3255-list-details-page

Conversation

@zackcl

@zackcl zackcl commented Aug 4, 2026

Copy link
Copy Markdown
Collaborator

Resolves #3255

Summary

Implements the list details page design proposed in #3255.

  • Adds dedicated details pages for private include/exclude lists used by experiments, feature flags, and segments
  • Makes list names clickable links to their details pages
  • Keeps list creation and editing focused on metadata, with newly created lists opening directly on their details page
  • Supports searching, adding, editing, deleting, importing, and exporting values
  • Uses existing details-page cards, menus, tables, empty states, and modal patterns
  • Supports up to 3,000 values per list for this WIP
  • Prevents backend memory exhaustion when experiments contain large inclusion and exclusion lists

Key behavior

  • Creating a list navigates directly to its details page
  • List metadata can be edited or the entire list can be deleted from the page header menu
  • Values are displayed as searchable, selectable table rows
  • Values can be entered or pasted into a multi-line field and added directly
  • Duplicate values are skipped and reported through a snackbar
  • Individual values can be edited or deleted
  • CSV files can be selected or dragged and dropped
  • CSV imports support appending to or replacing the existing values
  • Export includes the complete list regardless of the active search
  • Empty lists use the same no-data table pattern as existing details pages
  • The value count is displayed as Values (N) and omitted when the list is empty

Intentional differences from #3255

Based on implementation review and UX iteration:

  • The Add Values modal uses a multi-line text field without a separate review step
  • Selecting Add applies the entered values immediately
  • Duplicate results are reported after the operation instead of being shown inside the modal
  • CSV replacement does not show an additional confirmation modal
  • A zero-value list displays Values rather than Values (0)
  • The search field is wide enough to display UUID-style values more clearly

Large-list handling

The previous experiment query loaded inclusion and exclusion list members in the same joined result. Large lists could therefore produce a multiplicative number of database rows and exhaust the Node.js heap.

This WIP loads inclusion and exclusion segment data separately and merges the results by experiment ID, avoiding that Cartesian growth without requiring a database migration.

Tested with an experiment containing:

  • 2,337 inclusion values
  • 2,321 exclusion values
  • Successful experiment details and experiment list API responses without clearing the database

Current WIP scope

The details page is currently connected to private lists owned by experiments, feature flags, and segments. This PR is intended for UX and large-list testing before the implementation is finalized.

Screenshot

Screenshot 2026-08-04 at 12 13 49 PM

Screen recording

list.details.page.mov

@zackcl
zackcl requested review from bcb37 and danoswaltCL August 4, 2026 16:15
@zackcl zackcl self-assigned this Aug 4, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add a List Details page for viewing and managing include/exclude list values

1 participant