luxolus
/
open-consul
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity

Prototype StreamStatus integration peers detail

This commit is contained in:
Michael Klein 2022-10-11 16:51:55 +02:00
parent 2bc2079758
commit 1228b9a8a8
5 changed files with 29 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
ui/packages/consul-peerings/app/components/consul/peer/bento-box/index.hbs
View File

@ -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}}

4
ui/packages/consul-peerings/app/components/consul/peer/list/index.hbs
View File

@ -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>

6
ui/packages/consul-ui/app/helpers/smart-date-format.js
View File

@ -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 {

1
ui/packages/consul-ui/app/models/peer.js
View File

@ -22,6 +22,7 @@ export default class Peer extends Model {
@attr('string') PeerID;
@attr() PeerServerAddresses;
@attr() StreamStatus;
// StreamStatus
@nullValue([]) @attr() ImportedServices;

10
ui/packages/consul-ui/app/services/repository/peer.js
View File

@ -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,