Skip to content

codemirror: Improve suggestions handling

Administrator requested to merge fkling/cm/query-input-suggestions into main

Created by: fkling

Closes #37696 (closed)

This commit fixes a couple of issues regarding providing suggestions and replacing them.

Mixing dynamic and static filter value suggestions

Static and dynamic filer value suggestions come from two different sources. This allows static suggestions to be shown immediately, and dynamic suggestions are added when loaded. However because dynamic suggestions are not filtered by CodeMirror (the server already sends back only suggestions that match the input), those are inserted before any static suggestions (see CodeMirror documentation). That's surprising to the user if they provided a value to narrow down static suggestions, but then their selection is updated to a dynamic one (see video in PR). This wasn't an issue with Monaco for two reasons:

  • We combine static and dynamic suggestions and show all at once when dynamic suggestions are available.
  • Monaco allows defining a custom label to match against and we use this in a clever way to show dynamic suggestions even if the input value doesn't literally match any of the suggestions. CodeMirror doesn't provide this ability, so we have to resort to disabling filtering. To give a concrete example, if the user types: repo:a{2} we suggest repositories containing aa. Without the trick in Monaco and without disabling filtering in CodeMirror, neither editor would actually show the suggestions because none of the entries contains a{2} literally.

I decided to solve this not showing static suggestions at all if (1) the filter is configured for dynamic suggestions and (2) there is no filter value yet. That means the user cannot narrow down static suggestions by providing more input, but that seems less bad than the current behavior.

Note: Simply changing the logic to combine static and dynamic suggestion like in Monaco wouldn't work because disabling filtering means that all static suggestions would be shown, no matter the input (unless we implement our own filter logic and filter static suggestions beforehand; certainly doable, albeit introducing more complexity).

Before/after video:

https://user-images.githubusercontent.com/179026/177526715-5e9d0fbe-bc59-46b2-b296-f54431c7f0d9.mp4

Default order of static suggestions

It was pointed out (Slack) that CodeMirror sorts the static repo: suggestions differently than Monaco. By setting boost explicitly we ensure that the suggestions are shown in the order as they are defined in code (see previous video in PR). I also changed the order of some static suggestions to make more sense (e.g. move default value to the back).

Replacing whole tokens/filter values

Until suggestions where inserted from some start position (e.g. the filter value start) to the current cursor position. This can lead to unexpected or even broken queries when trying to complete items within a token (see video in PR for example). Explicitly specifying a range end fixes that issue.

Before/after video:

https://user-images.githubusercontent.com/179026/177526905-a6b1dde2-6844-426e-9161-9b0964b09658.mp4

Test plan

Trigger repo: suggestions with and without filter value

App preview:

Check out the client app preview documentation to learn more.

Merge request reports