github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/ui/app/templates/components/gutter-menu.hbs (about)

     1  <div data-test-gutter-menu class="page-column is-left {{if this.isOpen "is-open"}}">
     2    <div class="gutter {{if this.isOpen "is-open"}}">
     3      <header class="collapsed-menu {{if this.isOpen "is-open"}}">
     4        <span data-test-gutter-gutter-toggle class="gutter-toggle" aria-label="menu" onclick={{action this.onHamburgerClick}}>
     5          <HamburgerMenu />
     6        </span>
     7        <span class="logo-container">
     8          <NomadLogo />
     9        </span>
    10      </header>
    11      <aside class="menu">
    12        {{#if this.system.shouldShowRegions}}
    13          <div class="collapsed-only">
    14            <p class="menu-label">
    15              Region {{if this.system.shouldShowNamespaces "& Namespace"}}
    16            </p>
    17            <ul class="menu-list">
    18              <li>
    19                <div class="menu-item is-wide">
    20                  <RegionSwitcher />
    21                </div>
    22              </li>
    23            </ul>
    24          </div>
    25        {{/if}}
    26        {{#if this.system.shouldShowNamespaces}}
    27          <ul class="menu-list">
    28            <li>
    29              <div class="menu-item is-wide">
    30                <PowerSelect
    31                  data-test-namespace-switcher
    32                  @options={{this.sortedNamespaces}}
    33                  @selected={{this.system.activeNamespace}}
    34                  @searchField="name"
    35                  @searchEnabled={{gt this.sortedNamespaces.length 10}}
    36                  @onChange={{action this.gotoJobsForNamespace}}
    37                  @tagName="div"
    38                  @class="namespace-switcher"
    39                  title={{this.system.activeNamespace.name}}
    40                  as |namespace|>
    41                  <span class="ember-power-select-prefix">Namespace: </span>{{namespace.name}}
    42                </PowerSelect>
    43              </div>
    44            </li>
    45          </ul>
    46        {{/if}}
    47        <p class="menu-label">
    48          Workload
    49        </p>
    50        <ul class="menu-list">
    51          <li>
    52            <LinkTo
    53              @route="jobs"
    54              @query={{hash jobNamespace=this.system.activeNamespace.id}}
    55              @activeClass="is-active"
    56              data-test-gutter-link="jobs">
    57              Jobs
    58            </LinkTo>
    59          </li>
    60          {{#if (can "accept recommendation")}}
    61            <li>
    62              <LinkTo
    63                @route="optimize"
    64                @activeClass="is-active"
    65                data-test-gutter-link="optimize">
    66                Optimize
    67              </LinkTo>
    68            </li>
    69          {{/if}}
    70        </ul>
    71        <p class="menu-label is-minor">
    72          Integrations
    73        </p>
    74        <ul class="menu-list">
    75          <li>
    76            <LinkTo
    77              @route="csi"
    78              @query={{hash volumeNamespace=this.system.activeNamespace.id}}
    79              @activeClass="is-active"
    80              data-test-gutter-link="storage">
    81              Storage <span class="tag is-small">Beta</span>
    82            </LinkTo>
    83          </li>
    84        </ul>
    85        <p class="menu-label">
    86          Cluster
    87        </p>
    88        <ul class="menu-list">
    89          <li><LinkTo @route="clients" @activeClass="is-active" data-test-gutter-link="clients">Clients</LinkTo></li>
    90          <li><LinkTo @route="servers" @activeClass="is-active" data-test-gutter-link="servers">Servers</LinkTo></li>
    91          <li><LinkTo @route="topology" @activeClass="is-active" data-test-gutter-link="topology">Topology</LinkTo></li>
    92        </ul>
    93      </aside>
    94      <footer class="gutter-footer">
    95        <span class="is-faded">v{{this.system.agent.version}}</span>
    96      </footer>
    97    </div>
    98  </div>
    99  <div data-test-page-content class="page-column is-right">
   100    {{yield}}
   101  </div>
   102  <div data-test-gutter-backdrop class="gutter-backdrop {{if this.isOpen "is-open"}}" onclick={{action this.onHamburgerClick}}></div>