ghost/admin/app/components/stats/kpis-overview.hbs
<div class="gh-stats-tabs-header" {{did-update this.fetchDataIfNeeded @chartRange @audience @device @browser @location @source @pathname}}>
<div class="gh-stats-tabs">
<button type="button" class="gh-stats-tab min-width {{if this.uniqueVisitsTabSelected 'is-selected'}}" {{on "click" this.changeTabToUniqueVisits}}>
<Stats::Parts::Metric
@label="Unique visits"
@value={{this.totals.visits}} />
</button>
<button type="button" class="gh-stats-tab min-width {{if this.pageviewsTabSelected 'is-selected'}}" {{on "click" this.changeTabToPageviews}}>
<Stats::Parts::Metric
@label="Pageviews"
@value={{this.totals.pageviews}} />
</button>
<button type="button" class="gh-stats-tab min-width {{if this.bounceRateTabSelected 'is-selected'}}" {{on "click" this.changeTabToBounceRate}}>
<Stats::Parts::Metric
@label="Bounce rate"
@value="{{this.totals.bounce_rate}}%" />
</button>
<button type="button" class="gh-stats-tab min-width {{if this.avgVisitTimeTabSelected 'is-selected'}}" {{on "click" this.changeTabToAvgVisitTime}}>
<Stats::Parts::Metric
@label="Visit duration"
@value="{{this.totals.avg_session_sec}}m" />
</button>
</div>
{{!-- <div class="gh-stats-kpi-granularity">
{{#if this.showGranularity}}
<PowerSelect
@selected={{this.granularity}}
@options={{this.granularityOptions}}
@searchEnabled={{false}}
@onChange={{this.onGranularityChange}}
@triggerComponent={{component "gh-power-select/trigger"}}
@triggerClass="gh-btn gh-stats-section-dropdown"
@dropdownClass="gh-contentfilter-menu-dropdown is-narrow"
@matchTriggerWidth={{false}}
@horizontalPosition="right"
as |option|
>
{{#if option.name}}{{option.name}}{{else}}<span class="red">Unknown option</span>{{/if}}
</PowerSelect>
{{/if}}
</div> --}}
</div>
<div class="gh-stats-kpis-chart-container">
<Stats::Charts::Kpis
@chartRange={{@chartRange}}
@audience={{@audience}}
@device={{@device}}
@browser={{@browser}}
@location={{@location}}
@source={{@source}}
@pathname={{@pathname}}
@selected={{this.selected}}
/>
</div>