mirror of https://github.com/status-im/consul.git
Move peering bento box into dedicated component
This commit is contained in:
Michael Klein
parent
e8db58c56b
commit
90259d7366
|
|
@ -0,0 +1,71 @@
|
|||
<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">
|
||||
<div class="shrink-0">
|
||||
<div
|
||||
class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foreground-primary"
|
||||
>Status</div>
|
||||
<div class="flex items-center">
|
||||
<Peerings::Badge @peering={{@peering}} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="shrink-0">
|
||||
<div
|
||||
class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foreground-primary"
|
||||
>Latest heartbeat</div>
|
||||
<div class="flex items-center">
|
||||
{{#if @peering.heartbeat}}
|
||||
{{#let (smart-date-format @peering.heartbeat) as |smartDate|}}
|
||||
<FlightIcon
|
||||
@name="activity"
|
||||
class="mr-0.5 text-hds-foreground-faint fill-current"
|
||||
/>
|
||||
{{#if smartDate.isNearDate}}
|
||||
<span {{tooltip smartDate.friendly}}>{{smartDate.relative}}</span>
|
||||
{{else}}
|
||||
<span>{{smartDate.friendly}}</span>
|
||||
{{/if}}
|
||||
{{/let}}
|
||||
{{else}}
|
||||
<span>None yet</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="shrink-0">
|
||||
<div
|
||||
class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foregrouny-primary"
|
||||
>Latest receipt</div>
|
||||
<div class="flex items-center">
|
||||
{{#if @peering.receipt}}
|
||||
{{#let (smart-date-format @peering.receipt) as |smartDate|}}
|
||||
{{#if smartDate.isNearDate}}
|
||||
<span {{tooltip smartDate.friendly}}>{{smartDate.relative}}</span>
|
||||
{{else}}
|
||||
<span>{{smartDate.friendly}}</span>
|
||||
{{/if}}
|
||||
{{/let}}
|
||||
{{else}}
|
||||
<span>None yet</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="shrink-0">
|
||||
<div
|
||||
class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foreground-primary"
|
||||
>Latest send</div>
|
||||
<div class="flex items-center">
|
||||
{{#if @peering.lastSend}}
|
||||
{{#let (smart-date-format @peering.lastSend) as |smartDate|}}
|
||||
{{#if smartDate.isNearDate}}
|
||||
<span {{tooltip smartDate.friendly}}>{{smartDate.relative}}</span>
|
||||
{{else}}
|
||||
<span>{{smartDate.friendly}}</span>
|
||||
{{/if}}
|
||||
{{/let}}
|
||||
{{else}}
|
||||
<span>None yet</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</Hds::Card::Container>
|
||||
|
|
@ -36,87 +36,7 @@
|
|||
</h1>
|
||||
</BlockSlot>
|
||||
<BlockSlot @name="content">
|
||||
<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">
|
||||
<div class="shrink-0">
|
||||
<div
|
||||
class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foreground-primary"
|
||||
>Status</div>
|
||||
<div class="flex items-center">
|
||||
<Peerings::Badge @peering={{item}} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="shrink-0">
|
||||
<div
|
||||
class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foreground-primary"
|
||||
>Latest heartbeat</div>
|
||||
<div class="flex items-center">
|
||||
{{#if item.heartbeat}}
|
||||
{{#let (smart-date-format item.heartbeat) as |smartDate|}}
|
||||
<FlightIcon
|
||||
@name="activity"
|
||||
class="mr-0.5 text-hds-foreground-faint fill-current"
|
||||
/>
|
||||
{{#if smartDate.isNearDate}}
|
||||
<span
|
||||
{{tooltip smartDate.friendly}}
|
||||
>{{smartDate.relative}}</span>
|
||||
{{else}}
|
||||
<span>{{smartDate.friendly}}</span>
|
||||
{{/if}}
|
||||
{{/let}}
|
||||
{{else}}
|
||||
<span>None yet</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="shrink-0">
|
||||
<div
|
||||
class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foregrouny-primary"
|
||||
>Latest receipt</div>
|
||||
<div class="flex items-center">
|
||||
{{#if item.receipt}}
|
||||
{{#let (smart-date-format item.receipt) as |smartDate|}}
|
||||
{{#if smartDate.isNearDate}}
|
||||
<span
|
||||
{{tooltip smartDate.friendly}}
|
||||
>{{smartDate.relative}}</span>
|
||||
{{else}}
|
||||
<span>{{smartDate.friendly}}</span>
|
||||
{{/if}}
|
||||
{{/let}}
|
||||
{{else}}
|
||||
<span>None yet</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="shrink-0">
|
||||
<div
|
||||
class="hds-typography-body-200 hds-font-weight-semibold mb-2 text-hds-foreground-primary"
|
||||
>Latest send</div>
|
||||
<div class="flex items-center">
|
||||
{{#if item.lastSend}}
|
||||
{{#let (smart-date-format item.lastSend) as |smartDate|}}
|
||||
{{#if smartDate.isNearDate}}
|
||||
<span
|
||||
{{tooltip smartDate.friendly}}
|
||||
>{{smartDate.relative}}</span>
|
||||
{{else}}
|
||||
<span>{{smartDate.friendly}}</span>
|
||||
{{/if}}
|
||||
{{/let}}
|
||||
{{else}}
|
||||
<span>None yet</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</Hds::Card::Container>
|
||||
<Consul::Peer::BentoBox @peering={{item}} />
|
||||
<Peerings::Provider @peer={{item}} as |peering|>
|
||||
<TabNav @items={{peering.data.tabs}} />
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue