refactor: 💡 Migrate hostslist within host-set to Hds::Table (#2049)
* refactor: 💡 Migrate `hosts`list within host-set to `Hds::Table` Migrate `hosts` list within host-set to `Hds::Table` from `Rose::Table` ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * Update index.hbs Not using `data-test` attribute for testing * Update index.hbs removed unused `data-test` selector * refactor: 💡 quick lint error fix Fix lint error in `hosts/index.hbs` ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * refactor: 💡 refactor test to use `data-test` selector Refactored hosts-test to use `data-test` selectors for grabbing `Hds::Dropdown` toggle and interactive instead of long nested selector. ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * Update index.hbs spelling fix * Update hosts-test.js fixed spelling errors * refactor: 💡 fix lint errors Fix lint errors ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * refactor: 💡 Use `Hds::Code::Snippet` Migrate from `Copyable` component to use `Hds::Code::Snippet` ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * refactor: 💡 refactor incorrect use of `Hds::Code::Snippet` Refactor the incorrect usage of `Hds::Code::Snippet` ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * refactor: 💡 refactor header of `Hds::Table` Refactor conditional header of `Hds::Table` ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * refactor: 💡 Refactored conditional header translations Refactored conditional header translations to live in controller file for `scopes/scope/host-catalogs/host-catalog/host-sets/host-set/hosts` ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * refactor: 💡 Move conditional check for header labels into `js` Move conditional logic for checking header lables into `controller` file ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * refactor: 💡 Quick refactor for columns getter Quick refactor to clean up getter that conditionally renders column header label based on `isStatic` boolean ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * refactor: 💡 Refactor `host-sets/host-set/hosts` tablee Refactor `host-sets/host-set/hosts` table to adhere more to codebase ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728 * refactor: 💡 rearrange attributes order for table Rearrange attributes order for `Hds::Table` to keep inline with codebase patterns. ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11728
This commit is contained in:
1 parent
0beec7b8fe
commit
9241b7dd0e
2 files changed
+98
-75
No files matched your search
+89
-70
@@ -28,82 +28,101 @@
|
||||
|
||||
<page.body>
|
||||
{{#if @model.hosts}}
|
||||
<Rose::Table as |table|>
|
||||
<table.header as |header|>
|
||||
<header.row as |row|>
|
||||
{{#if @model.hostSet.isStatic}}
|
||||
<row.headerCell>{{t 'form.name.label'}}</row.headerCell>
|
||||
{{else}}
|
||||
<row.headerCell>{{t 'form.external_name.label'}}</row.headerCell>
|
||||
{{/if}}
|
||||
<row.headerCell>{{t 'form.type.label'}}</row.headerCell>
|
||||
<row.headerCell>{{t 'form.id.label'}}</row.headerCell>
|
||||
{{#if @model.hostSet.isStatic}}
|
||||
<row.headerCell>{{t 'titles.actions'}}</row.headerCell>
|
||||
{{/if}}
|
||||
</header.row>
|
||||
</table.header>
|
||||
|
||||
<table.body as |body|>
|
||||
{{#each @model.hosts as |host|}}
|
||||
<body.row as |row|>
|
||||
<row.headerCell>
|
||||
{{#if host.isStatic}}
|
||||
<LinkTo
|
||||
@route='scopes.scope.host-catalogs.host-catalog.hosts.host'
|
||||
@model={{host.id}}
|
||||
>
|
||||
{{host.displayName}}
|
||||
</LinkTo>
|
||||
{{else}}
|
||||
{{! Link to a different subroute for dynamic/plugin hosts }}
|
||||
<LinkTo
|
||||
@route='scopes.scope.host-catalogs.host-catalog.host-sets.host-set.hosts.host'
|
||||
@model={{host.id}}
|
||||
>
|
||||
{{host.displayName}}
|
||||
</LinkTo>
|
||||
{{/if}}
|
||||
<p>{{host.description}}</p>
|
||||
</row.headerCell>
|
||||
<row.cell>
|
||||
<HostCatalogTypeBadge @model={{host}} />
|
||||
</row.cell>
|
||||
<row.cell>
|
||||
<Copyable
|
||||
@text={{host.id}}
|
||||
@buttonText={{t 'actions.copy-to-clipboard'}}
|
||||
@acknowledgeText={{t 'states.copied'}}
|
||||
{{#if (get @model.hostSet 'isStatic')}}
|
||||
<Hds::Table
|
||||
@model={{@model.hosts}}
|
||||
@columns={{array
|
||||
(hash label=(t 'form.name.label'))
|
||||
(hash label=(t 'form.type.label'))
|
||||
(hash label=(t 'form.id.label'))
|
||||
(hash label=(t 'titles.actions'))
|
||||
}}
|
||||
@valign='middle'
|
||||
>
|
||||
<:body as |B|>
|
||||
<B.Tr>
|
||||
<B.Td>
|
||||
<LinkTo
|
||||
@route='scopes.scope.host-catalogs.host-catalog.hosts.host'
|
||||
@model={{B.data.id}}
|
||||
>
|
||||
<code>{{host.id}}</code>
|
||||
</Copyable>
|
||||
</row.cell>
|
||||
<row.cell>
|
||||
{{B.data.displayName}}
|
||||
</LinkTo>
|
||||
<Hds::Text::Body @tag='p'>
|
||||
{{B.data.description}}
|
||||
</Hds::Text::Body>
|
||||
</B.Td>
|
||||
<B.Td>
|
||||
<HostCatalogTypeBadge @model={{B.data}} />
|
||||
</B.Td>
|
||||
<B.Td>
|
||||
<Hds::Copy::Snippet
|
||||
@textToCopy={{B.data.id}}
|
||||
@color='secondary'
|
||||
/>
|
||||
</B.Td>
|
||||
|
||||
<B.Td>
|
||||
{{#if (can 'removeHosts hostSet' @model.hostSet)}}
|
||||
<Rose::Dropdown
|
||||
@icon='flight-icons/svg/more-horizontal-16'
|
||||
@iconOnly={{true}}
|
||||
@showCaret={{false}}
|
||||
@dropdownRight={{true}}
|
||||
@text={{t 'actions.manage'}}
|
||||
as |dropdown|
|
||||
>
|
||||
<dropdown.button
|
||||
@style='danger'
|
||||
<Hds::Dropdown as |dd|>
|
||||
<dd.ToggleIcon
|
||||
data-test-host-set-hosts-dropdown-toggle
|
||||
@text={{t 'actions.manage'}}
|
||||
@icon='more-horizontal'
|
||||
@hasChevron={{false}}
|
||||
/>
|
||||
<dd.Interactive
|
||||
data-test-host-set-hosts-dropdown-remove-host
|
||||
@text={{t 'actions.remove'}}
|
||||
@color='critical'
|
||||
{{on
|
||||
'click'
|
||||
(route-action 'removeHost' @model.hostSet host)
|
||||
(route-action 'removeHost' @model.hostSet B.data)
|
||||
}}
|
||||
>
|
||||
{{t 'actions.remove'}}
|
||||
</dropdown.button>
|
||||
</Rose::Dropdown>
|
||||
/>
|
||||
</Hds::Dropdown>
|
||||
{{/if}}
|
||||
</row.cell>
|
||||
</body.row>
|
||||
{{/each}}
|
||||
</table.body>
|
||||
</Rose::Table>
|
||||
</B.Td>
|
||||
|
||||
</B.Tr>
|
||||
</:body>
|
||||
</Hds::Table>
|
||||
{{else}}
|
||||
<Hds::Table
|
||||
@model={{@model.hosts}}
|
||||
@columns={{array
|
||||
(hash label=(t 'form.external_name.label'))
|
||||
(hash label=(t 'form.type.label'))
|
||||
(hash label=(t 'form.id.label'))
|
||||
}}
|
||||
@valign='middle'
|
||||
>
|
||||
<:body as |B|>
|
||||
<B.Tr>
|
||||
<B.Td>
|
||||
<LinkTo
|
||||
@route='scopes.scope.host-catalogs.host-catalog.host-sets.host-set.hosts.host'
|
||||
@model={{B.data.id}}
|
||||
>
|
||||
{{B.data.displayName}}
|
||||
</LinkTo>
|
||||
<Hds::Text::Body @tag='p'>
|
||||
{{B.data.description}}
|
||||
</Hds::Text::Body>
|
||||
</B.Td>
|
||||
<B.Td>
|
||||
<HostCatalogTypeBadge @model={{B.data}} />
|
||||
</B.Td>
|
||||
<B.Td>
|
||||
<Hds::Copy::Snippet
|
||||
@textToCopy={{B.data.id}}
|
||||
@color='secondary'
|
||||
/>
|
||||
</B.Td>
|
||||
</B.Tr>
|
||||
</:body>
|
||||
</Hds::Table>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{#unless @model.hosts}}
|
||||
|
||||
@@ -98,7 +98,9 @@ module('Acceptance | host-catalogs | host-sets | hosts', function (hooks) {
|
||||
const count = getHostSetHostCount();
|
||||
await visit(urls.hostSetHosts);
|
||||
assert.strictEqual(findAll('tbody tr').length, count);
|
||||
await click('tbody tr .rose-dropdown-button-danger');
|
||||
|
||||
await click('[data-test-host-set-hosts-dropdown-toggle]');
|
||||
await click('[data-test-host-set-hosts-dropdown-remove-host]');
|
||||
assert.strictEqual(findAll('tbody tr').length, count - 1);
|
||||
});
|
||||
|
||||
@@ -126,7 +128,8 @@ module('Acceptance | host-catalogs | host-sets | hosts', function (hooks) {
|
||||
});
|
||||
await visit(urls.hostSetHosts);
|
||||
assert.strictEqual(findAll('tbody tr').length, getHostSetHostCount());
|
||||
await click('tbody tr .rose-dropdown-button-danger');
|
||||
await click('[data-test-host-set-hosts-dropdown-toggle]');
|
||||
await click('[data-test-host-set-hosts-dropdown-remove-host]');
|
||||
assert.ok(find('[role="alert"]'));
|
||||
});
|
||||
|
||||
@@ -169,11 +172,12 @@ module('Acceptance | host-catalogs | host-sets | hosts', function (hooks) {
|
||||
const count = getHostSetHostCount();
|
||||
await visit(urls.hostSetHosts);
|
||||
assert.strictEqual(findAll('tbody tr').length, count);
|
||||
await click('tbody tr .rose-dropdown-button-danger');
|
||||
await click('[data-test-host-set-hosts-dropdown-toggle]');
|
||||
await click('[data-test-host-set-hosts-dropdown-remove-host]');
|
||||
assert.strictEqual(findAll('tbody tr').length, count - 1);
|
||||
await click('.rose-layout-page-actions a:nth-child(2)');
|
||||
assert.strictEqual(currentURL(), urls.addHosts);
|
||||
await click('tbody label');
|
||||
await click('tbody .hds-table__tr .hds-form-label');
|
||||
await click('form [type="button"]');
|
||||
await visit(urls.hostSetHosts);
|
||||
assert.strictEqual(findAll('tbody tr').length, count - 1);
|
||||
@@ -194,7 +198,7 @@ module('Acceptance | host-catalogs | host-sets | hosts', function (hooks) {
|
||||
});
|
||||
instances.hostSet.update({ hostIds: [] });
|
||||
await visit(urls.addHosts);
|
||||
await click('tbody label');
|
||||
await click('tbody .hds-table__tr .hds-form-label');
|
||||
await click('form [type="submit"]');
|
||||
assert.ok(find('[role="alert"]'));
|
||||
});
|
||||
|
||||
Reference in new issue
Block a user