open-nomad/ui/app/routes/application.js
Buck Doyle 6d67e90763
Add exchange of one-time token on UI load (#10066)
This adds UI support for receiving the one-time token passed via query parameter, as in #10134
and related PRs, and exchanging it for its corresponding secret ID. When this works, it’s mostly
invisible, with a brief flash of the OTT onscreen.

The authentication failure message now suggests the -authenticate flag.

When OTT exchange fails, it shows a whole-page error.

This includes a known UX shortcoming in that the OTT will not disappear from the URL when an
identifier is specified on the command line, like nomad ui -authenticate jobname. The goal is to
address that shortcoming in a forthcoming pull request.
2021-04-01 13:21:30 -05:00

115 lines
2.7 KiB
JavaScript

import { inject as service } from '@ember/service';
import { 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 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 promises = await RSVP.all([
this.get('system.regions'),
this.get('system.defaultRegion'),
fetchLicense,
fetchSelfTokenAndPolicies,
]);
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 transfer the provided region
// query param to update the controller state.
model(params) {
return params.region;
}
setupController(controller, model) {
const queryParam = model;
if (queryParam === this.get('system.defaultRegion.region')) {
next(() => {
controller.set('region', null);
});
}
return super.setupController(...arguments);
}
@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);
}
}
}