luxolus
/
open-nomad
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity
open-nomad/ui/app/templates/clients/index.hbs

100 lines
3.8 KiB
Handlebars
Raw Normal View History

UI: Add page titles (#5924) This uses ember-page-title to add dynamic page titles throughout the route hierarchy. When there’s more than one region, the current current region is added before the final entry of “- Nomad”.
2019-07-17 20:02:58 +00:00
{{title "Clients"}}
Use page-layout for clients routes
2018-07-25 22:02:49 +00:00
<section class="section">
{{#if isForbidden}}
{{partial "partials/forbidden-message"}}
{{else}}
Replaces .columns with .toolbar on the clients page
2019-03-07 05:05:59 +00:00
<div class="toolbar">
Change clients/jobs facets to always right-align This changes the templates so the element that contains the search box is always present, instead hiding only the box itself when there’s nothing to search. Keeping the empty element lets it take up its flexbox space so the facets will no longer be in the centre.
2019-05-15 18:25:30 +00:00
<div class="toolbar-item">
{{#if nodes.length}}
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
<SearchBox
@searchTerm={{mut searchTerm}}
@onChange={{action resetPagination}}
@placeholder="Search clients..." />
Change clients/jobs facets to always right-align This changes the templates so the element that contains the search box is always present, instead hiding only the box itself when there’s nothing to search. Keeping the empty element lets it take up its flexbox space so the facets will no longer be in the centre.
2019-05-15 18:25:30 +00:00
{{/if}}
</div>
Replaces .columns with .toolbar on the clients page
2019-03-07 05:05:59 +00:00
<div class="toolbar-item is-right-aligned is-mobile-full-width">
<div class="button-bar">
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
<MultiSelectDropdown
Test coverage for clients faceted search
2019-02-12 19:26:36 +00:00
data-test-class-facet
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
@label="Class"
@options={{optionsClass}}
@selection={{selectionClass}}
@onSelect={{action setFacetQueryParam "qpClass"}} />
<MultiSelectDropdown
Update client list to combine statuses (#5789) The draining, eligibility, and status fields now all show under a combined state column. Draining takes precedence, then (in)eligibility; if neither of those is true, the status displays.
2019-06-19 17:11:17 +00:00
data-test-state-facet
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
@label="State"
@options={{optionsState}}
@selection={{selectionState}}
@onSelect={{action setFacetQueryParam "qpState"}} />
<MultiSelectDropdown
Test coverage for clients faceted search
2019-02-12 19:26:36 +00:00
data-test-datacenter-facet
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
@label="Datacenter"
@options={{optionsDatacenter}}
@selection={{selectionDatacenter}}
@onSelect={{action setFacetQueryParam "qpDatacenter"}} />
<MultiSelectDropdown
Add a volume facet to the clients list page
2020-03-13 07:18:05 +00:00
data-test-volume-facet
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
@label="Volume"
@options={{optionsVolume}}
@selection={{selectionVolume}}
@onSelect={{action setFacetQueryParam "qpVolume"}} />
Implement faceted search on the clients page
2019-02-12 04:01:46 +00:00
</div>
Use page-layout for clients routes
2018-07-25 22:02:49 +00:00
</div>
Implement faceted search on the clients page
2019-02-12 04:01:46 +00:00
</div>
Remove inverse block for list-pagination (#6523) As the angle bracket invocation RFC says: > There is no dedicated syntax for passing an "else" block > directly. If needed, that can be passed using the named > blocks syntax. https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md#block Unfortunately, using a contextual component doesn’t help as the yield inside that component will still result in content rendering that would show when the source isn’t empty. So we decided to change the interface so you have to check whether the source is empty before using it, which aligns with how list-table works.
2019-10-24 12:05:43 +00:00
{{#if sortedNodes}}
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
<ListPagination
@source={{sortedNodes}}
@size={{pageSize}}
@page={{currentPage}} as |p|>
<ListTable
@source={{p.list}}
@sortProperty={{sortProperty}}
@sortDescending={{sortDescending}}
@class="with-foot" as |t|>
<t.head>
Remove inverse block for list-pagination (#6523) As the angle bracket invocation RFC says: > There is no dedicated syntax for passing an "else" block > directly. If needed, that can be passed using the named > blocks syntax. https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md#block Unfortunately, using a contextual component doesn’t help as the yield inside that component will still result in content rendering that would show when the source isn’t empty. So we decided to change the interface so you have to check whether the source is empty before using it, which aligns with how list-table works.
2019-10-24 12:05:43 +00:00
<th class="is-narrow"></th>
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
<t.sort-by @prop="id">ID</t.sort-by>
<t.sort-by @class="is-200px is-truncatable" @prop="name">Name</t.sort-by>
<t.sort-by @prop="compositeStatus">State</t.sort-by>
Remove inverse block for list-pagination (#6523) As the angle bracket invocation RFC says: > There is no dedicated syntax for passing an "else" block > directly. If needed, that can be passed using the named > blocks syntax. https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md#block Unfortunately, using a contextual component doesn’t help as the yield inside that component will still result in content rendering that would show when the source isn’t empty. So we decided to change the interface so you have to check whether the source is empty before using it, which aligns with how list-table works.
2019-10-24 12:05:43 +00:00
<th>Address</th>
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
<t.sort-by @prop="datacenter">Datacenter</t.sort-by>
Add volume to the client row
2020-02-12 03:52:04 +00:00
<th># Volumes</th>
Remove inverse block for list-pagination (#6523) As the angle bracket invocation RFC says: > There is no dedicated syntax for passing an "else" block > directly. If needed, that can be passed using the named > blocks syntax. https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md#block Unfortunately, using a contextual component doesn’t help as the yield inside that component will still result in content rendering that would show when the source isn’t empty. So we decided to change the interface so you have to check whether the source is empty before using it, which aligns with how list-table works.
2019-10-24 12:05:43 +00:00
<th># Allocs</th>
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
</t.head>
<t.body as |row|>
<ClientNodeRow data-test-client-node-row @node={{row.model}} @onClick={{action "gotoNode" row.model}} />
</t.body>
</ListTable>
Remove inverse block for list-pagination (#6523) As the angle bracket invocation RFC says: > There is no dedicated syntax for passing an "else" block > directly. If needed, that can be passed using the named > blocks syntax. https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md#block Unfortunately, using a contextual component doesn’t help as the yield inside that component will still result in content rendering that would show when the source isn’t empty. So we decided to change the interface so you have to check whether the source is empty before using it, which aligns with how list-table works.
2019-10-24 12:05:43 +00:00
<div class="table-foot">
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
<PageSizeSelect @onChange={{action resetPagination}} />
Remove inverse block for list-pagination (#6523) As the angle bracket invocation RFC says: > There is no dedicated syntax for passing an "else" block > directly. If needed, that can be passed using the named > blocks syntax. https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md#block Unfortunately, using a contextual component doesn’t help as the yield inside that component will still result in content rendering that would show when the source isn’t empty. So we decided to change the interface so you have to check whether the source is empty before using it, which aligns with how list-table works.
2019-10-24 12:05:43 +00:00
<nav class="pagination" data-test-pagination>
<div class="pagination-numbers">
{{p.startsAt}}&ndash;{{p.endsAt}} of {{sortedNodes.length}}
</div>
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
<p.prev @class="pagination-previous">{{x-icon "chevron-left"}}</p.prev>
<p.next @class="pagination-next">{{x-icon "chevron-right"}}</p.next>
Remove inverse block for list-pagination (#6523) As the angle bracket invocation RFC says: > There is no dedicated syntax for passing an "else" block > directly. If needed, that can be passed using the named > blocks syntax. https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md#block Unfortunately, using a contextual component doesn’t help as the yield inside that component will still result in content rendering that would show when the source isn’t empty. So we decided to change the interface so you have to check whether the source is empty before using it, which aligns with how list-table works.
2019-10-24 12:05:43 +00:00
<ul class="pagination-list"></ul>
</nav>
</div>
Convert to angle bracket invocation (#8075) This is mostly a direct application of the ember-angle-brackets-codemod. I manually restored newlines in multi-line component invocations, usually preserving file line length except for now-non-positional link-to @route. I needed to rename task to taskState in some cases to avoid Ember Concurrency naming conflicts.
2020-06-01 19:03:56 +00:00
</ListPagination>
Empty states for clients
2017-09-30 01:33:57 +00:00
{{else}}
Use page-layout for clients routes
2018-07-25 22:02:49 +00:00
<div class="empty-message" data-test-empty-clients-list>
{{#if (eq nodes.length 0)}}
<h3 class="empty-message-headline" data-test-empty-clients-list-headline>No Clients</h3>
<p class="empty-message-body">
The cluster currently has no client nodes.
</p>
Test coverage for clients faceted search
2019-02-12 19:26:36 +00:00
{{else if (eq filteredNodes.length 0)}}
<h3 data-test-empty-clients-list-headline class="empty-message-headline">No Matches</h3>
<p class="empty-message-body">
No clients match your current filter selection.
</p>
Use page-layout for clients routes
2018-07-25 22:02:49 +00:00
{{else if searchTerm}}
<h3 class="empty-message-headline" data-test-empty-clients-list-headline>No Matches</h3>
<p class="empty-message-body">No clients match the term <strong>{{searchTerm}}</strong></p>
{{/if}}
</div>
Remove inverse block for list-pagination (#6523) As the angle bracket invocation RFC says: > There is no dedicated syntax for passing an "else" block > directly. If needed, that can be passed using the named > blocks syntax. https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md#block Unfortunately, using a contextual component doesn’t help as the yield inside that component will still result in content rendering that would show when the source isn’t empty. So we decided to change the interface so you have to check whether the source is empty before using it, which aligns with how list-table works.
2019-10-24 12:05:43 +00:00
{{/if}}
Use page-layout for clients routes
2018-07-25 22:02:49 +00:00
{{/if}}
</section>