Add inlined search for Settings pages
GitLab has a lot of settings, and often it's difficult to determine where exactly something can be found.
It would be great to have the ability to search settings, either in Groups, Projects and the Admin Panel in order to find settings more easily.
Some of our settings pages are quite overwhelming in terms of content. So far we had a practice of siloing it into bits and hiding into expandable sections. With gitlab-org/gitlab-ce#47405 we explored an alternative where the most accessed content isn't hidden. We also introduced other changes that should make these pages easier to use (more descriptive section naming for example).
This alone should work quite well on the Group settings page but other pages have a lot more content. It's inconsiderate to expect from users that they'll scan the whole page and open each section to find what they're looking for. I would like to explore further an idea put forward by @pedroms here.
This would enable users to search for the thing they're looking for and the UI would somehow highlight the relevant section.
We concluded that filtering out irrelevant sections is the way to go. Below is the progression of the interaction + empty state when there are no results.
|Normal state||Search activity||Search results||Search result expanded||No results|
To make this work we need to add the title of the page (I'll open a separate issue to introduce this on other pages) and the search box to the far right of it. The search box is the one without the button so we trigger a search whenever a user types and we indicate the background activity with a spinner.
Due to interest in https://gitlab.com/gitlab-org/gitlab-ce/issues/59244, we may want to first introduce this search to the Admin Area.
We didn't find an answer to the question of whether we should expand the section automatically when there's only one result. For now, let's just focus on showing the relevant sections. We can explore the possibility of automatic expansion later on.
We would also like to explore the possibility of highlighting the matched keywords in the actual section once opened.
What does success look like, and how can we measure that?
(If no way to measure success, link to an issue that will implement a way to measure this)