mirror of
https://github.com/status-im/consul.git
synced 2025-02-12 05:36:55 +00:00
27048a0612
* Remove unused StatsCard component * Create Card and Stats contextual components with styling * Send endpoint, item, and protocol to Stats as props * WIP basic plumbing for metrics in Ember * WIP metrics data source now works for different protocols and produces reasonable mock responses * WIP sparkline component * Mostly working metrics and graphs in topology * Fix date in tooltip to actually be correct * Clean up console.log * Add loading frame and create a style sheet for Stats * Various polish fixes: - Loading state for graph - Added fake latency cookie value to test loading - If metrics provider has no series/stats for the service show something that doesn't look broken - Graph hover works right to the edge now - Stats boxes now wrap so they are either shown or not as will fit not cut off - Graph resizes when browser window size changes - Some tweaks to number formats and stat metrics to make them more compact/useful * Thread Protocol through topology model correctly * Rebuild assetfs * Fix failing tests and remove stats-card now it's changed and become different * Fix merge conflict * Update api doublt * more merge fixes * Add data-permission and id attr to Card * Run JS linter * Move things around so the tests run with everything available * Get tests passing: 1. Remove fakeLatency setTimeout (will be replaced with CONSUL_LATENCY in mocks) 2. Make sure any event handlers are removed * Make sure the Consul/scripts are available before the app * Make sure interval gets set if there is no cookie value * Upgrade mocks so we can use CONSUL_LATENCY * Fix handling of no series values from Prometheus * Update assetfs and fix a comment * Rebase and rebuild assetfs; fix tcp metric series units to be bits not bytes * Rebuild assetfs * Hide stats when provider is not configured Co-authored-by: kenia <keniavalladarez@gmail.com> Co-authored-by: John Cowen <jcowen@hashicorp.com>
72 lines
2.2 KiB
Handlebars
72 lines
2.2 KiB
Handlebars
{{on-window 'resize' (action this.calculate)}}
|
|
|
|
<div {{did-insert (action this.calculate)}} {{did-update (action this.calculate) @upstreams @downstreams}} class="topology-container">
|
|
{{#if (gt @downstreams.length 0)}}
|
|
<div id="downstream-container">
|
|
<div>
|
|
<p>{{@dc}}</p>
|
|
<span>
|
|
<Tooltip>
|
|
Only showing downstreams within the current datacenter for {{@service.Service.Service}}.
|
|
</Tooltip>
|
|
</span>
|
|
</div>
|
|
<TopologyMetrics::Card
|
|
@items={{@downstreams}}
|
|
@service={{@service.Service.Service}}
|
|
@dc={{@dc}}
|
|
@hasMetricsProvider={{this.hasMetricsProvider}}
|
|
/>
|
|
</div>
|
|
{{/if}}
|
|
<div id="metrics-container">
|
|
<div>
|
|
{{@service.Service.Service}}
|
|
</div>
|
|
{{#if this.hasMetricsProvider }}
|
|
<TopologyMetrics::Series @service={{@service.Service.Service}} @protocol={{@protocol}} />
|
|
<TopologyMetrics::Stats @endpoint='summary-for-service' @service={{@service.Service.Service}} @protocol={{@protocol}} />
|
|
{{/if}}
|
|
<div class="link">
|
|
{{#if @metricsHref}}
|
|
<a class="metrics-link" href={{@metricsHref}} target="_blank" rel="noopener noreferrer">Open metrics Dashboard</a>
|
|
{{else}}
|
|
<a class="settings-link" href={{href-to 'settings'}}>Configure metrics dashboard</a>
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
<div id="downstream-lines">
|
|
<TopologyMetrics::DownLines
|
|
@type='downstream'
|
|
@view={{this.downView}}
|
|
@center={{this.centerDimensions}}
|
|
@lines={{this.downLines}}
|
|
@items={{@downstreams}}
|
|
/>
|
|
</div>
|
|
{{#if (gt @upstreams.length 0)}}
|
|
<div id="upstream-column">
|
|
{{#each-in (group-by "Datacenter" @upstreams) as |dc upstreams|}}
|
|
<div id="upstream-container">
|
|
<p>{{dc}}</p>
|
|
<TopologyMetrics::Card
|
|
@items={{upstreams}}
|
|
@service={{@service.Service.Service}}
|
|
@dc={{@dc}}
|
|
@type='upstream'
|
|
@hasMetricsProvider={{this.hasMetricsProvider}}
|
|
/>
|
|
</div>
|
|
{{/each-in}}
|
|
</div>
|
|
{{/if}}
|
|
<div id="upstream-lines">
|
|
<TopologyMetrics::UpLines
|
|
@type='upstream'
|
|
@view={{this.upView}}
|
|
@center={{this.centerDimensions}}
|
|
@lines={{this.upLines}}
|
|
@items={{@upstreams}}
|
|
/>
|
|
</div>
|
|
</div> |