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
137 lines
3.4 KiB
JavaScript
137 lines
3.4 KiB
JavaScript
import { inject as service } from '@ember/service';
|
|
import { later, next } from '@ember/runloop';
|
|
import Route from '@ember/routing/route';
|
|
import { AbortError } from '@ember-data/adapter/error';
|
|
import RSVP from 'rsvp';
|
|
import { action } from '@ember/object';
|
|
import classic from 'ember-classic-decorator';
|
|
|
|
@classic
|
|
export default class ApplicationRoute extends Route {
|
|
@service config;
|
|
@service system;
|
|
@service store;
|
|
@service token;
|
|
|
|
queryParams = {
|
|
region: {
|
|
refreshModel: true,
|
|
},
|
|
};
|
|
|
|
resetController(controller, isExiting) {
|
|
if (isExiting) {
|
|
controller.set('error', null);
|
|
}
|
|
}
|
|
|
|
async beforeModel(transition) {
|
|
let promises;
|
|
|
|
// service:router#transitionTo can cause this to rerun because of refreshModel on
|
|
// the region query parameter, this skips rerunning the detection/loading queries.
|
|
if (transition.queryParamsOnly) {
|
|
promises = Promise.resolve(true);
|
|
} else {
|
|
|
|
let exchangeOneTimeToken;
|
|
|
|
if (transition.to.queryParams.ott) {
|
|
exchangeOneTimeToken = this.get('token').exchangeOneTimeToken(transition.to.queryParams.ott);
|
|
} else {
|
|
exchangeOneTimeToken = Promise.resolve(true);
|
|
}
|
|
|
|
try {
|
|
await exchangeOneTimeToken;
|
|
} catch (e) {
|
|
this.controllerFor('application').set('error', e);
|
|
}
|
|
|
|
const fetchSelfTokenAndPolicies = this.get('token.fetchSelfTokenAndPolicies')
|
|
.perform()
|
|
.catch();
|
|
|
|
const fetchLicense = this.get('system.fetchLicense')
|
|
.perform()
|
|
.catch();
|
|
|
|
const checkFuzzySearchPresence = this.get('system.checkFuzzySearchPresence')
|
|
.perform()
|
|
.catch();
|
|
|
|
promises = await RSVP.all([
|
|
this.get('system.regions'),
|
|
this.get('system.defaultRegion'),
|
|
fetchLicense,
|
|
fetchSelfTokenAndPolicies,
|
|
checkFuzzySearchPresence,
|
|
]);
|
|
}
|
|
|
|
if (!this.get('system.shouldShowRegions')) return promises;
|
|
|
|
const queryParam = transition.to.queryParams.region;
|
|
const defaultRegion = this.get('system.defaultRegion.region');
|
|
const currentRegion = this.get('system.activeRegion') || defaultRegion;
|
|
|
|
// Only reset the store if the region actually changed
|
|
if (
|
|
(queryParam && queryParam !== currentRegion) ||
|
|
(!queryParam && currentRegion !== defaultRegion)
|
|
) {
|
|
this.system.reset();
|
|
this.store.unloadAll();
|
|
}
|
|
|
|
this.set('system.activeRegion', queryParam || defaultRegion);
|
|
|
|
return promises;
|
|
}
|
|
|
|
// Model is being used as a way to propagate the region and
|
|
// one time token query parameters for use in setupController.
|
|
model({ region }, { to: { queryParams: { ott }}}) {
|
|
return {
|
|
region,
|
|
hasOneTimeToken: ott,
|
|
};
|
|
}
|
|
|
|
setupController(controller, { region, hasOneTimeToken }) {
|
|
if (region === this.get('system.defaultRegion.region')) {
|
|
next(() => {
|
|
controller.set('region', null);
|
|
});
|
|
}
|
|
|
|
super.setupController(...arguments);
|
|
|
|
if (hasOneTimeToken) {
|
|
// Hack to force clear the OTT query parameter
|
|
later(() => {
|
|
controller.set('oneTimeToken', '');
|
|
}, 500);
|
|
}
|
|
}
|
|
|
|
@action
|
|
didTransition() {
|
|
if (!this.get('config.isTest')) {
|
|
window.scrollTo(0, 0);
|
|
}
|
|
}
|
|
|
|
@action
|
|
willTransition() {
|
|
this.controllerFor('application').set('error', null);
|
|
}
|
|
|
|
@action
|
|
error(error) {
|
|
if (!(error instanceof AbortError)) {
|
|
this.controllerFor('application').set('error', error);
|
|
}
|
|
}
|
|
}
|