ui: Moves healthcheck list to Glimmer template-only consul component (#9293)

This commit is contained in:
John Cowen 2020-11-30 17:22:43 +00:00 committed by GitHub
parent d09ff9a1b6
commit 7e9b7f4143
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 15 additions and 43 deletions

View File

@ -1,7 +1,10 @@
<div ...attributes>
<div
class="consul-health-check-list"
...attributes
>
<ul>
{{#each items as |item| }}
<li class={{concat 'healthcheck-output ' item.Status}}>
{{#each @items as |item|}}
<li class={{concat 'health-check-output ' item.Status}}>
<div>
<header>
<h3>{{item.Name}}</h3>
@ -23,7 +26,7 @@
<dt>Type</dt>
<dd>
{{item.Type}}
{{#if (and exposed (contains item.Type (array 'http' 'grpc')))}}
{{#if (and @exposed (contains item.Type (array 'http' 'grpc')))}}
<em
data-test-exposed="true"
{{tooltip "Expose.checks is set to true, so all registered HTTP and gRPC check paths are exposed through Envoy for the Consul agent."}}

View File

@ -0,0 +1,5 @@
@import './skin';
@import './layout';
.consul-health-check-list .health-check-output {
@extend %healthcheck-output;
}

View File

@ -1,5 +0,0 @@
import Component from '@ember/component';
export default Component.extend({
tagName: '',
});

View File

@ -18,7 +18,6 @@
@import './components/pill';
@import './components/table';
@import './components/tag-list';
@import './components/healthcheck-output';
@import './components/freetext-filter';
@import './components/filter-bar';
@import './components/flash-message';
@ -57,6 +56,7 @@
@import 'consul-ui/components/consul/tomography/graph';
@import 'consul-ui/components/consul/discovery-chain';
@import 'consul-ui/components/consul/upstream-instance/list';
@import 'consul-ui/components/consul/health-check/list';
@import 'consul-ui/components/consul/exposed-path/list';
@import 'consul-ui/components/consul/external-source';
@import 'consul-ui/components/consul/kind';

View File

@ -1,4 +0,0 @@
@import './healthcheck-output/index';
.healthcheck-output {
@extend %healthcheck-output;
}

View File

@ -1,2 +0,0 @@
@import './skin';
@import './layout';

View File

@ -1,7 +1,7 @@
<div id="health-checks" class="tab-section">
<div role="tabpanel">
{{#if (gt item.Checks.length 0) }}
<HealthcheckList @items={{sort-by (comparator 'check' 'Status:asc') item.Checks}} />
<Consul::HealthCheck::List @items={{sort-by (comparator 'check' 'Status:asc') item.Checks}} />
{{else}}
<EmptyState>
<BlockSlot @name="body">

View File

@ -3,7 +3,7 @@
{{#let (append item.Checks (or proxy.Checks (array))) as |checks|}}
{{#if (gt checks.length 0) }}
<section data-test-checks>
<HealthcheckList
<Consul::HealthCheck::List
@items={{sort-by (comparator 'check' 'Status:asc') checks}}
@exposed={{proxyMeta.ServiceProxy.Expose.Checks}}
/>

View File

@ -1,25 +0,0 @@
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
module('Integration | Component | healthcheck list', function(hooks) {
setupRenderingTest(hooks);
test('it renders', async function(assert) {
// Set any properties with this.set('myProperty', 'value');
// Handle any actions with this.on('myAction', function(val) { ... });
await render(hbs`{{healthcheck-list}}`);
assert.dom('ul').exists({ count: 1 });
// Template block usage:
await render(hbs`
{{#healthcheck-list}}
{{/healthcheck-list}}
`);
assert.dom('ul').exists({ count: 1 });
});
});