open-vault/ui/app/templates/components/clients/horizontal-bar-chart.hbs
claire bontempo 787ebaebd3
UI/Add double attribution chart to current (#15035)
* update /monthly endpoint

* change object key names to match API

* update serializers

* add optional no data mesage for horizontal chart

* add split chart option for attribution component

* wire up filtering namespaces and auth methods

* update clients current tests

* update todos and address comments

* fix attribution test
2022-04-15 12:06:10 -07:00

31 lines
1,014 B
Handlebars

{{#if @dataset}}
<svg
data-test-horizontal-bar-chart
class="chart is-horizontal"
{{on "mouseleave" this.removeTooltip}}
{{did-insert this.renderChart @dataset}}
{{did-update this.renderChart @dataset}}
>
</svg>
{{else}}
<div class="chart-empty-state">
<EmptyState @subTitle={{or @noDataMessage "No data to display"}} @bottomBorder={{true}} />
</div>
{{/if}}
{{#if this.tooltipTarget}}
{{! Required to set tag name = div https://github.com/yapplabs/ember-modal-dialog/issues/290 }}
{{! Component must be in curly bracket notation }}
{{! template-lint-disable no-curly-component-invocation }}
{{#modal-dialog
tagName="div"
tetherTarget=this.tooltipTarget
targetAttachment="bottom middle"
attachment="bottom middle"
offset="35px 0"
}}
<div class={{concat "chart-tooltip horizontal-chart " (if this.isLabel "is-label-fit-content")}}>
<p>{{this.tooltipText}}</p>
</div>
<div class="chart-tooltip-arrow"></div>
{{/modal-dialog}}
{{/if}}