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
86 lines
2.2 KiB
JavaScript
86 lines
2.2 KiB
JavaScript
import Component from '@ember/component';
|
|
import { computed } from '@ember/object';
|
|
import { sort } from '@ember/object/computed';
|
|
import { tagName } from '@ember-decorators/component';
|
|
import classic from 'ember-classic-decorator';
|
|
|
|
@classic
|
|
@tagName('')
|
|
export default class LifecycleChart extends Component {
|
|
tasks = null;
|
|
taskStates = null;
|
|
|
|
@computed('tasks.@each.lifecycle', 'taskStates.@each.state')
|
|
get lifecyclePhases() {
|
|
const tasksOrStates = this.taskStates || this.tasks;
|
|
const lifecycles = {
|
|
'prestart-ephemerals': [],
|
|
'prestart-sidecars': [],
|
|
'poststart-ephemerals': [],
|
|
'poststart-sidecars': [],
|
|
poststops: [],
|
|
mains: [],
|
|
};
|
|
|
|
tasksOrStates.forEach(taskOrState => {
|
|
const task = taskOrState.task || taskOrState;
|
|
|
|
if (task.lifecycleName) {
|
|
lifecycles[`${task.lifecycleName}s`].push(taskOrState);
|
|
}
|
|
});
|
|
|
|
const phases = [];
|
|
const stateActiveIterator = state => state.state === 'running';
|
|
|
|
if (lifecycles.mains.length < tasksOrStates.length) {
|
|
phases.push({
|
|
name: 'Prestart',
|
|
isActive: lifecycles['prestart-ephemerals'].some(stateActiveIterator),
|
|
});
|
|
|
|
phases.push({
|
|
name: 'Main',
|
|
isActive:
|
|
lifecycles.mains.some(stateActiveIterator) ||
|
|
lifecycles['poststart-ephemerals'].some(stateActiveIterator),
|
|
});
|
|
|
|
// Poststart is rendered as a subphase of main and therefore has no independent active state
|
|
phases.push({
|
|
name: 'Poststart',
|
|
});
|
|
|
|
phases.push({
|
|
name: 'Poststop',
|
|
isActive: lifecycles.poststops.some(stateActiveIterator),
|
|
});
|
|
}
|
|
|
|
return phases;
|
|
}
|
|
|
|
@sort('taskStates', function(a, b) {
|
|
return getTaskSortPrefix(a.task).localeCompare(getTaskSortPrefix(b.task));
|
|
})
|
|
sortedLifecycleTaskStates;
|
|
|
|
@sort('tasks', function(a, b) {
|
|
return getTaskSortPrefix(a).localeCompare(getTaskSortPrefix(b));
|
|
})
|
|
sortedLifecycleTasks;
|
|
}
|
|
|
|
const lifecycleNameSortPrefix = {
|
|
'prestart-ephemeral': 0,
|
|
'prestart-sidecar': 1,
|
|
main: 2,
|
|
'poststart-sidecar': 3,
|
|
'poststart-ephemeral': 4,
|
|
poststop: 5,
|
|
};
|
|
|
|
function getTaskSortPrefix(task) {
|
|
return `${lifecycleNameSortPrefix[task.lifecycleName]}-${task.name}`;
|
|
}
|