Skip to content

Commit

Permalink
Initial work for sidenav
Browse files Browse the repository at this point in the history
  • Loading branch information
wenincode committed Nov 6, 2023
1 parent 395d32e commit dfb4f5d
Show file tree
Hide file tree
Showing 9 changed files with 342 additions and 326 deletions.
134 changes: 55 additions & 79 deletions ui/packages/consul-acls/app/components/consul/acl/selector/index.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -3,82 +3,58 @@
SPDX-License-Identifier: BUSL-1.1
}}

<li
class="acls-separator"
role="separator"
>
Access Controls
{{#if (not (can "use acls"))}}
<span
{{tooltip "ACLs are not currently enabled in this cluster"}}
></span>
{{/if}}
</li>
<li
data-test-main-nav-tokens
class={{if (is-href 'dc.acls.tokens' @dc.Name) 'is-active'}}
>
<a
href={{href-to 'dc.acls.tokens' @dc.Name}}
>
Tokens
</a>
</li>
{{#if (can "read acls")}}
<li
data-test-main-nav-policies
class={{if (is-href 'dc.acls.policies' @dc.Name) 'is-active'}}
>
<a
href={{href-to 'dc.acls.policies' @dc.Name}}
>
Policies
</a>
</li>
<li
data-test-main-nav-roles
class={{if (is-href 'dc.acls.roles' @dc.Name) 'is-active'}}
>
<a
href={{href-to 'dc.acls.roles' @dc.Name}}
>
Roles
</a>
</li>
<li
data-test-main-nav-auth-methods
class={{if (is-href 'dc.acls.auth-methods' @dc.Name) 'is-active'}}
>
<a
href={{href-to 'dc.acls.auth-methods' @dc.Name}}
>
Auth Methods
</a>
</li>
{{else if (not (can "use acls"))}}
<li
data-test-main-nav-policies
class={{if (is-href 'dc.acls.policies' @dc.Name) 'is-active'}}
>
<span>
Policies
</span>
</li>
<li
data-test-main-nav-roles
class={{if (is-href 'dc.acls.roles' @dc.Name) 'is-active'}}
>
<span>
Roles
</span>
</li>
<li
data-test-main-nav-auth-methods
class={{if (is-href 'dc.acls.auth-methods' @dc.Name) 'is-active'}}
>
<span>
Auth Methods
</span>
</li>
{{/if}}

{{#let @list as |SNL|}}
{{#if (can "use acls")}}
<SNL.Title>Access Controls</SNL.Title>
<SNL.Link
@text="Tokens"
@route="dc.acls.tokens"
@models={{array @dc.Name}}
@isActive={{is-href "dc.acls.tokens" @dc.Name}}
data-test-main-nav-tokens
/>
<SNL.Link
@text="Policies"
@route="dc.acls.policies"
@models={{array @dc.Name}}
@isActive={{is-href "dc.acls.policies" @dc.Name}}
data-test-main-nav-policies
/>
<SNL.Link
@text="Roles"
@route="dc.acls.roles"
@models={{array @dc.Name}}
@isActive={{is-href "dc.acls.roles" @dc.Name}}
data-test-main-nav-roles
/>
<SNL.Link
@text="Auth Methods"
@route="dc.acls.auth-methods"
@models={{array @dc.Name}}
@isActive={{is-href "dc.acls.auth-methods" @dc.Name}}
data-test-main-nav-auth-methods
/>
{{else}}
<SNL.Title {{tooltip "ACLs are not currently enabled in this cluster"}}>
Access Controls
</SNL.Title>
<SNL.Link
@text="Tokens"
@route="dc.acls.tokens"
@models={{array @dc.Name}}
@query={{hash peer=undefined}}
@isActive={{is-href "dc.acls.tokens" @dc.Name}}
data-test-main-nav-tokens
/>
<SNL.Item
class="consul-disabled-nav"
data-test-main-nav-policies
>Policies</SNL.Item>
<SNL.Item
class="consul-disabled-nav"
data-test-main-nav-roles
>Roles</SNL.Item>
<SNL.Item class="consul-disabled-nav" data-test-main-nav-auth-methods>Auth
Methods</SNL.Item>
{{/if}}
{{/let}}
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,14 @@
SPDX-License-Identifier: BUSL-1.1
}}

<li
class="peers-separator"
role="separator"
...attributes
>
Organization
</li>
<li
data-test-main-nav-peers
class={{if (is-href 'dc.peers' @dc.Name) 'is-active'}}
>
<a
href={{href-to 'dc.peers' @dc.Name
params=(hash peer=undefined)
}}
>
Peers
</a>
</li>

{{#let @list as |SNL|}}
<SNL.Title ...attributes>Organization</SNL.Title>
<SNL.Link
@text="Peers"
@route="dc.peers"
@models={{array @dc.Name}}
@query={{hash peer=undefined}}
@isActive={{is-href "dc.peers" @dc.Name}}
data-test-main-nav-peers
/>
{{/let}}
63 changes: 26 additions & 37 deletions ui/packages/consul-ui/app/components/app/index.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -37,25 +37,18 @@

<ModalLayer />

<input
type="checkbox"
id={{concat guid "-main-nav-toggle"}}
/>
<header
role="banner"
>
<label
tabindex="0"
for={{concat guid "-main-nav-toggle"}}
aria-label={{t 'components.app.toggle_menu'}}
{{on "keypress" this.keypressClick}}
{{on "mouseup" this.unfocus}}
></label>
{{yield exported to="home-nav"}}
<div
data-test-navigation
>
{{!--
{{!-- <input type='checkbox' id={{concat guid '-main-nav-toggle'}} /> --}}
{{!-- <header role='banner'>
<label
tabindex='0'
for={{concat guid '-main-nav-toggle'}}
aria-label={{t 'components.app.toggle_menu'}}
{{on 'keypress' this.keypressClick}}
{{on 'mouseup' this.unfocus}}
></label>
{{yield exported to='home-nav'}}
<div data-test-navigation>
{{!
The viewport tolerances here give us a 10 pixel buffer to make sure the menu
is marked as out of the viewport, we use all sides so we don't need to change
this should any CSS change
Expand All @@ -82,23 +75,19 @@
</nav>
</div>
</header>
<main id={{concat guid '-main'}}>
<div class="notifications">
{{yield exported to="notifications"}}
<PortalTarget
@name="app-notifications"
@multiple={{true}}
></PortalTarget>
</div>
{{yield exported to="main"}}
</main>
<footer
role="contentinfo"
data-test-footer
>
{{yield exported to="content-info"}}
</footer>
</div>
</header> --}}

{{yield exported to='side-nav'}}
<main id={{concat guid '-main'}}>
<div class='notifications'>
{{yield exported to='notifications'}}
<PortalTarget @name='app-notifications' @multiple={{true}} />
</div>
{{yield exported to='main'}}
</main>
{{!-- <footer role='contentinfo' data-test-footer>
{{yield exported to='content-info'}}
</footer> --}}
</div>

{{/let}}
Loading

0 comments on commit dfb4f5d

Please sign in to comment.