From cec146d2a39703549313d6c8611cf95ffa7d3d13 Mon Sep 17 00:00:00 2001 From: John Cowen Date: Fri, 11 May 2018 16:25:35 +0100 Subject: [PATCH] Session Delete confirmation button and KV console error message (#4109) Fix session invalidation in table confirmation dialog, plus console error message when deleting deep KV's --- ui-v2/app/mixins/kv/with-actions.js | 3 +- ui-v2/app/routes/dc/kv/folder.js | 3 +- ui-v2/app/routes/dc/kv/index.js | 32 ++++++++++--------- ui-v2/app/services/feedback.js | 15 ++++++--- ui-v2/app/services/kv.js | 23 ++++++++++--- .../components/confirmation-dialog.scss | 7 ++++ ui-v2/app/templates/dc/nodes/-sessions.hbs | 5 +-- 7 files changed, 61 insertions(+), 27 deletions(-) diff --git a/ui-v2/app/mixins/kv/with-actions.js b/ui-v2/app/mixins/kv/with-actions.js index dcc1e6dbb..e9abd5786 100644 --- a/ui-v2/app/mixins/kv/with-actions.js +++ b/ui-v2/app/mixins/kv/with-actions.js @@ -2,7 +2,7 @@ import Mixin from '@ember/object/mixin'; import { get, set } from '@ember/object'; import WithFeedback from 'consul-ui/mixins/with-feedback'; -const transitionToList = function(key, transitionTo) { +const transitionToList = function(key = '/', transitionTo) { if (key === '/') { return transitionTo('dc.kv.index'); } else { @@ -45,6 +45,7 @@ export default Mixin.create(WithFeedback, { .remove(item) .then(() => { switch (this.routeName) { + case 'dc.kv.folder': case 'dc.kv.index': return this.refresh(); default: diff --git a/ui-v2/app/routes/dc/kv/folder.js b/ui-v2/app/routes/dc/kv/folder.js index d1f806e98..aae571ea1 100644 --- a/ui-v2/app/routes/dc/kv/folder.js +++ b/ui-v2/app/routes/dc/kv/folder.js @@ -4,9 +4,10 @@ import Route from './index'; export default Route.extend({ templateName: 'dc/kv/index', beforeModel: function(transition) { + this._super(...arguments); const params = this.paramsFor('dc.kv.folder'); if (params.key === '/' || params.key == null) { - this.transitionTo('dc.kv.index'); + return this.transitionTo('dc.kv.index'); } }, }); diff --git a/ui-v2/app/routes/dc/kv/index.js b/ui-v2/app/routes/dc/kv/index.js index 4656b0649..a39615aa8 100644 --- a/ui-v2/app/routes/dc/kv/index.js +++ b/ui-v2/app/routes/dc/kv/index.js @@ -13,22 +13,24 @@ export default Route.extend(WithKvActions, { return hash({ isLoading: false, parent: repo.findBySlug(key, dc), - }) - .then(function(model) { - return hash({ - ...model, - ...{ - items: repo.findAllBySlug(get(model.parent, 'Key'), dc), - }, - }); - }) - .catch(e => { - if (e.errors && e.errors[0] && e.errors[0].status == '404') { - this.transitionTo('dc.kv.index'); - return; - } - throw e; + }).then(model => { + return hash({ + ...model, + ...{ + items: repo.findAllBySlug(get(model.parent, 'Key'), dc).catch(e => { + return this.transitionTo('dc.kv.index'); + }), + }, }); + }); + }, + actions: { + error: function(e) { + if (e.errors && e.errors[0] && e.errors[0].status == '404') { + return this.transitionTo('dc.kv.index'); + } + throw e; + }, }, setupController: function(controller, model) { this._super(...arguments); diff --git a/ui-v2/app/services/feedback.js b/ui-v2/app/services/feedback.js index c8b81b398..09bfaf51d 100644 --- a/ui-v2/app/services/feedback.js +++ b/ui-v2/app/services/feedback.js @@ -16,10 +16,17 @@ export default Service.extend({ }); }) .catch(e => { - get(this, 'flashMessages').add({ - type: 'error', - message: error, - }); + if (e.name === 'TransitionAborted') { + get(this, 'flashMessages').add({ + type: 'success', + message: success, + }); + } else { + get(this, 'flashMessages').add({ + type: 'error', + message: error, + }); + } }) .finally(function() { controller.set('isLoading', false); diff --git a/ui-v2/app/services/kv.js b/ui-v2/app/services/kv.js index 8c75d99e2..ef31e1bc8 100644 --- a/ui-v2/app/services/kv.js +++ b/ui-v2/app/services/kv.js @@ -10,9 +10,14 @@ export default Service.extend({ // this one gives you the full object so key,values and meta findBySlug: function(key, dc) { if (isFolder(key)) { - return Promise.resolve({ - Key: key, - }); + const id = JSON.stringify([dc, key]); + let item = get(this, 'store').peekRecord('kv', id); + if (!item) { + item = this.create(); + set(item, 'Key', key); + set(item, 'Datacenter', dc); + } + return Promise.resolve(item); } return get(this, 'store') .queryRecord('kv', { @@ -45,6 +50,16 @@ export default Service.extend({ set(item, 'Datacenter', dc); return item; }); + }) + .catch(e => { + if (e.errors && e.errors[0] && e.errors[0].status == '404') { + const id = JSON.stringify([dc, key]); + const record = get(this, 'store').peekRecord('kv', id); + if (record) { + record.destroyRecord(); + } + } + throw e; }); }, create: function() { @@ -66,6 +81,6 @@ export default Service.extend({ }); }, invalidate: function() { - get(this, 'store').unloadAll('kv'); + return get(this, 'store').unloadAll('kv'); }, }); diff --git a/ui-v2/app/styles/components/confirmation-dialog.scss b/ui-v2/app/styles/components/confirmation-dialog.scss index daf64e175..0e4e1dec8 100644 --- a/ui-v2/app/styles/components/confirmation-dialog.scss +++ b/ui-v2/app/styles/components/confirmation-dialog.scss @@ -1,6 +1,9 @@ div.with-confirmation { @extend %confirmation-dialog, %confirmation-dialog-inline; } +table div.with-confirmation.confirming { + background-color: $white; +} %confirmation-dialog-inline p { color: $text-note; } @@ -16,3 +19,7 @@ div.with-confirmation { align-items: center; line-height: 1; } +table div.with-confirmation.confirming { + position: absolute; + right: 0; +} diff --git a/ui-v2/app/templates/dc/nodes/-sessions.hbs b/ui-v2/app/templates/dc/nodes/-sessions.hbs index 3631ff22e..322cb9411 100644 --- a/ui-v2/app/templates/dc/nodes/-sessions.hbs +++ b/ui-v2/app/templates/dc/nodes/-sessions.hbs @@ -38,10 +38,11 @@ {{#block-slot 'action' as |confirm|}} {{/block-slot}} - {{#block-slot 'dialog'}} + {{#block-slot 'dialog' as |execute cancel message|}}

- Are you sure you want to invalidate {{item.ID}}? + {{message}}

+ {{/block-slot}} {{/confirmation-dialog}}