6d037633da
This updates the UI to use the new fuzzy search API. It’s a drop-in replacement so the / shortcut to jump to search is preserved, and results can be cycled through and chosen via arrow keys and the enter key. It doesn’t use everything returned by the API: * deployments and evaluations: these match by id, doesn’t seem like people would know those or benefit from quick navigation to them * namespaces: doesn’t seem useful as they currently function * scaling policies * tasks: the response doesn’t include an allocation id, which means they can’t be navigated to in the UI without an additional query * CSI volumes: aren’t actually returned by the API Since there’s no API to check the server configuration and know whether the feature has been disabled, this adds another query in route:application#beforeModel that acts as feature detection: if the attempt to query fails (500), the global search field is hidden. Upon having added another query on load, I realised that beforeModel was being triggered any time service:router#transitionTo was being called, which happens upon navigating to a search result, for instance, because of refreshModel being present on the region query parameter. This PR adds a check for transition.queryParamsOnly and skips rerunning the onload queries (token permissions check, license check, fuzzy search feature detection). Implementation notes: * there are changes to unrelated tests to ignore the on-load feature detection query * some lifecycle-related guards against undefined were required to address failures when navigating to an allocation * the minimum search length of 2 characters is hard-coded as there’s currently no way to determine min_term_length in the UI
18 lines
576 B
Handlebars
18 lines
576 B
Handlebars
<PowerSelect
|
|
@tagName="div"
|
|
data-test-search
|
|
@searchEnabled={{true}}
|
|
@search={{perform this.search}}
|
|
@onInput={{action 'ensureMinimumLength'}}
|
|
@onChange={{action 'selectOption'}}
|
|
@onFocus={{action 'openOnClickOrTab'}}
|
|
@onClose={{action 'onCloseEvent'}}
|
|
@dropdownClass="global-search-dropdown"
|
|
@calculatePosition={{this.calculatePosition}}
|
|
@searchMessageComponent="global-search/message"
|
|
@triggerComponent="global-search/trigger"
|
|
@registerAPI={{action 'storeSelect'}}
|
|
as |option|>
|
|
{{option.label}}
|
|
</PowerSelect>
|