Tokens in vue issue list filter bar not behaving correctly

Summary

Video summary: https://www.loom.com/share/5f44a576b3604c21876755913c187b7b

• Problem 1 - On the initial page load and selecting the label= token, the initial search term does not return the appropriately scoped results.
• Problem 2 - Attempting to select a label with the same text ~direction vs ~Direction selects and applies the wrong label. (see video summary)

Steps to reproduce

1. Navigate to https://gitlab.com/gitlab-org/gitlab/-/issues
2. In the filter bar, select Label= and start typing direction.
3. Notice how the initial list is the full set of labels, not the search results.
4. Backspace a few letters and then retype the full word direction
5. Select the darker gold direction label with the lower case d.
6. Note how the label applied was the lighter yellow Direction label with a capital D

Example Project

https://gitlab.com/gitlab-org/gitlab/-/issues

What is the current bug behavior?

1. Incorrect search results.
2. Incorrect selection of label

What is the expected correct behavior?

1. Search results return correctly the first time.
2. The label I pick from the list is the label that gets applied in the filter bar

Relevant logs and/or screenshots

Output of checks

Results of GitLab environment info

Expand for output related to GitLab environment info

(For installations with omnibus-gitlab package run and paste the output of:
`sudo gitlab-rake gitlab:env:info`)

(For installations from source run and paste the output of:
`sudo -u git -H bundle exec rake gitlab:env:info RAILS_ENV=production`)

Results of GitLab application Check

Expand for output related to the GitLab application check

(For installations with omnibus-gitlab package run and paste the output of:
sudo gitlab-rake gitlab:check SANITIZE=true)
(For installations from source run and paste the output of:
sudo -u git -H bundle exec rake gitlab:check RAILS_ENV=production SANITIZE=true)
(we will only investigate if the tests are passing)

Possible fixes