open-consul/ui-v2/app/components/hashicorp-consul/index.hbs
John Cowen 4c3fbebefd ui: Move to new ember nested file structure for components (#7403)
* ui: Move components to the new nested structure

* Move data-test attribute to the correct HTML element

We don't currently rely on this, but was incorrectly placed on the input
rather than the label tag

* Fix up left over curly bracket components that were causing issues

For some reason the combination of:

1. Old style curly bracket components
2. data-test-* attributes
3. Moving to the new component file structure

Meant that our data-test-* selectors where no longer being rendered.
Whilst this had no effect on the app, it meant our tests suite could no
longer select DOM elements in order to assert various things.

Moving the old style curly bracket components to the new style XML/Angle
bracket format fixes the issue

* Update ui-v2/app/templates/dc/nodes/-services.hbs

Co-Authored-By: Greg Hoin <1416421+gregone@users.noreply.github.com>

* Update ui-v2/app/templates/dc/nodes/-services.hbs

Co-Authored-By: Greg Hoin <1416421+gregone@users.noreply.github.com>

Co-authored-by: Greg Hoin <1416421+gregone@users.noreply.github.com>
2020-05-12 17:14:15 +00:00

127 lines
7.4 KiB
Handlebars

<header role="banner" data-test-navigation>
<a data-test-main-nav-logo href={{href-to 'index'}}><svg width="28" height="27" xmlns="http://www.w3.org/2000/svg"><title>Consul</title><path d="M13.284 16.178a2.876 2.876 0 1 1-.008-5.751 2.876 2.876 0 0 1 .008 5.75zm5.596-1.547a1.333 1.333 0 1 1 0-2.667 1.333 1.333 0 0 1 0 2.667zm4.853 1.249a1.271 1.271 0 1 1 .027-.107c0 .031 0 .067-.027.107zm-.937-3.436a1.333 1.333 0 1 1 .986-1.595c.033.172.033.348 0 .52-.07.53-.465.96-.986 1.075zm4.72 3.29a1.333 1.333 0 1 1-1.076-1.538 1.333 1.333 0 0 1 1.116 1.417.342.342 0 0 0-.027.12h-.013zm-1.08-3.33a1.333 1.333 0 1 1 1.088-1.524c.014.114.014.229 0 .342a1.333 1.333 0 0 1-1.102 1.182h.014zm-.925 7.925a1.333 1.333 0 1 1 .165-.547c-.01.193-.067.38-.165.547zm-.48-12.191a1.333 1.333 0 1 1 .507-1.814c.14.237.198.514.164.787-.038.438-.289.828-.67 1.045v-.018zM13.333 26.667C5.97 26.667 0 20.697 0 13.333 0 5.97 5.97 0 13.333 0c2.929-.01 5.778.955 8.098 2.742L19.8 4.89a10.667 10.667 0 0 0-17.133 8.444 10.667 10.667 0 0 0 17.137 8.471l1.627 2.13a13.218 13.218 0 0 1-8.098 2.733z" fill="#FFF"/></svg></a>
<input type="checkbox" name="menu" id="main-nav-toggle" onchange={{action 'change'}} />
<label for="main-nav-toggle">
Toggle Menu
</label>
<div>
<label for="main-nav-toggle">
<span>Close</span>
</label>
<nav aria-label="Main">
{{#if dc}}
<ul>
{{#if (and (env 'CONSUL_NSPACES_ENABLED') (gt nspaces.length 0))}}
<li data-test-nspace-menu>
{{#if (and (eq nspaces.length 1) (not canManageNspaces)) }}
<span data-test-nspace-selected={{nspace.Name}}>{{nspace.Name}}</span>
{{ else }}
<PopoverMenu @position="left">
<BlockSlot @name="trigger">
{{nspace.Name}}
</BlockSlot>
{{#if (is-href 'dc.nspaces')}}
<BlockSlot @name="header">
<p>
Namespaces themselves are not namespaced, so switching will not change the current view.
</p>
</BlockSlot>
{{/if}}
<BlockSlot @name="menu">
<li role="separator">
Namespaces
</li>
{{#each (reject-by 'DeletedAt' nspaces) as |item|}}
<li role="none" class={{if (eq nspace.Name item.Name) 'is-active'}}>
<a tabindex="-1" role="menuitem" href={{href-mut (hash nspace=(concat '~' item.Name))}}>{{item.Name}}</a>
</li>
{{/each}}
{{#if canManageNspaces }}
<li role="separator"></li>
<li role="none" data-test-main-nav-nspaces>
<a tabindex="-1" role="menuitem" href={{href-to 'dc.nspaces' dc.Name}}>Manage namespaces</a>
</li>
{{/if}}
</BlockSlot>
</PopoverMenu>
{{/if}}
</li>
{{/if}}
<li data-test-datacenter-menu>
{{#if (or (not dcs) (eq dcs.length 1)) }}
<span data-test-datacenter-selected={{dc.Name}}>{{dc.Name}}</span>
{{ else }}
<PopoverMenu @position="left">
<BlockSlot @name="trigger">
{{dc.Name}}
</BlockSlot>
<BlockSlot @name="menu">
<li role="separator">
Datacenters
</li>
{{#each dcs as |item|}}
<li role="none" data-test-datacenter-picker class={{if (eq dc.Name item.Name) 'is-active'}}>
<a tabindex="-1" role="menuitem" href={{href-mut (hash dc=item.Name)}}>{{item.Name}}</a>
</li>
{{/each}}
</BlockSlot>
</PopoverMenu>
{{/if}}
</li>
<li data-test-main-nav-services class={{if (is-href 'dc.services' dc.Name) 'is-active'}}>
<a href={{href-to 'dc.services' dc.Name}}>Services</a>
</li>
<li data-test-main-nav-nodes class={{if (is-href 'dc.nodes' dc.Name) 'is-active'}}>
<a href={{href-to 'dc.nodes' dc.Name}}>Nodes</a>
</li>
<li data-test-main-nav-kvs class={{if (is-href 'dc.kv' dc.Name) 'is-active'}}>
<a href={{href-to 'dc.kv' dc.Name}}>Key/Value</a>
</li>
<li data-test-main-nav-acls class={{if (or (is-href 'dc.acls' dc.Name) (is-href 'dc.aclsdisabled') (is-href 'dc.unauthorized')) 'is-active'}}>
<a href={{href-to 'dc.acls.tokens' dc.Name}}>ACL</a>
</li>
<li data-test-main-nav-intentions class={{if (is-href 'dc.intentions' dc.Name) 'is-active'}}>
<a href={{href-to 'dc.intentions' dc.Name}}>Intentions</a>
</li>
</ul>
{{/if}}
</nav>
<nav>
<ul>
<li data-test-main-nav-docs>
<PopoverMenu @position="right">
<BlockSlot @name="trigger">
Help
</BlockSlot>
<BlockSlot @name="menu">
<li role="none" class="docs-link">
<a tabindex="-1" role="menuitem" href={{env 'CONSUL_DOCS_URL'}} rel="noopener noreferrer" target="_blank">Documentation</a>
</li>
<li role="none" class="learn-link">
<a tabindex="-1" role="menuitem" href={{env 'CONSUL_DOCS_LEARN_URL'}} rel="noopener noreferrer" target="_blank">HashiCorp Learn</a>
</li>
<li role="separator"></li>
<li role="none" class="feedback-link">
<a tabindex="-1" role="menuitem" href={{env 'CONSUL_REPO_ISSUES_URL'}} target="_blank" rel="noopener noreferrer">Provide Feedback</a>
</li>
</BlockSlot>
</PopoverMenu>
</li>
<li data-test-main-nav-settings class={{if (is-href 'settings') 'is-active'}}>
<a href={{href-to 'settings'}}>Settings</a>
</li>
</ul>
</nav>
</div>
</header>
<main>
{{yield}}
</main>
<footer role="contentinfo" data-test-footer>
<a data-test-footer-copyright href="{{env 'CONSUL_COPYRIGHT_URL'}}/" rel="noopener noreferrer" target="_blank">&copy; {{env 'CONSUL_COPYRIGHT_YEAR'}} HashiCorp</a>
<p data-test-footer-version>Consul {{env 'CONSUL_VERSION'}}</p>
<a data-test-footer-docs href="{{env 'CONSUL_DOCS_URL'}}" rel="help noopener noreferrer" target="_blank">Documentation</a>
{{{concat '<!-- ' (env 'CONSUL_GIT_SHA') '-->'}}}
</footer>
<ModalLayer />