From 39302041e9d65d2ab2c312d7583b9c54fc1ae83d Mon Sep 17 00:00:00 2001
From: John Cowen <johncowen@users.noreply.github.com>
Date: Wed, 19 May 2021 11:05:54 +0100
Subject: [PATCH] ui: Miscellaneous Lock Session fixes (#10225)

---
 .changelog/10225.txt                          |  3 ++
 .../consul/lock-session/form/index.hbs        | 28 ++++++-------
 .../consul/lock-session/list/index.hbs        | 39 ++++++++++---------
 .../consul/lock-session/list/index.scss       | 11 ++++++
 ui/packages/consul-ui/app/models/session.js   |  5 ++-
 .../consul-ui/app/styles/components.scss      |  1 +
 .../app/styles/components/composite-row.scss  |  1 +
 .../consul-ui/mock-api/v1/session/info/_      |  3 +-
 .../consul-ui/mock-api/v1/session/node/_      |  3 +-
 9 files changed, 59 insertions(+), 35 deletions(-)
 create mode 100644 .changelog/10225.txt
 create mode 100644 ui/packages/consul-ui/app/components/consul/lock-session/list/index.scss

diff --git a/.changelog/10225.txt b/.changelog/10225.txt
new file mode 100644
index 0000000000..c3c017c29d
--- /dev/null
+++ b/.changelog/10225.txt
@@ -0,0 +1,3 @@
+```release-note:bug
+ui: Reflect the change of Session API response shape for Checks in post 1.7 Consul 
+```
diff --git a/ui/packages/consul-ui/app/components/consul/lock-session/form/index.hbs b/ui/packages/consul-ui/app/components/consul/lock-session/form/index.hbs
index 70a9d6809d..955fa98f52 100644
--- a/ui/packages/consul-ui/app/components/consul/lock-session/form/index.hbs
+++ b/ui/packages/consul-ui/app/components/consul/lock-session/form/index.hbs
@@ -16,30 +16,32 @@
           <a href="{{env 'CONSUL_DOCS_URL'}}/internals/sessions.html#session-design" rel="help noopener noreferrer" target="_blank">Lock Session</a>
         </h2>
         <dl>
+{{#if api.data.Name}}
           <dt>Name</dt>
           <dd>{{api.data.Name}}</dd>
-          <dt>Agent</dt>
+{{/if}}
+          <dt>ID</dt>
+          <dd>{{api.data.ID}}</dd>
+          <dt>Node</dt>
           <dd>
               <a href={{href-to 'dc.nodes.show' api.data.Node}}>{{api.data.Node}}</a>
           </dd>
-          <dt>ID</dt>
-          <dd>{{api.data.ID}}</dd>
-          <dt>Behavior</dt>
-          <dd>{{api.data.Behavior}}</dd>
-{{#if form.data.Delay }}
           <dt>Delay</dt>
           <dd>{{duration-from api.data.LockDelay}}</dd>
-{{/if}}
-{{#if form.data.TTL }}
           <dt>TTL</dt>
-          <dd>{{api.data.TTL}}</dd>
-{{/if}}
-{{#if (gt api.data.Checks.length 0)}}
+          <dd>{{or api.data.TTL '-'}}</dd>
+          <dt>Behavior</dt>
+          <dd>{{api.data.Behavior}}</dd>
+{{#let (union api.data.NodeChecks api.data.ServiceChecks) as |checks|}}
           <dt>Health Checks</dt>
           <dd>
-              {{ join ', ' api.data.Checks}}
+  {{#if (gt checks.length 0)}}
+              {{ join ', ' checks}}
+  {{else}}
+              -
+  {{/if}}
           </dd>
-{{/if}}
+{{/let}}
         </dl>
 {{#if (can 'delete session' item=api.data)}}
         <ConfirmationDialog @message="Are you sure you want to invalidate this session?">
diff --git a/ui/packages/consul-ui/app/components/consul/lock-session/list/index.hbs b/ui/packages/consul-ui/app/components/consul/lock-session/list/index.hbs
index 4957468e56..90d177525c 100644
--- a/ui/packages/consul-ui/app/components/consul/lock-session/list/index.hbs
+++ b/ui/packages/consul-ui/app/components/consul/lock-session/list/index.hbs
@@ -17,27 +17,26 @@
     {{#if item.Name}}
     <dl>
       <dt>
+        ID
+      </dt>
+      <dd>
         <CopyButton
           @value={{item.ID}}
           @name="ID"
         />
-      </dt>
-      <dd>{{item.ID}}</dd>
+        {{item.ID}}
+      </dd>
     </dl>
     {{/if}}
     <dl class="lock-delay">
-      <dt>
-        <Tooltip>
-          Delay
-        </Tooltip>
+      <dt {{tooltip}}>
+        Delay
       </dt>
       <dd data-test-session-delay>{{duration-from item.LockDelay}}</dd>
     </dl>
     <dl class="ttl">
-      <dt>
-        <Tooltip>
-          TTL
-        </Tooltip>
+      <dt {{tooltip}}>
+        TTL
       </dt>
     {{#if (eq item.TTL "")}}
       <dd data-test-session-ttl={{item.TTL}}>-</dd>
@@ -46,25 +45,27 @@
     {{/if}}
     </dl>
     <dl class="behavior">
-      <dt>
-        <Tooltip>
-          Behavior
-        </Tooltip>
+      <dt {{tooltip}}>
+        Behavior
       </dt>
       <dd>{{item.Behavior}}</dd>
     </dl>
+{{#let (union item.NodeChecks item.ServiceChecks) as |checks|}}
     <dl class="checks">
-      <dt>
-        <Tooltip>
-          Checks
-        </Tooltip>
+      <dt {{tooltip}}>
+        Checks
       </dt>
       <dd>
-      {{#each item.Checks as |item|}}
+{{#if (gt checks.length 0)}}
+      {{#each checks as |item|}}
         <span>{{item}}</span>
       {{/each}}
+{{else}}
+        -
+{{/if}}
       </dd>
     </dl>
+{{/let}}
   </BlockSlot>
 {{#if (can "delete sessions")}}
   <BlockSlot @name="actions">
diff --git a/ui/packages/consul-ui/app/components/consul/lock-session/list/index.scss b/ui/packages/consul-ui/app/components/consul/lock-session/list/index.scss
new file mode 100644
index 0000000000..a557380100
--- /dev/null
+++ b/ui/packages/consul-ui/app/components/consul/lock-session/list/index.scss
@@ -0,0 +1,11 @@
+.consul-lock-session-list .checks dd {
+  display: inline-flex;
+  flex-wrap: wrap;
+  padding-left: 0px;
+}
+.consul-lock-session-list .checks dd > *:not(:last-child)::after {
+  content: ',';
+  margin-right: 0.3em;
+  display: inline;
+}
+
diff --git a/ui/packages/consul-ui/app/models/session.js b/ui/packages/consul-ui/app/models/session.js
index 0645d55bf7..9f50d1d0bb 100644
--- a/ui/packages/consul-ui/app/models/session.js
+++ b/ui/packages/consul-ui/app/models/session.js
@@ -1,4 +1,5 @@
 import Model, { attr } from '@ember-data/model';
+import { nullValue } from 'consul-ui/decorators/replace';
 
 export const PRIMARY_KEY = 'uid';
 export const SLUG_KEY = 'ID';
@@ -18,6 +19,8 @@ export default class Session extends Model {
   @attr('number') CreateIndex;
   @attr('number') ModifyIndex;
 
-  @attr({ defaultValue: () => [] }) Checks;
+  @nullValue([]) @attr({ defaultValue: () => [] }) NodeChecks;
+  @nullValue([]) @attr({ defaultValue: () => [] }) ServiceChecks;
+
   @attr({ defaultValue: () => [] }) Resources; // []
 }
diff --git a/ui/packages/consul-ui/app/styles/components.scss b/ui/packages/consul-ui/app/styles/components.scss
index 313b7cf2e7..4d79762ce0 100644
--- a/ui/packages/consul-ui/app/styles/components.scss
+++ b/ui/packages/consul-ui/app/styles/components.scss
@@ -68,6 +68,7 @@
 @import 'consul-ui/components/consul/external-source';
 @import 'consul-ui/components/consul/kind';
 @import 'consul-ui/components/consul/intention';
+@import 'consul-ui/components/consul/lock-session/list';
 @import 'consul-ui/components/consul/lock-session/form';
 @import 'consul-ui/components/consul/auth-method';
 
diff --git a/ui/packages/consul-ui/app/styles/components/composite-row.scss b/ui/packages/consul-ui/app/styles/components/composite-row.scss
index c971cd2404..cb0d76559a 100644
--- a/ui/packages/consul-ui/app/styles/components/composite-row.scss
+++ b/ui/packages/consul-ui/app/styles/components/composite-row.scss
@@ -18,6 +18,7 @@
 }
 // TODO: This hides the iconless dt's in the below lists as they don't have
 // tooltips the todo would be to wrap these texts in spans
+.consul-lock-session-list ul > li:not(:first-child) dl:not([class]) dt,
 .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,
diff --git a/ui/packages/consul-ui/mock-api/v1/session/info/_ b/ui/packages/consul-ui/mock-api/v1/session/info/_
index e70261964c..a20d41a862 100644
--- a/ui/packages/consul-ui/mock-api/v1/session/info/_
+++ b/ui/packages/consul-ui/mock-api/v1/session/info/_
@@ -7,7 +7,8 @@
             typeof http.body.Namespace !== 'undefined' ? http.body.Namespace : 'default'
         }",
         "Node":"node-1",
-        "Checks":["serfHealth"],
+        "NodeChecks":["serfHealth"],
+        "ServiceChecks": ["${fake.hacker.noun()}Health"],
         "LockDelay":15000000000,
         "Behavior":"${fake.helpers.randomize(['release', 'delete'])}",
         "TTL":"",
diff --git a/ui/packages/consul-ui/mock-api/v1/session/node/_ b/ui/packages/consul-ui/mock-api/v1/session/node/_
index 0346f4f085..3f2dca4d40 100644
--- a/ui/packages/consul-ui/mock-api/v1/session/node/_
+++ b/ui/packages/consul-ui/mock-api/v1/session/node/_
@@ -19,7 +19,8 @@ ${typeof location.search.ns !== 'undefined' ? `
                 "Namespace": "${location.search.ns}",
 ` : ``}
                 "Node":"${location.pathname.get(3)}",
-                "Checks":["serfHealth"],
+                "NodeChecks":["serfHealth"],
+                "ServiceChecks": ["${fake.hacker.noun()}Health"],
                 "LockDelay":15000000000,
                 "Behavior":"${fake.helpers.randomize(['release', 'delete'])}",
                 "TTL":"",