c07ab7047e
* date formatters test * add mirage to client history test * use mirage for client tests * update assertions * convert to using pretender * finish client history tests * remove pretender, use mirage * re-add flaky test * add todos * finish tests * update month response * update plot count
260 lines
11 KiB
Handlebars
260 lines
11 KiB
Handlebars
<div class="box is-sideless is-fullwidth is-marginless is-bottomless">
|
||
<p class="has-bottom-margin-xl">
|
||
This data is presented by full month. If there is data missing, it’s possible that tracking was turned off at the time.
|
||
Vault will only show data for contiguous blocks of time during which tracking was on. Documentation is available
|
||
<DocLink @path="/docs/concepts/client-count">here</DocLink>.
|
||
</p>
|
||
<h2 class="title is-6 has-bottom-margin-xs">
|
||
{{this.versionText.label}}
|
||
</h2>
|
||
<div data-test-start-date-editor class="is-flex-align-baseline">
|
||
{{#if this.startTimeDisplay}}
|
||
<p class="is-size-6" data-test-date-display>{{this.startTimeDisplay}}</p>
|
||
<button type="button" class="button is-link" {{on "click" (fn (mut this.isEditStartMonthOpen) true)}}>
|
||
Edit
|
||
</button>
|
||
{{else}}
|
||
<DateDropdown @handleDateSelection={{this.handleClientActivityQuery}} @name={{"startTime"}} @submitText="Save" />
|
||
{{/if}}
|
||
</div>
|
||
<p class="is-8 has-text-grey has-bottom-margin-xl">
|
||
{{this.versionText.description}}
|
||
</p>
|
||
{{#if this.licenseStartIsCurrentMonth}}
|
||
<EmptyState
|
||
@title="No data for this billing period"
|
||
@subTitle="Your billing period has just begun, so there is no data yet. Data will be available here on the first of next month."
|
||
@message="To view data from a previous billing period, you can enter your previous billing start date."
|
||
@bottomBorder={{true}}
|
||
>
|
||
<DateDropdown @handleDateSelection={{this.handleClientActivityQuery}} @name={{"startTime"}} @submitText="View" />
|
||
</EmptyState>
|
||
{{else if (eq @model.config.queriesAvailable false)}}
|
||
{{#if (eq @model.config.enabled "On")}}
|
||
<EmptyState
|
||
@title={{concat "No monthly history " (if this.noActivityDate "from ") this.noActivityDate}}
|
||
@message="There is no data in the monthly history yet. We collect it at the end of each month, so your data will be available on the first of next month."
|
||
/>
|
||
{{else}}
|
||
<EmptyState
|
||
@title="Data tracking is disabled"
|
||
@message="Tracking is disabled, and no data is being collected. To turn it on, edit the configuration."
|
||
>
|
||
{{#if @model.config.configPath.canUpdate}}
|
||
<p>
|
||
<LinkTo @route="vault.cluster.clients.config">
|
||
Go to configuration
|
||
</LinkTo>
|
||
</p>
|
||
{{/if}}
|
||
</EmptyState>
|
||
{{/if}}
|
||
{{else if this.errorObject}}
|
||
<Clients::Error @error={{this.errorObject}} />
|
||
{{else}}
|
||
{{#if (eq @model.config.enabled "Off")}}
|
||
<AlertBanner data-test-tracking-disabled @type="warning" @title="Tracking is disabled">
|
||
Tracking is currently disabled and data is not being collected. Historical data can be searched, but you will need to
|
||
<LinkTo @route="vault.cluster.clients.edit">
|
||
edit the configuration
|
||
</LinkTo>
|
||
to enable tracking again.
|
||
</AlertBanner>
|
||
{{/if}}
|
||
{{#if (or this.totalUsageCounts this.hasAttributionData)}}
|
||
<div class="is-subtitle-gray has-bottom-margin-m">
|
||
FILTERS
|
||
<Toolbar data-test-clients-filter-bar>
|
||
<ToolbarFilters>
|
||
<CalendarWidget
|
||
@arrayOfMonths={{this.arrayOfMonths}}
|
||
@endTimeDisplay={{this.endTimeDisplay}}
|
||
@endTimeFromResponse={{this.endTimeFromResponse}}
|
||
@handleClientActivityQuery={{this.handleClientActivityQuery}}
|
||
@handleCurrentBillingPeriod={{this.handleCurrentBillingPeriod}}
|
||
@startTimeDisplay={{this.startTimeDisplay}}
|
||
/>
|
||
{{#if this.namespaceArray}}
|
||
<SearchSelect
|
||
@id="namespace-search-select"
|
||
@options={{this.namespaceArray}}
|
||
@selectLimit="1"
|
||
@disallowNewItems={{true}}
|
||
@fallbackComponent="input-search"
|
||
@onChange={{this.selectNamespace}}
|
||
@placeholder={{"Filter by namespace"}}
|
||
@displayInherit={{true}}
|
||
class="is-marginless"
|
||
/>
|
||
{{/if}}
|
||
{{#if (not (is-empty this.authMethodOptions))}}
|
||
<SearchSelect
|
||
@id="auth-method-search-select"
|
||
@options={{this.authMethodOptions}}
|
||
@selectLimit="1"
|
||
@disallowNewItems={{true}}
|
||
@fallbackComponent="input-search"
|
||
@onChange={{this.setAuthMethod}}
|
||
@placeholder={{"Filter by auth method"}}
|
||
@displayInherit={{true}}
|
||
/>
|
||
{{/if}}
|
||
</ToolbarFilters>
|
||
</Toolbar>
|
||
</div>
|
||
|
||
{{#if (or this.upgradeDuringActivity this.responseRangeDiffMessage)}}
|
||
<AlertBanner @type="warning" @title="Warning">
|
||
<ul class={{if (and this.versionUpdateText this.responseRangeDiffMessage) "bullet"}}>
|
||
{{#if this.responseRangeDiffMessage}}
|
||
<li>{{this.responseRangeDiffMessage}}</li>
|
||
{{/if}}
|
||
{{#if this.upgradeDuringActivity}}
|
||
<li>
|
||
{{this.upgradeVersionAndDate}}
|
||
{{this.versionSpecificText}}
|
||
<DocLink
|
||
@path="/docs/concepts/client-count/faq#q-which-vault-version-reflects-the-most-accurate-client-counts"
|
||
>
|
||
Learn more here.
|
||
</DocLink>
|
||
</li>
|
||
{{/if}}
|
||
</ul>
|
||
</AlertBanner>
|
||
{{/if}}
|
||
{{#if this.isLoadingQuery}}
|
||
<LayoutLoading />
|
||
{{else}}
|
||
{{#if this.totalUsageCounts}}
|
||
{{#unless this.byMonthActivityData}}
|
||
<Clients::UsageStats @title="Total usage" @totalUsageCounts={{this.totalUsageCounts}} />
|
||
{{/unless}}
|
||
{{#if this.byMonthActivityData}}
|
||
<Clients::RunningTotal
|
||
@chartLegend={{this.chartLegend}}
|
||
@selectedAuthMethod={{this.selectedAuthMethod}}
|
||
@lineChartData={{this.byMonthActivityData}}
|
||
@barChartData={{this.byMonthNewClients}}
|
||
@runningTotals={{this.totalUsageCounts}}
|
||
@upgradeData={{this.upgradeDuringActivity}}
|
||
@timestamp={{this.responseTimestamp}}
|
||
/>
|
||
{{/if}}
|
||
{{#if this.hasAttributionData}}
|
||
<Clients::Attribution
|
||
@chartLegend={{this.chartLegend}}
|
||
@totalUsageCounts={{this.totalUsageCounts}}
|
||
@newUsageCounts={{this.newClientCounts}}
|
||
@totalClientAttribution={{this.totalClientAttribution}}
|
||
@newClientAttribution={{this.newClientAttribution}}
|
||
@selectedNamespace={{this.selectedNamespace}}
|
||
@startTimeDisplay={{this.startTimeDisplay}}
|
||
@endTimeDisplay={{this.endTimeDisplay}}
|
||
@isDateRange={{this.isDateRange}}
|
||
@timestamp={{this.responseTimestamp}}
|
||
/>
|
||
{{/if}}
|
||
{{#if this.hasMultipleMonthsData}}
|
||
<Clients::MonthlyUsage
|
||
@chartLegend={{this.chartLegend}}
|
||
@verticalBarChartData={{this.byMonthActivityData}}
|
||
@timestamp={{this.responseTimestamp}}
|
||
/>
|
||
{{/if}}
|
||
{{/if}}
|
||
{{/if}}
|
||
{{else if (and (not @model.startTimeFromLicense) (not this.startTimeFromResponse))}}
|
||
{{! Empty state for no billing/license start date }}
|
||
<EmptyState @title={{this.versionText.title}} @message={{this.versionText.message}} />
|
||
{{else}}
|
||
<EmptyState
|
||
@title={{concat "No data received " (if this.noActivityDate "from ") this.noActivityDate}}
|
||
@message="No data exists for that query period. Try searching again."
|
||
/>
|
||
{{/if}}
|
||
{{/if}}
|
||
|
||
{{! BILLING START DATE MODAL }}
|
||
<Modal
|
||
@title="Edit start month"
|
||
@onClose={{action (mut this.isEditStartMonthOpen) false}}
|
||
@isActive={{this.isEditStartMonthOpen}}
|
||
@showCloseButton={{true}}
|
||
>
|
||
<section class="modal-card-body">
|
||
<p class="has-bottom-margin-s">
|
||
{{this.versionText.description}}
|
||
</p>
|
||
<p class="has-bottom-margin-s"><strong>{{this.versionText.label}}</strong></p>
|
||
<div class="modal-radio-button">
|
||
<BasicDropdown @class="popup-menu" @horizontalPosition="auto-right" @verticalPosition="below" as |D|>
|
||
<D.Trigger
|
||
data-test-popup-menu-trigger="month"
|
||
class={{concat "toolbar-link" (if D.isOpen " is-active")}}
|
||
@htmlTag="button"
|
||
>
|
||
{{or this.startMonth "Month"}}
|
||
<Chevron @direction="down" @isButton={{true}} />
|
||
</D.Trigger>
|
||
<D.Content @defaultClass="popup-menu-content is-wide">
|
||
<nav class="box menu scroll">
|
||
<ul class="menu-list">
|
||
{{#each this.months as |month index|}}
|
||
<button
|
||
type="button"
|
||
class="button link"
|
||
disabled={{if (lt index this.allowedMonthMax) false true}}
|
||
{{on "click" (fn this.selectStartMonth month D.actions)}}
|
||
>
|
||
{{month}}
|
||
</button>
|
||
{{/each}}
|
||
</ul>
|
||
</nav>
|
||
</D.Content>
|
||
</BasicDropdown>
|
||
<BasicDropdown @class="popup-menu" @horizontalPosition="auto-right" @verticalPosition="below" as |D|>
|
||
<D.Trigger
|
||
data-test-popup-menu-trigger="year"
|
||
class={{concat "toolbar-link" (if D.isOpen " is-active")}}
|
||
@htmlTag="button"
|
||
>
|
||
{{or this.startYear "Year"}}
|
||
<Chevron @direction="down" @isButton={{true}} />
|
||
</D.Trigger>
|
||
<D.Content @defaultClass="popup-menu-content is-wide">
|
||
<nav class="box menu">
|
||
<ul class="menu-list">
|
||
{{#each this.years as |year|}}
|
||
<button
|
||
type="button"
|
||
class="button link"
|
||
disabled={{if (eq year this.disabledYear) true false}}
|
||
{{on "click" (fn this.selectStartYear year D.actions)}}
|
||
>
|
||
{{year}}
|
||
</button>
|
||
{{/each}}
|
||
</ul>
|
||
</nav>
|
||
</D.Content>
|
||
</BasicDropdown>
|
||
</div>
|
||
</section>
|
||
<footer class="modal-card-foot modal-card-foot-outlined">
|
||
<button
|
||
data-test-modal-save
|
||
type="button"
|
||
class="button is-primary"
|
||
disabled={{or (if (and this.startMonth this.startYear) false true)}}
|
||
{{on "click" (fn this.handleClientActivityQuery this.startMonth this.startYear "startTime")}}
|
||
>
|
||
Save
|
||
</button>
|
||
<button type="button" class="button is-secondary" {{on "click" (fn this.handleClientActivityQuery 0 0 "cancel")}}>
|
||
Cancel
|
||
</button>
|
||
</footer>
|
||
</Modal>
|
||
</div> |