From 6e23f5a14ce35f295420c6e55e07698d2553c0f9 Mon Sep 17 00:00:00 2001 From: John Cowen Date: Wed, 17 Nov 2021 15:59:26 +0000 Subject: [PATCH] ui: When certain menus are selected reset either nspace/partition (#11479) For our dc, nspace and partition 'bucket' menus, sometimes when selecting one 'bucket' we need to reset a different 'bucket' back to the one that your token has by default (or the default if not). For example when switching to a different partition whilst you are in a non-default namespace of another partition, we need to switch you to the token default namespace of the partition you are switching to. --- .changelog/11479.txt | 3 ++ .../consul/partition/selector/index.hbs | 12 +++-- .../app/components/hashicorp-consul/index.hbs | 6 ++- .../app/locations/fsm-with-optional.js | 44 +++++++++---------- .../consul-ui/app/templates/application.hbs | 7 ++- .../lib/startup/templates/body.html.js | 8 +--- 6 files changed, 42 insertions(+), 38 deletions(-) create mode 100644 .changelog/11479.txt diff --git a/.changelog/11479.txt b/.changelog/11479.txt new file mode 100644 index 000000000..3da6e7feb --- /dev/null +++ b/.changelog/11479.txt @@ -0,0 +1,3 @@ +```release-note:improvement +ui: When switching partitions reset the namespace back to the tokens default namespace or default +``` diff --git a/ui/packages/consul-partitions/app/components/consul/partition/selector/index.hbs b/ui/packages/consul-partitions/app/components/consul/partition/selector/index.hbs index ec2449e73..f67ed1cac 100644 --- a/ui/packages/consul-partitions/app/components/consul/partition/selector/index.hbs +++ b/ui/packages/consul-partitions/app/components/consul/partition/selector/index.hbs @@ -1,5 +1,8 @@ {{#if (can "use partitions")}} {{#if (can "choose partitions" dc=@dc)}} +{{#let + (or @partition 'default') +as |partition|}}
  • - {{@partition}} + {{partition}} {{#let components.MenuItem components.MenuSeparator as |MenuItem MenuSeparator|}} @@ -24,10 +27,10 @@ /> {{#each (reject-by 'DeletedAt' @partitions) as |item|}} @@ -55,8 +58,9 @@ class="partition" aria-label="Admin Partition" > - {{@partition}} + {{partition}}
    • +{{/let}} {{/if}} {{/if}} diff --git a/ui/packages/consul-ui/app/components/hashicorp-consul/index.hbs b/ui/packages/consul-ui/app/components/hashicorp-consul/index.hbs index 634f9f8c5..43a62a56c 100644 --- a/ui/packages/consul-ui/app/components/hashicorp-consul/index.hbs +++ b/ui/packages/consul-ui/app/components/hashicorp-consul/index.hbs @@ -38,7 +38,11 @@ (if item.Local ' is-local') (if item.Primary ' is-primary') }} - @href={{href-to '.' params=(hash dc=item.Name)}} + @href={{href-to '.' params=(hash + dc=item.Name + partition=undefined + nspace=(if (gt @nspace.length 0) @nspace undefined) + )}} > {{item.Name}} diff --git a/ui/packages/consul-ui/app/locations/fsm-with-optional.js b/ui/packages/consul-ui/app/locations/fsm-with-optional.js index 5d5eeb19b..e81d85553 100644 --- a/ui/packages/consul-ui/app/locations/fsm-with-optional.js +++ b/ui/packages/consul-ui/app/locations/fsm-with-optional.js @@ -206,29 +206,19 @@ export default class FSMWithOptionalLocation { withOptional = false; break; } - const router = this.router._routerMicrolib; - let url; - try { - url = router.generate(routeName, ...params, { - queryParams: {}, - }); - } catch(e) { - if( - !(this.router.currentRouteName.startsWith('docs') && - e.message.startsWith('There is no route named ') - ) - ) { - if(this.router.currentRouteName.startsWith('docs') && routeName.startsWith('dc')) { - params.unshift('dc-1'); - url = router.generate(routeName, ...params, { - queryParams: {}, - }); - } else { - throw e; - } + if(this.router.currentRouteName.startsWith('docs.')) { + // If we are in docs, then add a default dc as there won't be one in the + // URL + params.unshift(env('CONSUL_DATACENTER_PRIMARY')); + if(routeName.startsWith('dc')) { + // if its an app URL replace it with debugging instead of linking + return `console://${routeName} <= ${JSON.stringify(params)}`; } - return `console://${routeName} <= ${JSON.stringify(params)}`; } + const router = this.router._routerMicrolib; + const url = router.generate(routeName, ...params, { + queryParams: {}, + }); return this.formatURL(url, hash, withOptional); } @@ -241,13 +231,23 @@ export default class FSMWithOptionalLocation { console.log(`location.transitionTo: ${url.substr(10)}`); return true; } + const previousOptional = Object.entries(this.optionalParams()); const transitionURL = this.getURLForTransition(url); if (this._previousURL === transitionURL) { - // probably an optional parameter change + // probably an optional parameter change as the Ember URLs are the same + // whereas the entire URL is different this.dispatch('push', url); return Promise.resolve(); // this.setURL(url); } else { + const currentOptional = this.optionalParams(); + if(previousOptional.some(([key, value]) => currentOptional[key] !== value)) { + // an optional parameter change and a normal param change as the Ember + // URLs are different and we know the optional params changed + // TODO: Consider changing the above previousURL === transitionURL to + // use the same 'check the optionalParams' approach + this.dispatch('push', url); + } // use ember to transition, which will eventually come around to use location.setURL return this.container.lookup('router:main').transitionTo(transitionURL); } diff --git a/ui/packages/consul-ui/app/templates/application.hbs b/ui/packages/consul-ui/app/templates/application.hbs index dbee6e480..6ac2423ea 100644 --- a/ui/packages/consul-ui/app/templates/application.hbs +++ b/ui/packages/consul-ui/app/templates/application.hbs @@ -60,8 +60,8 @@ as |source|> {{! Make sure we guess and default to the right params when not found }} {{#let - (if (can "use partitions") (or route.params.partition notfound.partition token.Partition 'default') 'default') - (if (can "use nspaces") (or route.params.nspace notfound.nspace token.Namespace 'default') 'default') + (if (can "use partitions") (or route.params.partition notfound.partition token.Partition '') '') + (if (can "use nspaces") (or route.params.nspace notfound.nspace token.Namespace '') '') as |partition nspace|}} {{! Make sure we have enough to show the app chrome}} @@ -69,7 +69,6 @@ as |partition nspace|}} - {{! Once we have a list of DCs make sure the DC we are asking for exists }} {{! If not use the DC that the UI is running in }} {{#let @@ -103,7 +102,7 @@ as |dcs|> dcs.data as |dc dcs|}} - {{#if (and (gt dc.Name.length 0) dcs nspace partition)}} + {{#if (and (gt dc.Name.length 0) dcs)}} {{! figure out our current DC and convert it to a model }} { if(get(key)) { - const appName = '${appName}'; - const appNameJS = appName.split('-').map((item, i) => i ? \`\${item.substr(0, 1).toUpperCase()}\${item.substr(1)}\` : item).join(''); - const $script = document.createElement('script'); - $script.setAttribute('data-app-name', '${appName}'); - $script.setAttribute('data-${appName}-routing', ''); - $script.setAttribute('src', \`${rootURL}assets/\${value}/routes.js\`); - document.body.appendChild($script); + document.write(\`\\x3Cscript data-app-name="${appName}" data-${appName}-routing src="${rootURL}assets/\${value}/routes.js">\\x3C/script>\`); } }); }