From 1228b9a8a8c3b0e24a66d4d29d7720d322b76ffb Mon Sep 17 00:00:00 2001
From: Michael Klein <michael@firstiwaslike.com>
Date: Tue, 11 Oct 2022 16:51:55 +0200
Subject: [PATCH] Prototype StreamStatus integration peers detail

---
 .../consul/peer/bento-box/index.hbs           | 26 +++++++++----------
 .../app/components/consul/peer/list/index.hbs |  4 +--
 .../app/helpers/smart-date-format.js          |  6 ++---
 ui/packages/consul-ui/app/models/peer.js      |  1 +
 .../consul-ui/app/services/repository/peer.js | 10 +++++++
 5 files changed, 29 insertions(+), 18 deletions(-)

diff --git a/ui/packages/consul-peerings/app/components/consul/peer/bento-box/index.hbs b/ui/packages/consul-peerings/app/components/consul/peer/bento-box/index.hbs
index 54a38b952..7ffe6e92d 100644
--- a/ui/packages/consul-peerings/app/components/consul/peer/bento-box/index.hbs
+++ b/ui/packages/consul-peerings/app/components/consul/peer/bento-box/index.hbs
@@ -1,8 +1,8 @@
-<Hds::Card::Container @level="base" @hasBorder={{true}} class="mb-3 mt-6">
-  <div class="h-24 p-6 flex space-x-12 overflow-x-scroll">
+<Hds::Card::Container @level="base" @hasBorder={{true}} class="mt-6 mb-3">
+  <div class="flex h-24 p-6 overflow-x-scroll space-x-12">
     <div class="shrink-0">
       <div
-        class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foreground-primary"
+        class="mb-2 hds-typography-body-200 hds-font-weight-semibold text-hds-foreground-primary"
       >Status</div>
       <div class="flex items-center">
         <Peerings::Badge @peering={{@peering}} />
@@ -10,11 +10,11 @@
     </div>
     <div class="shrink-0">
       <div
-        class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foreground-primary"
+        class="mb-2 hds-typography-body-200 hds-font-weight-semibold text-hds-foreground-primary"
       >Latest heartbeat</div>
       <div class="flex items-center">
-        {{#if @peering.heartbeat}}
-          {{#let (smart-date-format @peering.heartbeat) as |smartDate|}}
+        {{#if @peering.LastHeartbeat}}
+          {{#let (smart-date-format @peering.LastHeartbeat) as |smartDate|}}
             <FlightIcon
               @name="activity"
               class="mr-0.5 text-hds-foreground-faint fill-current"
@@ -32,11 +32,11 @@
     </div>
     <div class="shrink-0">
       <div
-        class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foregrouny-primary"
+        class="mb-2 hds-typography-body-200 hds-font-weight-semibold text-hds-foregrouny-primary"
       >Latest receipt</div>
       <div class="flex items-center">
-        {{#if @peering.receipt}}
-          {{#let (smart-date-format @peering.receipt) as |smartDate|}}
+        {{#if @peering.LastReceive}}
+          {{#let (smart-date-format @peering.LastReceive) as |smartDate|}}
             {{#if smartDate.isNearDate}}
               <span {{tooltip smartDate.friendly}}>{{smartDate.relative}}</span>
             {{else}}
@@ -50,11 +50,11 @@
     </div>
     <div class="shrink-0">
       <div
-        class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foreground-primary"
+        class="mb-2 hds-typography-body-200 hds-font-weight-semibold text-hds-foreground-primary"
       >Latest send</div>
       <div class="flex items-center">
-        {{#if @peering.lastSend}}
-          {{#let (smart-date-format @peering.lastSend) as |smartDate|}}
+        {{#if @peering.LastSend}}
+          {{#let (smart-date-format @peering.LastSend) as |smartDate|}}
             {{#if smartDate.isNearDate}}
               <span {{tooltip smartDate.friendly}}>{{smartDate.relative}}</span>
             {{else}}
@@ -68,4 +68,4 @@
 
     </div>
   </div>
-</Hds::Card::Container>
\ No newline at end of file
+</Hds::Card::Container>
diff --git a/ui/packages/consul-peerings/app/components/consul/peer/list/index.hbs b/ui/packages/consul-peerings/app/components/consul/peer/list/index.hbs
index 993bd93d2..6735fc217 100644
--- a/ui/packages/consul-peerings/app/components/consul/peer/list/index.hbs
+++ b/ui/packages/consul-peerings/app/components/consul/peer/list/index.hbs
@@ -30,7 +30,7 @@
       >
         {{t
           "routes.dc.peers.index.detail.imported.count"
-          count=(format-number item.ImportedServiceCount)
+          count=(format-number (or item.ImportedServiceCount 0))
         }}
       </div>
 
@@ -41,7 +41,7 @@
       >
         {{t
           "routes.dc.peers.index.detail.exported.count"
-          count=(format-number item.ExportedServiceCount)
+          count=(format-number (or item.ExportedServiceCount 0))
         }}
       </div>
 
diff --git a/ui/packages/consul-ui/app/helpers/smart-date-format.js b/ui/packages/consul-ui/app/helpers/smart-date-format.js
index 9e0e63598..45dce293c 100644
--- a/ui/packages/consul-ui/app/helpers/smart-date-format.js
+++ b/ui/packages/consul-ui/app/helpers/smart-date-format.js
@@ -10,10 +10,10 @@ const MILLISECONDS_IN_WEEK = MILLISECONDS_IN_DAY * 7;
  */
 function isNearDate(date) {
   const now = new Date();
-  const aWeekAgo = now - MILLISECONDS_IN_WEEK;
-  const aWeekInFuture = now + MILLISECONDS_IN_WEEK;
+  const aWeekAgo = +now - MILLISECONDS_IN_WEEK;
+  const aWeekInFuture = +now + MILLISECONDS_IN_WEEK;
 
-  return date >= aWeekAgo && aWeekInFuture;
+  return date >= aWeekAgo && date <= aWeekInFuture;
 }
 
 export default class SmartDateFormat extends Helper {
diff --git a/ui/packages/consul-ui/app/models/peer.js b/ui/packages/consul-ui/app/models/peer.js
index 6695253d8..245f8ea0f 100644
--- a/ui/packages/consul-ui/app/models/peer.js
+++ b/ui/packages/consul-ui/app/models/peer.js
@@ -22,6 +22,7 @@ export default class Peer extends Model {
   @attr('string') PeerID;
 
   @attr() PeerServerAddresses;
+  @attr() StreamStatus;
 
   // StreamStatus
   @nullValue([]) @attr() ImportedServices;
diff --git a/ui/packages/consul-ui/app/services/repository/peer.js b/ui/packages/consul-ui/app/services/repository/peer.js
index c177f2448..838de8fb1 100644
--- a/ui/packages/consul-ui/app/services/repository/peer.js
+++ b/ui/packages/consul-ui/app/services/repository/peer.js
@@ -107,6 +107,16 @@ export default class PeerService extends RepositoryService {
       }}
     `
     )((headers, body, cache) => {
+      const { StreamStatus } = body;
+      if (StreamStatus.LastHeartbeat) {
+        StreamStatus.LastHeartbeat = new Date(StreamStatus.LastHeartbeat);
+      }
+      if (StreamStatus.LastReceive) {
+        StreamStatus.LastReceive = new Date(StreamStatus.LastReceive);
+      }
+      if (StreamStatus.LastSend) {
+        StreamStatus.LastSend = new Date(StreamStatus.LastSend);
+      }
       return {
         meta: {
           version: 2,