Skip to content

Create global search modal

What does this MR do and why?

Creates a global search modal.

Related to #378542 (closed)

Most of the functionality is copied from the Header search.

There was an initial MR which has s already UX, backend, and a first round of frontend approved though it was suggested by frontend maintainer that it would be easier to review it in smaller parts. So this is the final part which in fact is the main change. Two previous MRs is the preparation for this one. The main changes in comparison with the Header Search are:

  • Search is rendered in the modal, and data is provided with other super sidebar data
  • To render groups of search items we use GlDisclosureDropdownGroup. The data structure changes are mainly related to the use of this component - we adjust the data to be consumable by it.

The paths to the final state

👣 First MR

👣 Second MR

👣 Final (current)


Knows issues/follow-ups

Empty search results handling

Mobile UX polishes

Non-unique list item keys

How to set up and validate locally

Prepare

  1. Enable the feature flag:
echo "Feature.enable(:super_sidebar_nav)" | rails c
  1. Enable the user setting from the user dropdown:

Screenshot_2022-12-13_at_1.32.43_PM

  1. The super sidebar should now appear on every page.
  2. The search button is in the top right corner of the navigation sidebar right before the user profile

Screenshot_2023-03-07_at_14.07.42

  1. Click on it, and the search modal will show up (or use s or / keyboard shortcuts). It should behave similarly to the header search

Screen recording

2023-03-17_19.25.35

Edited by Olena Horal-Koretska

Merge request reports