<div class="box is-sideless is-fullwidth is-marginless is-bottomless">
  <p class="has-bottom-margin-s">
    The below data is for the current month starting from the first day. For historical data, see the history tab.
  </p>
  {{#if (eq @model.config.enabled "Off")}}
    <EmptyState
      @title="Tracking is disabled"
      @message="Tracking is disabled and data is not being collected. To turn it on edit the configuration."
    >
      {{#if @model.config.configPath.canUpdate}}
        <LinkTo @route="vault.cluster.clients.config">
          Go to configuration
        </LinkTo>
      {{/if}}
    </EmptyState>
  {{else if this.isGatheringData}}
    <EmptyState
      @title="No data received"
      @message="Tracking is turned on and Vault is gathering data. It should appear here within 30 minutes."
    />
  {{else if (eq @model.monthly.id "no-data")}}
    <EmptyState
      @title="No data available"
      @message="Tracking may be turned off. Check with your administrator or check back later."
    />
  {{else}}
    <div class="is-subtitle-gray has-bottom-margin-m">
      FILTERS
      <Toolbar>
        <ToolbarFilters data-test-clients-filter-bar>
          <SearchSelect
            @id="namespace-search-select-monthly"
            @options={{this.namespaceArray}}
            @selectLimit="1"
            @disallowNewItems={{true}}
            @fallbackComponent="input-search"
            @onChange={{this.selectNamespace}}
            @placeholder={{"Filter by namespace"}}
            @displayInherit={{true}}
            class="is-marginless"
          />
          {{#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 this.upgradeDuringCurrentMonth}}
      <AlertBanner @type="warning" @title="Warning">
        {{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>
      </AlertBanner>
    {{/if}}
    {{#if this.totalUsageCounts}}
      <Clients::UsageStats
        @title={{date-format this.responseTimestamp "MMMM"}}
        @totalUsageCounts={{this.totalUsageCounts}}
      />
      {{#if this.hasAttributionData}}
        <Clients::Attribution
          @chartLegend={{this.chartLegend}}
          @totalUsageCounts={{this.totalUsageCounts}}
          @newUsageCounts={{this.newUsageCounts}}
          @totalClientAttribution={{this.totalClientAttribution}}
          @selectedNamespace={{this.selectedNamespace}}
          @startTimeDisplay={{date-format this.responseTimestamp "MMMM yyyy"}}
          @isCurrentMonth={{true}}
          @isDateRange={{false}}
          @timestamp={{this.responseTimestamp}}
        />
      {{/if}}
    {{/if}}
  {{/if}}
</div>