search: Mark label match in dynamic filter suggestions (CodeMirror)
Created by: fkling
For "normal" suggestions CodeMirror marks which part of the label matches the input. This doesn't work for unfiltered suggestions such as dynamic filter suggestions. Recently CodeMirror introduced an option to provide a function that, given a completion item, returns match ranges.
The filters for which we have dynamic suggestions enabled accept regex as input, a simple solution is to take the value, convert it to a regular expression and apply that to the label.
FWIW, Monaco does also highlight the label if the filter value is a simple word. With CodeMirors solution we can even highlight the label when the value is a regular expression.
Before/after video:
https://user-images.githubusercontent.com/179026/177535774-29718000-d3a1-4ed2-ab88-6d314abf4e77.mp4
Test plan
Add repo: or file: filter in the search input and provide a value that returns suggestions. The suggestion labels contain the highlighted value.
App preview:
Check out the client app preview documentation to learn more.