mirror of
https://github.com/status-im/consul.git
synced 2025-01-10 22:06:20 +00:00
ui: Use empty-state for our small empty states (#8262)
This commit is contained in:
parent
c1b50f757c
commit
f0333138fe
@ -1,5 +1,6 @@
|
||||
{{yield}}
|
||||
<div class="empty-state" ...attributes>
|
||||
{{#if hasHeader}}
|
||||
<header>
|
||||
{{#yield-slot name="header"}}
|
||||
{{yield}}
|
||||
@ -8,6 +9,7 @@
|
||||
{{yield}}
|
||||
{{/yield-slot}}
|
||||
</header>
|
||||
{{/if}}
|
||||
{{#yield-slot name="body"}}
|
||||
<div>
|
||||
{{yield}}
|
||||
|
@ -1,6 +1,11 @@
|
||||
import Component from '@ember/component';
|
||||
import { set } from '@ember/object';
|
||||
import Slotted from 'block-slots';
|
||||
|
||||
export default Component.extend(Slotted, {
|
||||
tagName: '',
|
||||
willRender: function() {
|
||||
this._super(...arguments);
|
||||
set(this, 'hasHeader', this._isRegistered('header') || this._isRegistered('subheader'));
|
||||
},
|
||||
});
|
||||
|
@ -40,3 +40,7 @@
|
||||
%empty-state-anchor::before {
|
||||
margin-top: -1px;
|
||||
}
|
||||
%empty-state > div:only-child {
|
||||
padding: 50px 0 10px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
@ -42,7 +42,7 @@ pre code,
|
||||
%flash-message p,
|
||||
%filter-bar input,
|
||||
%phrase-editor input,
|
||||
%tab-section section p {
|
||||
%tab-section p {
|
||||
@extend %p1;
|
||||
}
|
||||
%menu-panel dl,
|
||||
@ -60,6 +60,7 @@ pre code,
|
||||
}
|
||||
.template-error > div,
|
||||
%empty-state-subheader,
|
||||
%empty-state p,
|
||||
%button,
|
||||
%main-content p,
|
||||
%form-element-note,
|
||||
|
@ -3,9 +3,13 @@
|
||||
{{#if (gt item.Checks.length 0) }}
|
||||
<HealthcheckList @items={{sort-by (comparator 'check' 'Status:asc') item.Checks}} />
|
||||
{{else}}
|
||||
<p>
|
||||
This node has no health checks.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
This node has no health checks.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
@ -3,9 +3,13 @@
|
||||
{{#if item.Meta}}
|
||||
<ConsulMetadataList @items={{object-entries item.Meta}} />
|
||||
{{else}}
|
||||
<p>
|
||||
This node has no metadata.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
This node has no metadata.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -13,9 +13,13 @@
|
||||
<ConsulServiceInstanceList @routeName="dc.services.show" @items={{filtered}} @checks={{checks}}/>
|
||||
</BlockSlot>
|
||||
<BlockSlot @name="empty">
|
||||
<p>
|
||||
There are no services.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
There are no services.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
</BlockSlot>
|
||||
</ChangeableSet>
|
||||
</div>
|
||||
|
@ -53,9 +53,13 @@
|
||||
</BlockSlot>
|
||||
</TabularCollection>
|
||||
{{else}}
|
||||
<p>
|
||||
There are no Lock Sessions for this Node. For more information, view <a href="{{ env 'CONSUL_DOCS_URL'}}/internals/sessions.html" rel="help noopener noreferrer" target="_blank">our documentation</a>
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
There are no Lock Sessions for this Node. For more information, view <a href="{{ env 'CONSUL_DOCS_URL'}}/internals/sessions.html" rel="noopener noreferrer" target="_blank">our documentation</a>
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -5,9 +5,13 @@
|
||||
{{#if (gt item.Tags.length 0) }}
|
||||
<TagList @item={{item}} />
|
||||
{{else}}
|
||||
<p>
|
||||
There are no tags.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
There are no tags.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
{{/if}}
|
||||
</section>
|
||||
<section class="metadata">
|
||||
@ -15,9 +19,13 @@
|
||||
{{#if item.Meta}}
|
||||
<ConsulMetadataList @items={{object-entries item.Meta}} />
|
||||
{{else}}
|
||||
<p>
|
||||
This instance has no metadata.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
This instance has no metadata.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
{{/if}}
|
||||
</section>
|
||||
</div>
|
||||
|
@ -1,11 +0,0 @@
|
||||
<div id="tags" class="tab-section">
|
||||
<div role="tabpanel">
|
||||
{{#if (gt item.Tags.length 0) }}
|
||||
<TagList @item={{item}} />
|
||||
{{else}}
|
||||
<p>
|
||||
There are no tags.
|
||||
</p>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
@ -12,9 +12,13 @@
|
||||
<ConsulServiceInstanceList @routeName="dc.services.instance" @items={{filtered}} @proxies={{keyedProxies}}/>
|
||||
</BlockSlot>
|
||||
<BlockSlot @name="empty">
|
||||
<p>
|
||||
There are no services.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
There are no services.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
</BlockSlot>
|
||||
</ChangeableSet>
|
||||
</div>
|
||||
|
@ -34,9 +34,13 @@
|
||||
/>
|
||||
</BlockSlot>
|
||||
<BlockSlot @name="empty">
|
||||
<p>
|
||||
There are no intentions for this service.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
There are no intentions for this service.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
</BlockSlot>
|
||||
</ChangeableSet>
|
||||
</div>
|
||||
|
@ -1,17 +1,19 @@
|
||||
<div id="services" class="tab-section">
|
||||
<div role="tabpanel">
|
||||
{{#if (gt gatewayServices.length 0)}}
|
||||
<section>
|
||||
<p>
|
||||
The following services may receive traffic from external services through this gateway. Learn more about configuring gateways in our
|
||||
<a href="{{env 'CONSUL_DOCS_URL'}}/connect/terminating-gateway" target="_blank" rel="noopener noreferrer">step-by-step guide</a>.
|
||||
</p>
|
||||
<ConsulServiceList @items={{gatewayServices}} @nspace={{nspace}} />
|
||||
</section>
|
||||
{{else}}
|
||||
<p>
|
||||
There are no linked services.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
There are no linked services.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -3,9 +3,13 @@
|
||||
{{#if (gt item.Tags.length 0) }}
|
||||
<TagList @item={{item}} />
|
||||
{{else}}
|
||||
<p>
|
||||
There are no tags.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
There are no tags.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1,16 +1,18 @@
|
||||
<div id="upstreams" class="tab-section">
|
||||
<div role="tabpanel">
|
||||
{{#if (gt gatewayServices.length 0)}}
|
||||
<section>
|
||||
<p>
|
||||
Upstreams are services that may receive traffic from this gateway. Learn more about configuring gateways in our <a href="{{env 'CONSUL_DOCS_URL'}}/connect/ingress-gateway" target="_blank" rel="noopener noreferrer">documentation</a>.
|
||||
</p>
|
||||
<ConsulUpstreamList @items={{gatewayServices}} @dc={{dc}} @nspace={{nspace}} />
|
||||
</section>
|
||||
{{else}}
|
||||
<p>
|
||||
There are no upstreams.
|
||||
</p>
|
||||
<EmptyState>
|
||||
<BlockSlot @name="body">
|
||||
<p>
|
||||
There are no upstreams.
|
||||
</p>
|
||||
</BlockSlot>
|
||||
</EmptyState>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
Loading…
x
Reference in New Issue
Block a user