From 80f9d537819914e216aeea856bf236128d59ab02 Mon Sep 17 00:00:00 2001 From: John Cowen Date: Fri, 9 Oct 2020 15:47:36 +0100 Subject: [PATCH] ui: Add simple intention check interface to per service intentions (#8899) --- .../consul-intention-list/index.hbs | 111 ------------------ .../components/consul-intention-list/index.js | 6 - .../consul-intention-list/index.scss | 19 --- .../consul/intention/list/check/index.hbs | 25 ++++ .../consul/intention/list/components.scss | 27 +++++ .../consul/intention/list/index.hbs | 27 +++++ .../consul/intention/list/index.scss | 4 + .../intention/list}/layout.scss | 0 .../intention/list}/pageobject.js | 0 .../intention/list}/skin.scss | 0 .../consul/intention/list/table/index.hbs | 99 ++++++++++++++++ ui-v2/app/styles/components.scss | 2 +- ui-v2/app/styles/components/notice.scss | 3 + ui-v2/app/templates/dc/intentions/index.hbs | 11 +- .../dc/services/show/intentions/index.hbs | 34 ++++-- ui-v2/package.json | 1 + ui-v2/tests/pages.js | 2 +- ui-v2/yarn.lock | 9 ++ 18 files changed, 229 insertions(+), 151 deletions(-) delete mode 100644 ui-v2/app/components/consul-intention-list/index.hbs delete mode 100644 ui-v2/app/components/consul-intention-list/index.js delete mode 100644 ui-v2/app/components/consul-intention-list/index.scss create mode 100644 ui-v2/app/components/consul/intention/list/check/index.hbs create mode 100644 ui-v2/app/components/consul/intention/list/components.scss create mode 100644 ui-v2/app/components/consul/intention/list/index.hbs create mode 100644 ui-v2/app/components/consul/intention/list/index.scss rename ui-v2/app/components/{consul-intention-list => consul/intention/list}/layout.scss (100%) rename ui-v2/app/components/{consul-intention-list => consul/intention/list}/pageobject.js (100%) rename ui-v2/app/components/{consul-intention-list => consul/intention/list}/skin.scss (100%) create mode 100644 ui-v2/app/components/consul/intention/list/table/index.hbs diff --git a/ui-v2/app/components/consul-intention-list/index.hbs b/ui-v2/app/components/consul-intention-list/index.hbs deleted file mode 100644 index 091e82f7b..000000000 --- a/ui-v2/app/components/consul-intention-list/index.hbs +++ /dev/null @@ -1,111 +0,0 @@ - - -{{#if (gt items.length 0)}} - - - - Source -   - Destination - - Permissions - - Permissions intercept an Intention's traffic using L7 criteria, such as path prefixes and http headers. - - -   - - - - - {{#if (eq item.SourceName '*') }} - All Services (*) - {{else}} - {{item.SourceName}} - {{/if}} - {{! TODO: slugify }} - {{or item.SourceNS 'default'}} - - -{{#let (or item.Action "L7 rules") as |intent|}} - - {{capitalize intent}} - -{{/let}} - - - {{#if (eq item.DestinationName '*') }} - All Services (*) - {{else}} - {{item.DestinationName}} - {{/if}} - {{! TODO: slugify }} - {{or item.DestinationNS 'default'}} - - - - {{#if (gt item.Permissions.length 0)}} - {{pluralize item.Permissions.length 'Permission'}} - {{/if}} - - - {{#if item.IsManagedByCRD}} - - {{/if}} - - - - - - More - - - {{#if item.IsEditable}} -
  • - Edit -
    • -
  • - -
    -
    -
    -
    - Confirm Delete -
    -

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

    -
    -
      -
    • - -
      • -
    • - -
      • -
    -
    -
    -
    • - {{else}} -
  • - View -
    • - {{/if}} -     -     -     -     - -{{else}} - {{yield}} -{{/if}} -     -     diff --git a/ui-v2/app/components/consul-intention-list/index.js b/ui-v2/app/components/consul-intention-list/index.js deleted file mode 100644 index 8e9833de2..000000000 --- a/ui-v2/app/components/consul-intention-list/index.js +++ /dev/null @@ -1,6 +0,0 @@ -import Component from '@ember/component'; - -export default Component.extend({ - tagName: '', - ondelete: function() {}, -}); diff --git a/ui-v2/app/components/consul-intention-list/index.scss b/ui-v2/app/components/consul-intention-list/index.scss deleted file mode 100644 index b083149c8..000000000 --- a/ui-v2/app/components/consul-intention-list/index.scss +++ /dev/null @@ -1,19 +0,0 @@ -@import './skin'; -@import './layout'; -.consul-intention-list td.source, -.consul-intention-list td.destination { - @extend %tbody-th; -} -.consul-intention-list td strong { - @extend %pill-700; -} -.consul-intention-list td.intent-allow strong { - @extend %pill-allow; -} -.consul-intention-list td.intent-deny strong { - @extend %pill-deny; -} -.consul-intention-list td.intent-l7-rules strong { - @extend %pill-l7; -} - diff --git a/ui-v2/app/components/consul/intention/list/check/index.hbs b/ui-v2/app/components/consul/intention/list/check/index.hbs new file mode 100644 index 000000000..6f4650c3d --- /dev/null +++ b/ui-v2/app/components/consul/intention/list/check/index.hbs @@ -0,0 +1,25 @@ +{{#let + (from-entries (array + (array 'allow' 'Allowed') + (array 'deny' 'Denied') + (array '' 'L7 Rules') + )) +as |titles|}} +
    +

    + {{get titles (or @item.Action '')}} +

    +

    + {{#if (eq @item.Action 'allow')}} + Yes, {{item.SourceName}} is allowed to connect to {{@item.DestinationName}} due to the highest precedence intention below: + {{else if (eq @item.Action 'deny')}} + No, {{@item.SourceName}} is not allowed to connect to {{@item.DestinationName}} due to the highest precedence intention below: + {{else}} + {{@item.SourceName}} may or may not be allowed to connect with {{@item.DestinationName}} through its L7 rules. + {{/if}} +

    +
    +{{/let}} diff --git a/ui-v2/app/components/consul/intention/list/components.scss b/ui-v2/app/components/consul/intention/list/components.scss new file mode 100644 index 000000000..e6b00fdad --- /dev/null +++ b/ui-v2/app/components/consul/intention/list/components.scss @@ -0,0 +1,27 @@ +.consul-intention-list { + td.source, + td.destination { + @extend %tbody-th; + } + td strong { + @extend %pill-700; + } + td.intent-allow strong { + @extend %pill-allow; + } + td.intent-deny strong { + @extend %pill-deny; + } + td.intent-l7-rules strong { + @extend %pill-l7; + } + .notice.allow { + @extend %notice-success; + } + .notice.deny { + @extend %notice-error; + } + .notice.permissions { + @extend %notice-info; + } +} diff --git a/ui-v2/app/components/consul/intention/list/index.hbs b/ui-v2/app/components/consul/intention/list/index.hbs new file mode 100644 index 000000000..8ace0370b --- /dev/null +++ b/ui-v2/app/components/consul/intention/list/index.hbs @@ -0,0 +1,27 @@ +
    + + + +{{#let (hash + Check=(component 'consul/intention/list/check') + Table=(component 'consul/intention/list/table' delete=writer.delete items=@items) +) as |api|}} + + {{#if (gt @items.length 0)}} + {{yield api to="idle"}} + {{else}} + {{yield api to="empty"}} + {{/if}} + +{{/let}} + + + +
    \ No newline at end of file diff --git a/ui-v2/app/components/consul/intention/list/index.scss b/ui-v2/app/components/consul/intention/list/index.scss new file mode 100644 index 000000000..e04fb4f63 --- /dev/null +++ b/ui-v2/app/components/consul/intention/list/index.scss @@ -0,0 +1,4 @@ +@import './components'; +@import './skin'; +@import './layout'; + diff --git a/ui-v2/app/components/consul-intention-list/layout.scss b/ui-v2/app/components/consul/intention/list/layout.scss similarity index 100% rename from ui-v2/app/components/consul-intention-list/layout.scss rename to ui-v2/app/components/consul/intention/list/layout.scss diff --git a/ui-v2/app/components/consul-intention-list/pageobject.js b/ui-v2/app/components/consul/intention/list/pageobject.js similarity index 100% rename from ui-v2/app/components/consul-intention-list/pageobject.js rename to ui-v2/app/components/consul/intention/list/pageobject.js diff --git a/ui-v2/app/components/consul-intention-list/skin.scss b/ui-v2/app/components/consul/intention/list/skin.scss similarity index 100% rename from ui-v2/app/components/consul-intention-list/skin.scss rename to ui-v2/app/components/consul/intention/list/skin.scss diff --git a/ui-v2/app/components/consul/intention/list/table/index.hbs b/ui-v2/app/components/consul/intention/list/table/index.hbs new file mode 100644 index 000000000..f379c7a5b --- /dev/null +++ b/ui-v2/app/components/consul/intention/list/table/index.hbs @@ -0,0 +1,99 @@ + + + Source +   + Destination + + Permissions + + Permissions intercept an Intention's traffic using L7 criteria, such as path prefixes and http headers. + + +   + + + + + {{#if (eq item.SourceName '*') }} + All Services (*) + {{else}} + {{item.SourceName}} + {{/if}} + {{! TODO: slugify }} + {{or item.SourceNS 'default'}} + + +{{#let (or item.Action "L7 rules") as |intent|}} + + {{capitalize intent}} + +{{/let}} + + + {{#if (eq item.DestinationName '*') }} + All Services (*) + {{else}} + {{item.DestinationName}} + {{/if}} + {{! TODO: slugify }} + {{or item.DestinationNS 'default'}} + + + + {{#if (gt item.Permissions.length 0)}} + {{pluralize item.Permissions.length 'Permission'}} + {{/if}} + + + {{#if item.IsManagedByCRD}} + + {{/if}} + + + + + + More + + + {{#if item.IsEditable}} +
  • + Edit +
    • +
  • + +
    +
    +
    +
    + Confirm Delete +
    +

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

    +
    +
      +
    • + +
      • +
    • + +
      • +
    +
    +
    +
    • + {{else}} +
  • + View +
    • + {{/if}} +     +     +     +     diff --git a/ui-v2/app/styles/components.scss b/ui-v2/app/styles/components.scss index 6e363f0fc..03182c944 100644 --- a/ui-v2/app/styles/components.scss +++ b/ui-v2/app/styles/components.scss @@ -61,7 +61,7 @@ * when convienient **/ -@import 'consul-ui/components/consul-intention-list'; +@import 'consul-ui/components/consul/intention/list'; @import 'consul-ui/components/consul-intention-form/fieldsets'; @import 'consul-ui/components/consul-intention-permission-list'; @import 'consul-ui/components/consul-intention-permission-form'; diff --git a/ui-v2/app/styles/components/notice.scss b/ui-v2/app/styles/components/notice.scss index 9474ab4a4..5754bbb63 100644 --- a/ui-v2/app/styles/components/notice.scss +++ b/ui-v2/app/styles/components/notice.scss @@ -17,6 +17,9 @@ @extend %with-cancel-square-fill-color-icon; } /**/ +.notice.success { + @extend %notice-success; +} .notice.warning { @extend %notice-warning; } diff --git a/ui-v2/app/templates/dc/intentions/index.hbs b/ui-v2/app/templates/dc/intentions/index.hbs index f7511e7ce..7f109a5f9 100644 --- a/ui-v2/app/templates/dc/intentions/index.hbs +++ b/ui-v2/app/templates/dc/intentions/index.hbs @@ -42,10 +42,14 @@ {{#let (sort-by (comparator 'intention' sort) filtered) as |sorted|}} - + > + <:idle as |list|> + + + <:empty as |list|>

    @@ -74,7 +78,8 @@ - + + {{/let}} diff --git a/ui-v2/app/templates/dc/services/show/intentions/index.hbs b/ui-v2/app/templates/dc/services/show/intentions/index.hbs index 2226d5802..adc278db9 100644 --- a/ui-v2/app/templates/dc/services/show/intentions/index.hbs +++ b/ui-v2/app/templates/dc/services/show/intentions/index.hbs @@ -31,19 +31,33 @@ {{#let (sort-by (comparator 'intention' sort) filtered) as |sorted|}} - - - -

    - There are no intentions {{if (gt items.length 0) 'found '}} for this service. -

    -     -     -     + > + <:idle as |list|> + {{#if (eq searched.length 1)}} + {{#let searched.firstObject as |item|}} + {{#if (eq search item.SourceName)}} + + {{/if}} + {{/let}} + {{/if}} + + + <:empty as |list|> + + +

    + There are no intentions {{if (gt items.length 0) 'found '}} for this service. +

    +     +     + + +     {{/let}} diff --git a/ui-v2/package.json b/ui-v2/package.json index b245e2022..39be59e81 100644 --- a/ui-v2/package.json +++ b/ui-v2/package.json @@ -100,6 +100,7 @@ "ember-load-initializers": "^2.1.1", "ember-math-helpers": "^2.4.0", "ember-maybe-import-regenerator": "^0.1.6", + "ember-named-blocks-polyfill": "^0.2.3", "ember-on-helper": "^0.1.0", "ember-page-title": "^5.2.3", "ember-power-select": "^4.0.3", diff --git a/ui-v2/tests/pages.js b/ui-v2/tests/pages.js index 1b46fdeb6..68e16cf3a 100644 --- a/ui-v2/tests/pages.js +++ b/ui-v2/tests/pages.js @@ -41,7 +41,7 @@ import tokenListFactory from 'consul-ui/components/token-list/pageobject'; import consulTokenListFactory from 'consul-ui/components/consul-token-list/pageobject'; 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 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'; diff --git a/ui-v2/yarn.lock b/ui-v2/yarn.lock index 8f7d5bbd0..93386f8e4 100644 --- a/ui-v2/yarn.lock +++ b/ui-v2/yarn.lock @@ -6115,6 +6115,15 @@ ember-modifier-manager-polyfill@^1.1.0: ember-cli-version-checker "^2.1.2" ember-compatibility-helpers "^1.2.0" +ember-named-blocks-polyfill@^0.2.3: + version "0.2.3" + resolved "https://registry.yarnpkg.com/ember-named-blocks-polyfill/-/ember-named-blocks-polyfill-0.2.3.tgz#05fb3b40cff98a0d30e8c3b1e3d2155951007d84" + integrity sha512-RrhkgWmfte2lRuOmRWWa7sS2Eo6W3O0VybK0iPhhnLvk7VtUSOmFxuDlhAtEaJ0lBieISrNcmSIZRnmgca/HcA== + dependencies: + ember-cli-babel "^7.19.0" + ember-cli-htmlbars "^4.3.1" + ember-cli-version-checker "^5.1.1" + ember-native-dom-helpers@^0.6.3: version "0.6.3" resolved "https://registry.yarnpkg.com/ember-native-dom-helpers/-/ember-native-dom-helpers-0.6.3.tgz#31c88b6eb8e1bb99ee594d19de8f0270d1d5eb35"