diff --git a/ui-v2/app/components/consul-nspace-list/README.mdx b/ui-v2/app/components/consul-nspace-list/README.mdx new file mode 100644 index 0000000000..44a10622ab --- /dev/null +++ b/ui-v2/app/components/consul-nspace-list/README.mdx @@ -0,0 +1,24 @@ +## ConsulNspaceList + +``` + +``` + +A presentational component for rendering Consul Namespaces + +### Arguments + +| Argument/Attribute | Type | Default | Description | +| --- | --- | --- | --- | +| `items` | `array` | | An array of Namespaces | +| `ondelete` | `function` | | An action to execute when the `Delete` action is clicked | + +### See + +- [Component Source Code](./index.js) +- [Template Source Code](./index.hbs) + +--- diff --git a/ui-v2/app/components/consul-nspace-list/index.hbs b/ui-v2/app/components/consul-nspace-list/index.hbs new file mode 100644 index 0000000000..8c1a9c9de5 --- /dev/null +++ b/ui-v2/app/components/consul-nspace-list/index.hbs @@ -0,0 +1,55 @@ +{{#if (gt items.length 0)}} + + +{{#if item.DeletedAt}} +

+ Deleting {{item.Name}}... +

+{{else}} + {{item.Name}} +{{/if}} +
+ +
+
Description
+
+ {{item.Description}} +
+
+ {{#if (env 'CONSUL_ACLS_ENABLED')}} + + {{/if}} +
+ + + + + Edit + + + {{#if (not-eq item.Name 'default') }} + + + Delete + + + + + Confirm delete + + +

+ Are you sure you want to delete this namespace? +

+
+ + Delete + +
+
+
+ {{/if}} +
+
+
+{{/if}} \ No newline at end of file diff --git a/ui-v2/app/components/consul-nspace-list/index.js b/ui-v2/app/components/consul-nspace-list/index.js new file mode 100644 index 0000000000..287b2bea3c --- /dev/null +++ b/ui-v2/app/components/consul-nspace-list/index.js @@ -0,0 +1,10 @@ +import Component from '@ember/component'; + +export default Component.extend({ + tagName: '', + actions: { + isLinkable: function(item) { + return !item.DeletedAt; + }, + }, +}); diff --git a/ui-v2/app/components/consul-nspace-list/pageobject.js b/ui-v2/app/components/consul-nspace-list/pageobject.js new file mode 100644 index 0000000000..ef33cf4fc9 --- /dev/null +++ b/ui-v2/app/components/consul-nspace-list/pageobject.js @@ -0,0 +1,7 @@ +export default (collection, clickable, attribute, text, actions) => () => { + return collection('.consul-nspace-list li:not(:first-child)', { + nspace: clickable('a'), + description: text('[data-test-description]'), + ...actions(['edit', 'delete']), + }); +}; diff --git a/ui-v2/app/components/consul-service-list/index.hbs b/ui-v2/app/components/consul-service-list/index.hbs index f73804825f..0328a0e683 100644 --- a/ui-v2/app/components/consul-service-list/index.hbs +++ b/ui-v2/app/components/consul-service-list/index.hbs @@ -1,5 +1,5 @@ {{#if (gt items.length 0)}} - + {{#let (get proxies item.Name) as |proxy|}} {{#let (service/health-checks item proxy) as |health|}} @@ -23,6 +23,7 @@ {{/let}} {{/let}} +{{#if (gt item.InstanceCount 0)}} {{#if (eq item.Kind 'terminating-gateway')}} {{item.Name}} @@ -36,6 +37,11 @@ {{item.Name}} {{/if}} +{{else}} +

+ {{item.Name}} +

+{{/if}}
{{#if (and nspace (env 'CONSUL_NSPACES_ENABLED'))}} diff --git a/ui-v2/app/components/consul-service-list/index.js b/ui-v2/app/components/consul-service-list/index.js index 4798652642..b802add9e4 100644 --- a/ui-v2/app/components/consul-service-list/index.js +++ b/ui-v2/app/components/consul-service-list/index.js @@ -1,5 +1,11 @@ import Component from '@ember/component'; +import { get } from '@ember/object'; export default Component.extend({ tagName: '', + actions: { + isLinkable: function(item) { + return get(item, 'InstanceCount') > 0; + }, + }, }); diff --git a/ui-v2/app/components/consul-token-ruleset-list/index.hbs b/ui-v2/app/components/consul-token-ruleset-list/index.hbs index 036276b2fb..29ab49b9b4 100644 --- a/ui-v2/app/components/consul-token-ruleset-list/index.hbs +++ b/ui-v2/app/components/consul-token-ruleset-list/index.hbs @@ -1,4 +1,4 @@ -{{#let (policy/group item.Policies) as |policies|}} +{{#let (policy/group (or item.Policies item.ACLs.PolicyDefaults (array))) as |policies|}} {{#let (get policies 'management') as |management|}} {{#if (gt management.length 0)}}
@@ -33,7 +33,7 @@
{{else}} - {{#let (append (get policies 'policies') (or item.Roles (array))) as |policies|}} + {{#let (append (get policies 'policies') (or item.Roles item.ACLs.RoleDefaults (array))) as |policies|}} {{#if (gt policies.length 0)}}
Rules
diff --git a/ui-v2/app/components/consul-upstream-list/index.hbs b/ui-v2/app/components/consul-upstream-list/index.hbs index f2249b9304..72dc36bf16 100644 --- a/ui-v2/app/components/consul-upstream-list/index.hbs +++ b/ui-v2/app/components/consul-upstream-list/index.hbs @@ -1,6 +1,6 @@ - + - {{#if (service/exists item)}} + {{#if (gt item.InstanceCount 0)}}
Health diff --git a/ui-v2/app/components/consul-upstream-list/index.js b/ui-v2/app/components/consul-upstream-list/index.js index 4798652642..b802add9e4 100644 --- a/ui-v2/app/components/consul-upstream-list/index.js +++ b/ui-v2/app/components/consul-upstream-list/index.js @@ -1,5 +1,11 @@ import Component from '@ember/component'; +import { get } from '@ember/object'; export default Component.extend({ tagName: '', + actions: { + isLinkable: function(item) { + return get(item, 'InstanceCount') > 0; + }, + }, }); diff --git a/ui-v2/app/components/list-collection/index.hbs b/ui-v2/app/components/list-collection/index.hbs index d83b07604b..cb41866040 100644 --- a/ui-v2/app/components/list-collection/index.hbs +++ b/ui-v2/app/components/list-collection/index.hbs @@ -10,7 +10,13 @@ >
  • {{~#each _cells as |cell|~}} -
  • +
  • {{yield cell.item cell.index}}
    {{yield cell.item cell.index}}
    0; -} - -export default helper(serviceExists); diff --git a/ui-v2/app/styles/components/composite-row.scss b/ui-v2/app/styles/components/composite-row.scss index e60110cacc..956141a8ec 100644 --- a/ui-v2/app/styles/components/composite-row.scss +++ b/ui-v2/app/styles/components/composite-row.scss @@ -7,9 +7,7 @@ } /* hoverable rows */ %composite-row.linkable, -.consul-gateway-service-list > ul > li:not(:first-child), .consul-service-instance-list > ul > li:not(:first-child), -.consul-service-list > ul > li:not(:first-child), .consul-token-list > ul > li:not(:first-child), .consul-policy-list > ul > li:not(:first-child), .consul-role-list > ul > li:not(:first-child) { @@ -17,6 +15,7 @@ } /*TODO: This hides the icons-less dt's in the below lists as */ /* they don't have tooltips */ +.consul-nspace-list > ul > li:not(:first-child) dt, .consul-token-list > ul > li:not(:first-child) dt, .consul-policy-list > ul li:not(:first-child) dl:not(.datacenter) dt, .consul-role-list > ul > li:not(:first-child) dt { diff --git a/ui-v2/app/styles/components/table.scss b/ui-v2/app/styles/components/table.scss index e86da93025..5e82778178 100644 --- a/ui-v2/app/styles/components/table.scss +++ b/ui-v2/app/styles/components/table.scss @@ -23,16 +23,6 @@ --consul-icon: #{$consul-logo-color-svg}; --aws-icon: #{$aws-logo-color-svg}; } -html.template-node.template-show #services td:first-child a span { - @extend %with-external-source-icon; - float: left; - margin-right: 10px; - margin-top: 2px; -} -/* This nudges the th in for the external source icons */ -html.template-node.template-show #services th:first-child { - text-indent: 28px; -} td.folder::before { @extend %with-folder-outline-mask, %as-pseudo; @@ -88,22 +78,11 @@ th span em { } /**/ -/* ideally these would be in route css files, but left here as they */ -/* accomplish the same thing (hide non-essential columns for tables) */ -@media #{$--lt-medium-table} { - /* Policy > Datacenters */ - html.template-policy.template-list tr > :nth-child(2) { - display: none; - } -} @media #{$--lt-wide-table} { /* hide actions on narrow screens, you can always click in do everything from there */ tr > .actions { display: none; } - html.template-node.template-show #services tr > :last-child { - display: none; - } html.template-node.template-show #lock-sessions tr > :not(:first-child):not(:last-child) { display: none; } diff --git a/ui-v2/app/styles/components/tabular-collection.scss b/ui-v2/app/styles/components/tabular-collection.scss index 4eb1af707f..5ca456c9f4 100644 --- a/ui-v2/app/styles/components/tabular-collection.scss +++ b/ui-v2/app/styles/components/tabular-collection.scss @@ -69,15 +69,6 @@ table.has-actions tr > *:nth-last-child(5):first-child ~ * { } /*TODO: trs only live in tables, get rid of table */ -html.template-nspace.has-acls.template-list main table tr { - @extend %with-acls-nspaces-row; -} -html.template-nspace:not(.has-acls).template-list main table tr { - @extend %nspaces-row; -} -html.template-role.template-list main table tr { - @extend %roles-row; -} html.template-policy.template-edit [role='dialog'] table tr, html.template-policy.template-edit main table tr, html.template-role.template-edit [role='dialog'] table tr, @@ -100,23 +91,6 @@ html.template-node.template-show main table.sessions tr { width: calc(100% - 240px) !important; } -%roles-row > *:nth-child(1), -%roles-row > *:nth-child(2), -%with-acls-nspaces-row > *:nth-child(1), -%with-acls-nspaces-row > *:nth-child(2) { - width: calc(22% - 20px) !important; -} -%with-acls-nspaces-row > *:nth-child(3), -%roles-row > *:nth-child(3) { - width: calc(56% - 20px) !important; -} -%nspaces-row > *:nth-child(1) { - width: 30%; -} -%nspaces-row > *:nth-child(2) { - width: calc(70% - 60px); -} - @media #{$--horizontal-session-list} { %node-sessions-row > * { // (100% / 7) - (300px / 6) - (120px / 6) diff --git a/ui-v2/app/templates/dc/nspaces/index.hbs b/ui-v2/app/templates/dc/nspaces/index.hbs index 9d3f37aebb..81862b1f28 100644 --- a/ui-v2/app/templates/dc/nspaces/index.hbs +++ b/ui-v2/app/templates/dc/nspaces/index.hbs @@ -21,106 +21,40 @@ /> {{/if}} - - - - Name - Description -{{#if (env 'CONSUL_ACLS_ENABLED')}} - Roles & Policies -{{/if}} - - -{{#if item.DeletedAt}} - -

    - Deleting {{item.Name}}... -

    - -{{else}} - - {{item.Name}} - - -

    {{item.Description}}

    - - {{#if (env 'CONSUL_ACLS_ENABLED')}} - - {{#each (compact (append item.ACLs.PolicyDefaults item.ACLs.RoleDefaults)) as |item|}} - {{item.Name}} - {{/each}} - - {{/if}} -{{/if}} -
    - - - - More - - -
  • - Edit -
  • -{{#if (not-eq item.Name 'default') }} -
  • - -
    -
    -
    -
    - Confirm Delete -
    -

    - Are you sure you want to delete this key? -

    -
    -
      -
    • - -
    • -
    • - -
    • -
    -
    -
    -
  • -{{/if}} - - - - - - - - -

    - {{#if (gt items.length 0)}} - No namespaces found - {{else}} - Welcome to Namespaces - {{/if}} -

    -
    - -

    - {{#if (gt items.length 0)}} - No namespaces where found matching that search, or you may not have access to view the namespaces you are searching for. - {{else}} - There don't seem to be any namespaces, or you may not have access to view namespaces yet. - {{/if}} -

    -
    - - - - -
    + + + + +

    + {{#if (gt items.length 0)}} + No namespaces found + {{else}} + Welcome to Namespaces + {{/if}} +

    +
    + +

    + {{#if (gt items.length 0)}} + No namespaces where found matching that search, or you may not have access to view the namespaces you are searching for. + {{else}} + There don't seem to be any namespaces, or you may not have access to view namespaces yet. + {{/if}} +

    +
    + + + + +
    +
    diff --git a/ui-v2/app/templates/dc/services/show/services.hbs b/ui-v2/app/templates/dc/services/show/services.hbs index b42e7a30e3..4b973dc2b5 100644 --- a/ui-v2/app/templates/dc/services/show/services.hbs +++ b/ui-v2/app/templates/dc/services/show/services.hbs @@ -5,7 +5,10 @@ The following services may receive traffic from external services through this gateway. Learn more about configuring gateways in our step-by-step guide.

    - + {{else}} diff --git a/ui-v2/tests/integration/helpers/service/exists-test.js b/ui-v2/tests/integration/helpers/service/exists-test.js deleted file mode 100644 index 508f675df2..0000000000 --- a/ui-v2/tests/integration/helpers/service/exists-test.js +++ /dev/null @@ -1,17 +0,0 @@ -import { module, test } from 'qunit'; -import { setupRenderingTest } from 'ember-qunit'; -import { render } from '@ember/test-helpers'; -import { hbs } from 'ember-cli-htmlbars'; - -module('Integration | Helper | service/exists', function(hooks) { - setupRenderingTest(hooks); - - // Replace this with your real tests. - test('it renders', async function(assert) { - this.set('inputValue', { InstanceCount: 3 }); - - await render(hbs`{{service/exists inputValue}}`); - - assert.equal(this.element.textContent.trim(), 'true'); - }); -}); diff --git a/ui-v2/tests/pages.js b/ui-v2/tests/pages.js index 4dd6268249..d22010e94d 100644 --- a/ui-v2/tests/pages.js +++ b/ui-v2/tests/pages.js @@ -41,6 +41,7 @@ import consulTokenListFactory from 'consul-ui/components/consul-token-list/pageo import consulRoleListFactory from 'consul-ui/components/consul-role-list/pageobject'; import consulPolicyListFactory from 'consul-ui/components/consul-policy-list/pageobject'; import consulIntentionListFactory from 'consul-ui/components/consul-intention-list/pageobject'; +import consulNspaceListFactory from 'consul-ui/components/consul-nspace-list/pageobject'; import consulKvListFactory from 'consul-ui/components/consul-kv-list/pageobject'; // pages @@ -97,6 +98,13 @@ const morePopoverMenu = morePopoverMenuFactory(clickable); const popoverSelect = popoverSelectFactory(clickable, collection); const consulIntentionList = consulIntentionListFactory(collection, clickable, attribute, deletable); +const consulNspaceList = consulNspaceListFactory( + collection, + clickable, + attribute, + text, + morePopoverMenu +); const consulKvList = consulKvListFactory(collection, clickable, attribute, deletable); const consulTokenList = consulTokenListFactory( collection, @@ -166,9 +174,7 @@ export default { ), intentions: create(intentions(visitable, creatable, consulIntentionList, intentionFilter)), intention: create(intention(visitable, submitable, deletable, cancelable)), - nspaces: create( - nspaces(visitable, deletable, creatable, clickable, attribute, collection, text, freetextFilter) - ), + nspaces: create(nspaces(visitable, creatable, consulNspaceList, freetextFilter)), nspace: create( nspace(visitable, submitable, deletable, cancelable, policySelector, roleSelector) ), diff --git a/ui-v2/tests/pages/dc/nspaces/index.js b/ui-v2/tests/pages/dc/nspaces/index.js index b09d00999f..e7836e7b82 100644 --- a/ui-v2/tests/pages/dc/nspaces/index.js +++ b/ui-v2/tests/pages/dc/nspaces/index.js @@ -1,24 +1,7 @@ -export default function( - visitable, - deletable, - creatable, - clickable, - attribute, - collection, - text, - filter -) { +export default function(visitable, creatable, nspaces, filter) { return creatable({ visit: visitable('/:dc/namespaces'), - nspaces: collection( - '[data-test-tabular-row]', - deletable({ - action: attribute('data-test-nspace-action', '[data-test-nspace-action]'), - description: text('[data-test-description]'), - nspace: clickable('a'), - actions: clickable('label'), - }) - ), + nspaces: nspaces(), filter: filter(), }); }