Replace work item list tabs with search tokens

Part of the requirements of supporting the consolidated work items list is to support a 'status' filter to switch between displaying Open and Closed work items. If we add a status filter, the status tabs are no longer needed:

Tab Filter Logic
Open status = 'Open' only show 'Open' items
Closed status = 'Closed' only show 'Closed' items
All no filter show items with any status

We should make this configurable via a prop to switch it on or off depending on where we're using WorkItemsListApp.

We will probably also need to make this prop visible on the EE version of WorkItemsListApp

Note: Unless #512661 (closed) is completed, do not apply this configuration to any particular use of WorkItemsListApp. If it is completed, apply the configuration to enable the change on the WorkItemsListApp component used on the new /work_items page.

Proposal

  • Add a withTabs prop which defaults to true.
  • When withTabs is false, do not pass the tabs prop to IssuableList
  • When withTabs is false, include state tokens in the searchToken prop on IssuableList
  • When withTabs is true (the default), preserve the existing functionality.

Requirements

  • Must not display tabs for Opened, Closed, and All items when the withTabs prop is false.
  • Must allow searching for Opened or Closed items in the search input when the withTabs prop is false.
  • Must sync the state search tokens with the page URL search parameters
  • If #512661 (closed) is complete, apply the change to the /work_items page.
Edited by Chaitanya Sonwane