{{page-title 'Engineering Docs - Consul' separator=' - '}}

{{document-attrs class="is-debug"}}
<App class="docs" id="wrapper">

  <:notifications as |app|>
    {{#each flashMessages.queue as |flash|}}
      {{#if flash.dom}}
        <app.Notification
          @delay={{sub flash.timeout flash.extendedTimeout}}
          @sticky={{flash.sticky}}
        >
          {{{flash.dom}}}
        </app.Notification>
      {{/if}}
    {{/each}}
  </:notifications>

  <:main-nav>

    <DocfyOutput as |node|>
      <ul>

{{!hardcode in docs first}}
          <li role="separator">Docs</li>
{{#each node.children as |child|}}
  {{#each child.pages as |child|}}
          <li
            class={{if (is-href (to-route child.url)) 'is-active'}}
          >
            <DocfyLink @to={{child.url}}>
              {{classify child.title}}
            </DocfyLink>
          </li>
  {{/each}}

{{!hardcode in styles next}}
  {{#let (find-by 'label' 'styles' child.children) as |section|}}
      <li role="separator">{{section.label}}</li>
{{#each (flatten-property section 'pages') as |child|}}
      <li
        class={{concat
          (slugify section.label) ' '
          (if (is-href (to-route child.url)) 'is-active')
        }}
      >
        <DocfyLink @to={{child.url}}>
          {{classify child.title}}
        </DocfyLink>
      </li>
{{/each}}
  {{/let}}

{{!print out the rest}}
  {{#each child.children as |section|}}
{{#if (not-eq section.label 'styles')}}
          <li role="separator">{{section.label}}</li>
    {{#each (flatten-property section 'pages') as |child|}}
          <li
            class={{concat
              (slugify section.label) ' '
              (if (eq child.frontmatter.class 'ember') 'ember-component') ' '
              (if (eq child.frontmatter.class 'css') 'css-component') ' '
              (if (is-href (to-route child.url)) 'is-active')
            }}
          >
            <DocfyLink @to={{child.url}}>
              {{classify child.title}}
            </DocfyLink>
          </li>
    {{/each}}
{{/if}}
  {{/each}}
{{/each}}

      </ul>
    </DocfyOutput>

  </:main-nav>
  <:main>
    <DocfyOutput @fromCurrentURL={{true}} as |page|>
      {{outlet}}
    </DocfyOutput>
  </:main>
</App>