icu-14735 add search & pagination to aliases (#2498)

* refactor: 💡 add search & pagination to aliases

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-14735
---------

Co-authored-by: Dharini Jeeva <dharini@hashicorp.com>
Co-authored-by: Cameron Perera <cameron.perera@hashicorp.com>
This commit is contained in:
authored and GitHub committed 2024-09-30 13:07:13 -07:00
1 parent 9b33812f9e
commit 91ffbfb315
23 files changed
+508 -246

No files matched your search

+2
View File
@@ -29,6 +29,8 @@ export const modelIndexes = {
'&id, attributes.created_time, attributes.type, attributes.name, attributes.description, attributes.scope.scope_id, attributes.plugin.name',
'auth-method':
'&id, attributes.created_time, attributes.type, attributes.name, attributes.description, attributes.is_primary, attributes.scope.scope_id',
alias:
'&id, attributes.created_time, attributes.type, attributes.value, attributes.name, attributes.description, attributes.destination_id, attributes.scope.scope_id',
};
export const formatDbName = (userId, clusterUrl) =>
@@ -6,15 +6,26 @@
import Controller from '@ember/controller';
import { inject as service } from '@ember/service';
import { action } from '@ember/object';
import { tracked } from '@glimmer/tracking';
import { loading } from 'ember-loading';
import { debounce } from 'core/decorators/debounce';
import { notifySuccess, notifyError } from 'core/decorators/notify';
import { confirm } from 'core/decorators/confirm';
export default class ScopesScopeAliasesIndexController extends Controller {
// =services
@service can;
@service router;
// =attributes
queryParams = ['search', 'page', 'pageSize'];
@tracked search;
@tracked page = 1;
@tracked pageSize = 10;
// =actions
/**
@@ -22,10 +33,10 @@ export default class ScopesScopeAliasesIndexController extends Controller {
* @param {AliasModel} alias
*/
@action
async cancel(alias) {
cancel(alias) {
const { isNew } = alias;
alias.rollbackAttributes();
if (isNew) await this.router.transitionTo('scopes.scope.aliases');
if (isNew) this.router.transitionTo('scopes.scope.aliases');
}
/**
@@ -49,7 +60,7 @@ export default class ScopesScopeAliasesIndexController extends Controller {
}
/**
* Remove destaination_id from alias
* Remove destination_id from alias
* @param {AliasModel} alias
*/
@action
@@ -77,4 +88,16 @@ export default class ScopesScopeAliasesIndexController extends Controller {
await this.router.replaceWith('scopes.scope.aliases');
await this.router.refresh();
}
/**
* Handles input on each keystroke and the search queryParam
* @param {object} event
*/
@action
@debounce(250)
handleSearchInput(event) {
const { value } = event.target;
this.search = value;
this.page = 1;
}
}
@@ -5,14 +5,11 @@
import Route from '@ember/routing/route';
import { inject as service } from '@ember/service';
import { all, hash } from 'rsvp';
export default class ScopesScopeAliasesRoute extends Route {
// =services
@service store;
@service session;
@service can;
@service router;
// =methods
@@ -23,34 +20,4 @@ export default class ScopesScopeAliasesRoute extends Route {
beforeModel() {
if (!this.session.isAuthenticated) this.router.transitionTo('index');
}
/**
* Load all aliases in current scope
* @return {Promise<[AliasModel]>}
*/
async model() {
const scope = this.modelFor('scopes.scope');
const { id: scope_id } = scope;
if (
this.can.can('list model', scope, {
collection: 'aliases',
})
) {
const aliases = await this.store.query('alias', { scope_id });
// since we don't receive target info from aliases list API,
// we query the store to fetch target information based on the destination id
const aliasesWithResourceNames = await all(
aliases.map((alias) =>
hash({
alias,
target: alias.destination_id
? this.store.findRecord('target', alias.destination_id)
: null,
}),
),
);
return aliasesWithResourceNames;
}
}
}
@@ -4,10 +4,100 @@
*/
import Route from '@ember/routing/route';
import { inject as service } from '@ember/service';
import { hash } from 'rsvp';
export default class ScopesScopeAliasesIndexRoute extends Route {
// =services
@service store;
@service can;
// =attributes
queryParams = {
search: {
refreshModel: true,
replace: true,
},
page: {
refreshModel: true,
},
pageSize: {
refreshModel: true,
},
};
// =methods
/**
* Loads queried aliases and the number of aliases under current scope.
* @returns {Promise<{totalItems: number, aliases: [object], aliasesExist: boolean}>}
*/
async model({ search, page, pageSize }) {
const scope = this.modelFor('scopes.scope');
const { id: scope_id } = scope;
let aliases;
let doAliasesExist = false;
let totalItems = 0;
if (
this.can.can('list model', scope, {
collection: 'aliases',
})
) {
aliases = await this.store.query('alias', {
scope_id,
query: { search },
page,
pageSize,
});
totalItems = aliases.meta?.totalItems;
// since we don't receive target info from aliases list API,
// we query the store to fetch target information based on the destination id
aliases = await Promise.all(
aliases.map((alias) =>
hash({
alias,
target: alias.destination_id
? this.store.findRecord('target', alias.destination_id, {
backgroundReload: false,
})
: null,
}),
),
);
doAliasesExist = await this.getDoAliasesExist(scope_id, totalItems);
}
return { aliases, doAliasesExist, totalItems };
}
/**
* Sets doAliasesExist to true if there are any aliases.
* @param {string} scope_id
* @param {number} totalItems
* @returns {Promise<boolean>}
*/
async getDoAliasesExist(scope_id, totalItems) {
if (totalItems > 0) {
return true;
}
const options = { pushToStore: false, peekIndexedDB: true };
const aliases = await this.store.query(
'alias',
{
scope_id,
query: { filters: { scope_id: [{ equals: scope_id }] } },
page: 1,
pageSize: 1,
},
options,
);
return aliases.length > 0;
}
setupController(controller) {
const scope = this.modelFor('scopes.scope');
super.setupController(...arguments);
@@ -40,7 +40,7 @@ export default class ScopesScopeAuthMethodsIndexRoute extends Route {
/**
* Loads queried auth-methods and the number of auth-methods under current scope.
* @returns {Promise<{totalItems: number, authMethods: [AuthMethodModel], authMethodsExist: boolean }> }
* @returns {Promise<{totalItems: number, authMethods: [AuthMethodModel], doAuthMethodsExist: boolean }> }
*/
async model({ search, types, primary, page, pageSize }) {
const scope = this.modelFor('scopes.scope');
@@ -62,7 +62,7 @@ export default class ScopesScopeAuthMethodsIndexRoute extends Route {
let authMethods;
let totalItems = 0;
let authMethodsExist = false;
let doAuthMethodsExist = false;
if (this.can.can('list model', scope, { collection: 'auth-methods' })) {
// TODO: Remove storeToken option as this is a temporary fix for auth-methods.
const options = { storeToken: false };
@@ -77,19 +77,22 @@ export default class ScopesScopeAuthMethodsIndexRoute extends Route {
options,
);
totalItems = authMethods.meta?.totalItems;
authMethodsExist = await this.getAuthMethodsExist(scope_id, totalItems);
doAuthMethodsExist = await this.getDoAuthMethodsExist(
scope_id,
totalItems,
);
}
return { authMethods, authMethodsExist, totalItems };
return { authMethods, doAuthMethodsExist, totalItems };
}
/**
* Sets authMethodsExist to true if there exists any auth methods.
* Sets doAuthMethodsExist to true if there exists any auth methods.
* @param {string} scope_id
* @param {number} totalItems
* @returns {Promise<boolean>}
*/
async getAuthMethodsExist(scope_id, totalItems) {
async getDoAuthMethodsExist(scope_id, totalItems) {
if (totalItems > 0) {
return true;
}
@@ -35,7 +35,7 @@ export default class ScopesScopeCredentialStoresIndexRoute extends Route {
/**
* Loads queried credential-stores and the number of credential-stores under current scope.
* @returns {Promise<{totalItems: number, credentialStores: [CredentialStoreModel], credentialStoresExist: boolean }> }
* @returns {Promise<{totalItems: number, credentialStores: [CredentialStoreModel], doCredentialStoresExist: boolean }> }
*/
async model({ search, types, page, pageSize }) {
const scope = this.modelFor('scopes.scope');
@@ -51,7 +51,7 @@ export default class ScopesScopeCredentialStoresIndexRoute extends Route {
let credentialStores;
let totalItems = 0;
let credentialStoresExist = false;
let doCredentialStoresExist = false;
if (
this.can.can('list model', scope, {
collection: 'credential-stores',
@@ -64,22 +64,21 @@ export default class ScopesScopeCredentialStoresIndexRoute extends Route {
pageSize,
});
totalItems = credentialStores.meta?.totalItems;
credentialStoresExist = await this.getCredentialStoresExist(
doCredentialStoresExist = await this.getDoCredentialStoresExist(
scope_id,
totalItems,
);
}
return { credentialStores, credentialStoresExist, totalItems };
return { credentialStores, doCredentialStoresExist, totalItems };
}
/**
* Sets credentialStoresExist to true if there exists any credential-stores.
* Sets doCredentialStoresExist to true if there exists any credential-stores.
* @param {string} scope_id
* @param {number} totalItems
* @returns {Promise<boolean>}
*/
async getCredentialStoresExist(scope_id, totalItems) {
async getDoCredentialStoresExist(scope_id, totalItems) {
if (totalItems > 0) {
return true;
}
@@ -31,14 +31,14 @@ export default class ScopesScopeGroupsIndexRoute extends Route {
/**
* Loads queried groups and the number of groups under current scope.
* @returns {Promise<{totalItems: number, groups: [GroupModel], groupsExist: boolean }> }
* @returns {Promise<{totalItems: number, groups: [GroupModel], doGroupsExist: boolean }> }
*/
async model({ search, page, pageSize }) {
const scope = this.modelFor('scopes.scope');
const { id: scope_id } = scope;
let groups = [];
let totalItems = 0;
let groupsExist = false;
let doGroupsExist = false;
const filters = { scope_id: [{ equals: scope_id }] };
if (this.can.can('list model', scope, { collection: 'groups' })) {
@@ -49,18 +49,19 @@ export default class ScopesScopeGroupsIndexRoute extends Route {
pageSize,
});
totalItems = groups.meta?.totalItems;
groupsExist = await this.getGroupsExist(scope_id, totalItems);
doGroupsExist = await this.getDoGroupsExist(scope_id, totalItems);
}
return { groups, groupsExist, totalItems };
return { groups, doGroupsExist, totalItems };
}
/**
* Sets groupsExist to true if there exists any groups.
* Sets doGroupsExist to true if there exists any groups.
* @param {string} scope_id
* @param {number} totalItems
* @returns {Promise<boolean>}
*/
async getGroupsExist(scope_id, totalItems) {
async getDoGroupsExist(scope_id, totalItems) {
if (totalItems > 0) {
return true;
}
@@ -31,7 +31,7 @@ export default class ScopesScopeHostCatalogsIndexRoute extends Route {
/**
* Loads all host catalogs under the current scope.
* @returns {Promise<{hostCatalogsExist: boolean, totalItems: number, hostCatalogs: [HostCatalogModel]}>}
* @returns {Promise<{doHostCatalogsExist: boolean, totalItems: number, hostCatalogs: [HostCatalogModel]}>}
*/
async model({ search, page, pageSize }) {
const scope = this.modelFor('scopes.scope');
@@ -45,7 +45,7 @@ export default class ScopesScopeHostCatalogsIndexRoute extends Route {
let hostCatalogs;
let totalItems = 0;
let hostCatalogsExist = false;
let doHostCatalogsExist = false;
if (this.can.can('list model', scope, { collection: 'host-catalogs' })) {
hostCatalogs = await this.store.query('host-catalog', {
scope_id,
@@ -54,19 +54,22 @@ export default class ScopesScopeHostCatalogsIndexRoute extends Route {
pageSize,
});
totalItems = hostCatalogs.meta?.totalItems;
hostCatalogsExist = await this.getHostCatalogsExist(scope_id, totalItems);
doHostCatalogsExist = await this.getDoHostCatalogsExist(
scope_id,
totalItems,
);
}
return { hostCatalogs, totalItems, hostCatalogsExist };
return { hostCatalogs, totalItems, doHostCatalogsExist };
}
/**
* Returns true if any host catalogs exist.
* @param {string} scope_id
* @param {number} totalItems
* @returns {boolean}
* @returns {Promise<boolean>}
*/
async getHostCatalogsExist(scope_id, totalItems) {
async getDoHostCatalogsExist(scope_id, totalItems) {
if (totalItems > 0) {
return true;
}
@@ -31,7 +31,7 @@ export default class ScopesScopeRolesIndexRoute extends Route {
/**
* Loads queried roles and the number of roles under current scope.
* @returns {Promise<{totalItems: number, roles: [RoleModel], rolesExist: boolean }> }
* @returns {Promise<{totalItems: number, roles: [RoleModel], doRolesExist: boolean }> }
*/
async model({ search, page, pageSize }) {
const scope = this.modelFor('scopes.scope');
@@ -42,7 +42,7 @@ export default class ScopesScopeRolesIndexRoute extends Route {
let roles;
let totalItems = 0;
let rolesExist = false;
let doRolesExist = false;
if (this.can.can('list model', scope, { collection: 'roles' })) {
roles = await this.store.query('role', {
scope_id,
@@ -51,19 +51,19 @@ export default class ScopesScopeRolesIndexRoute extends Route {
pageSize,
});
totalItems = roles.meta?.totalItems;
rolesExist = await this.getRolesExist(scope_id, totalItems);
doRolesExist = await this.getDoRolesExist(scope_id, totalItems);
}
return { roles, rolesExist, totalItems };
return { roles, doRolesExist, totalItems };
}
/**
* Sets rolesExist to true if there exists any roles.
* Sets doRolesExist to true if there exists any roles.
* @param {string} scope_id
* @param {number} totalItems
* @returns {Promise<boolean>}
*/
async getRolesExist(scope_id, totalItems) {
async getDoRolesExist(scope_id, totalItems) {
if (totalItems > 0) {
return true;
}
@@ -31,7 +31,7 @@ export default class ScopesScopeScopesIndexRoute extends Route {
/**
* Loads sub scopes for the current scope.
* @returns {Promise<{totalItems: number, currentScope: ScopeModel, subScopes: [ScopeModel], scopesExist: boolean }> }
* @returns {Promise<{totalItems: number, currentScope: ScopeModel, subScopes: [ScopeModel], doScopesExist: boolean }> }
*/
async model({ search, page, pageSize }) {
const currentScope = this.modelFor('scopes.scope');
@@ -47,23 +47,23 @@ export default class ScopesScopeScopesIndexRoute extends Route {
pageSize,
});
const totalItems = subScopes.meta?.totalItems;
const scopesExist = await this.getScopesExist(scope_id, totalItems);
const doScopesExist = await this.getDoScopesExist(scope_id, totalItems);
return {
currentScope,
subScopes,
scopesExist,
doScopesExist,
totalItems,
};
}
/**
* Sets scopesExist to true if there exists any scopes.
* Sets doScopesExist to true if there exists any scopes.
* @param {string} scope_id
* @param {number} totalItems
* @returns {Promise<boolean>}
*/
async getScopesExist(scope_id, totalItems) {
async getDoScopesExist(scope_id, totalItems) {
if (totalItems > 0) {
return true;
}
@@ -45,7 +45,7 @@ export default class ScopesScopeTargetsIndexRoute extends Route {
/**
* Loads queried targets, the number of targets under current scope, and
* active sessions filtering options.
* @returns {Promise<{totalItems: number, targets: [TargetModel], targetsExist: boolean }> }
* @returns {Promise<{totalItems: number, targets: [TargetModel], doTargetsExist: boolean }> }
*/
async model({ search, availableSessions, types, page, pageSize }) {
const scope = this.modelFor('scopes.scope');
@@ -78,7 +78,7 @@ export default class ScopesScopeTargetsIndexRoute extends Route {
let targets;
let totalItems = 0;
let targetsExist = false;
let doTargetsExist = false;
if (this.can.can('list model', scope, { collection: 'targets' })) {
targets = await this.store.query('target', {
scope_id,
@@ -87,19 +87,19 @@ export default class ScopesScopeTargetsIndexRoute extends Route {
pageSize,
});
totalItems = targets.meta?.totalItems;
targetsExist = await this.getTargetsExist(scope_id, totalItems);
doTargetsExist = await this.getDoTargetsExist(scope_id, totalItems);
}
return { targets, targetsExist, totalItems };
return { targets, doTargetsExist, totalItems };
}
/**
* Sets targetsExist to true if there exists any targets.
* Sets doTargetsExist to true if there exists any targets.
* @param {string} scope_id
* @param {number} totalItems
* @returns {Promise<boolean>}
*/
async getTargetsExist(scope_id, totalItems) {
async getDoTargetsExist(scope_id, totalItems) {
if (totalItems > 0) {
return true;
}
@@ -31,7 +31,7 @@ export default class ScopesScopeUsersIndexRoute extends Route {
/**
* Loads queried users and the number of users under current scope.
* @returns {Promise<{totalItems: number, users: [UserModel], usersExist: boolean }> }
* @returns {Promise<{totalItems: number, users: [UserModel], doUsersExist: boolean }> }
*/
async model({ search, page, pageSize }) {
const scope = this.modelFor('scopes.scope');
@@ -43,7 +43,7 @@ export default class ScopesScopeUsersIndexRoute extends Route {
let users;
let totalItems = 0;
let usersExist = false;
let doUsersExist = false;
if (this.can.can('list model', scope, { collection: 'users' })) {
users = await this.store.query('user', {
scope_id,
@@ -52,19 +52,19 @@ export default class ScopesScopeUsersIndexRoute extends Route {
pageSize,
});
totalItems = users.meta?.totalItems;
usersExist = await this.getUsersExist(scope_id, totalItems);
doUsersExist = await this.getDoUsersExist(scope_id, totalItems);
}
return { users, usersExist, totalItems };
return { users, doUsersExist, totalItems };
}
/**
* Sets usersExist to true if there exists any users.
* Sets doUsersExist to true if there exists any users.
* @param {string} scope_id
* @param {number} totalItems
* @returns {Promise<boolean>}
*/
async getUsersExist(scope_id, totalItems) {
async getDoUsersExist(scope_id, totalItems) {
if (totalItems > 0) {
return true;
}
@@ -18,7 +18,7 @@
<page.actions>
{{#if (can 'create model' this.scope collection='aliases')}}
{{#if @model}}
{{#if @model.doAliasesExist}}
<Hds::Button
@route='scopes.scope.aliases.new'
@text={{t 'resources.alias.titles.new'}}
@@ -26,147 +26,175 @@
{{/if}}
{{/if}}
</page.actions>
<page.body>
{{#if @model}}
<Hds::Table
@model={{@model}}
@columns={{array
(hash label=(t 'resources.alias.title'))
(hash label=(t 'resources.alias.titles.points_to'))
(hash label=(t 'resources.scope.title'))
(hash label=(t 'resources.alias.titles.resource_id'))
(hash label=(t 'titles.actions') isVisuallyHidden=true)
}}
@valign='middle'
>
<:body as |B|>
<B.Tr>
<B.Td>
{{#if (can 'read model' B.data.alias)}}
<LinkTo
@route='scopes.scope.aliases.alias'
@model={{B.data.alias.id}}
>
{{B.data.alias.value}}
</LinkTo>
{{else}}
<Hds::Text::Body @tag='p'>
{{B.data.alias.value}}
</Hds::Text::Body>
{{/if}}
{{#if B.data.alias.description}}
<Hds::Text::Body @tag='p'>
{{B.data.alias.description}}
</Hds::Text::Body>
{{/if}}
</B.Td>
<B.Td>
{{#if B.data.target.displayName}}
<div class='aliases-list-cell-item'>
<span><FlightIcon @name='target' /></span>
<span> {{B.data.target.displayName}} </span>
</div>
{{else}}
<Hds::Text::Body
@tag='p'
@size='100'
@weight='medium'
@color='faint'
>
{{t 'titles.not-set'}}
</Hds::Text::Body>
{{/if}}
</B.Td>
<B.Td>
<Hds::Badge @text={{t 'titles.global'}} @icon='globe' />
</B.Td>
<B.Td>
{{#if B.data.alias.destination_id}}
<Hds::Copy::Snippet
@textToCopy={{B.data.alias.destination_id}}
@color='secondary'
/>
{{/if}}
</B.Td>
<B.Td>
{{#let
(hash
canUpdate=(can 'update model' B.data.alias)
canDelete=(can 'delete model' B.data.alias)
)
as |perms|
}}
{{#if (or perms.canUpdate perms.canDelete)}}
<Hds::Dropdown as |dd|>
<page.body class='search-filtering'>
{{#if @model.doAliasesExist}}
<Hds::SegmentedGroup as |S|>
<S.TextInput
@value={{this.search}}
@type='search'
placeholder={{t 'actions.search'}}
aria-label={{t 'actions.search'}}
{{on 'input' this.handleSearchInput}}
/>
</Hds::SegmentedGroup>
<dd.ToggleIcon
@icon='more-horizontal'
@text={{t 'actions.manage'}}
@hasChevron={{false}}
@size='small'
/>
{{#if perms.canUpdate}}
<dd.Interactive
@route='scopes.scope.aliases.alias'
@model={{B.data.alias.id}}
@text={{t 'actions.edit'}}
{{#if @model.aliases}}
<Hds::Table
@model={{@model.aliases}}
@columns={{array
(hash label=(t 'resources.alias.title'))
(hash label=(t 'resources.alias.titles.points_to'))
(hash label=(t 'resources.scope.title'))
(hash label=(t 'resources.alias.titles.resource_id'))
(hash label=(t 'titles.actions') isVisuallyHidden=true)
}}
@valign='middle'
>
<:body as |B|>
<B.Tr data-test-alias-row={{B.data.alias.id}}>
<B.Td>
{{#if (can 'read model' B.data.alias)}}
<LinkTo
@route='scopes.scope.aliases.alias'
@model={{B.data.alias.id}}
>
{{B.data.alias.value}}
</LinkTo>
{{else}}
<Hds::Text::Body @tag='p'>
{{B.data.alias.value}}
</Hds::Text::Body>
{{/if}}
{{#if B.data.alias.description}}
<Hds::Text::Body @tag='p'>
{{B.data.alias.description}}
</Hds::Text::Body>
{{/if}}
</B.Td>
<B.Td>
{{#if B.data.target.displayName}}
<div class='aliases-list-cell-item'>
<span><FlightIcon @name='target' /></span>
<span> {{B.data.target.displayName}} </span>
</div>
{{else}}
<Hds::Text::Body
@tag='p'
@size='100'
@weight='medium'
@color='faint'
>
{{t 'titles.not-set'}}
</Hds::Text::Body>
{{/if}}
</B.Td>
<B.Td>
<Hds::Badge @text={{t 'titles.global'}} @icon='globe' />
</B.Td>
<B.Td>
{{#if B.data.alias.destination_id}}
<Hds::Copy::Snippet
@textToCopy={{B.data.alias.destination_id}}
@color='secondary'
/>
{{/if}}
</B.Td>
<B.Td>
{{#let
(hash
canUpdate=(can 'update model' B.data.alias)
canDelete=(can 'delete model' B.data.alias)
)
as |perms|
}}
{{#if (or perms.canUpdate perms.canDelete)}}
<Hds::Dropdown as |dd|>
<dd.ToggleIcon
@icon='more-horizontal'
@text={{t 'actions.manage'}}
@hasChevron={{false}}
@size='small'
/>
{{#if B.data.alias.destination_id}}
{{#if perms.canUpdate}}
<dd.Interactive
@text={{t 'actions.clear'}}
@color='action'
{{on 'click' (fn this.clearAlias B.data.alias)}}
@route='scopes.scope.aliases.alias'
@model={{B.data.alias.id}}
@text={{t 'actions.edit'}}
/>
{{#if B.data.alias.destination_id}}
<dd.Interactive
@text={{t 'actions.clear'}}
@color='action'
{{on 'click' (fn this.clearAlias B.data.alias)}}
/>
{{/if}}
{{/if}}
{{#if perms.canDelete}}
<dd.Interactive
@color='critical'
@text={{t 'actions.delete'}}
{{on 'click' (fn this.deleteAlias B.data.alias)}}
/>
{{/if}}
{{/if}}
</Hds::Dropdown>
{{#if perms.canDelete}}
<dd.Interactive
@color='critical'
@text={{t 'actions.delete'}}
{{on 'click' (fn this.deleteAlias B.data.alias)}}
/>
{{/if}}
</Hds::Dropdown>
{{/if}}
{{/let}}
</B.Td>
</B.Tr>
</:body>
</Hds::Table>
{{/if}}
{{/let}}
</B.Td>
</B.Tr>
</:body>
</Hds::Table>
<Rose::Pagination
@totalItems={{@model.totalItems}}
@currentPage={{this.page}}
@currentPageSize={{this.pageSize}}
/>
{{else}}
<Hds::ApplicationState data-test-no-alias-results as |A|>
<A.Header @title={{t 'titles.no-results-found'}} />
<A.Body
@text={{t
'descriptions.no-search-results'
query=this.search
resource=(t 'resources.alias.title_plural')
}}
/>
</Hds::ApplicationState>
{{/if}}
{{else}}
<Rose::Layout::Centered>
<Rose::Message
@title={{t 'resources.alias.messages.none.title'}}
as |message|
>
<message.description>
{{#if (can 'list model' this.scope collection='aliases')}}
{{t 'resources.alias.messages.none.description'}}
{{else if (can 'create model' this.scope collection='aliases')}}
{{t
<Hds::ApplicationState as |A|>
<A.Header @title={{t 'resources.alias.messages.none.title'}} />
<A.Body
{{! can list (at least): show default welcome message}}
{{! can create (only): show create-but-not-list welcome message}}
{{! can neither list nor create: show neither-list-nor-create welcome message}}
@text={{t
(if
(can 'list model' this.scope collection='aliases')
'resources.alias.messages.none.description'
(if
(can 'create model' this.scope collection='aliases')
'descriptions.create-but-not-list'
resource=(t 'resources.alias.title_plural')
}}
{{else}}
{{t
'descriptions.neither-list-nor-create'
resource=(t 'resources.alias.title_plural')
}}
{{/if}}
</message.description>
{{#if (can 'create model' this.scope collection='aliases')}}
<Hds::Link::Standalone
)
)
resource=(t 'resources.alias.title_plural')
}}
/>
{{#if (can 'create model' this.scope collection='aliases')}}
<A.Footer as |F|>
<F.LinkStandalone
@icon='plus-circle'
@iconPosition='leading'
@route='scopes.scope.aliases.new'
@text={{t 'resources.alias.messages.none.link'}}
/>
{{/if}}
</Rose::Message>
</Rose::Layout::Centered>
</A.Footer>
{{/if}}
</Hds::ApplicationState>
{{/if}}
</page.body>
@@ -42,7 +42,7 @@
</page.actions>
<page.body class='search-filtering'>
{{#if @model.authMethodsExist}}
{{#if @model.doAuthMethodsExist}}
{{#unless this.hasPrimaryAuthMethod}}
<Hds::Alert
class='auth-methods-list-alert'
@@ -13,7 +13,7 @@
{{t 'resources.credential-store.title_plural'}}
<DocLink @doc='credential-store' @iconSize='large' />
</h2>
{{#if @model.credentialStoresExist}}
{{#if @model.doCredentialStoresExist}}
<p>{{t 'resources.credential-store.description'}}</p>
{{/if}}
</page.header>
@@ -21,7 +21,7 @@
<page.actions>
{{#if (can 'create model' this.scope collection='credential-stores')}}
{{#if @model.credentialStoresExist}}
{{#if @model.doCredentialStoresExist}}
<Hds::Button
@route='scopes.scope.credential-stores.new'
@text={{t 'resources.credential-store.titles.new'}}
@@ -31,7 +31,7 @@
</page.actions>
<page.body class='search-filtering'>
{{#if @model.credentialStoresExist}}
{{#if @model.doCredentialStoresExist}}
<Hds::SegmentedGroup as |S|>
<S.TextInput
@value={{this.search}}
@@ -14,14 +14,14 @@
{{t 'resources.group.title_plural'}}
<DocLink @doc='group' @iconSize='large' />
</h2>
{{#if @model.groupsExist}}
{{#if @model.doGroupsExist}}
<p>{{t 'resources.group.description'}}</p>
{{/if}}
</page.header>
<page.actions>
{{#if (can 'create model' this.scope collection='groups')}}
{{#if @model.groupsExist}}
{{#if @model.doGroupsExist}}
<Hds::Button
@route='scopes.scope.groups.new'
@text={{t 'resources.group.titles.new'}}
@@ -32,7 +32,7 @@
<page.body class='search-filtering'>
{{#if @model.groupsExist}}
{{#if @model.doGroupsExist}}
<Hds::SegmentedGroup as |S|>
<S.TextInput
@value={{this.search}}
@@ -14,14 +14,14 @@
{{t 'resources.host-catalog.title_plural'}}
<DocLink @doc='host-catalog' @iconSize='large' />
</h2>
{{#if @model.hostCatalogsExist}}
{{#if @model.doHostCatalogsExist}}
<p>{{t 'resources.host-catalog.description'}}</p>
{{/if}}
</page.header>
<page.actions>
{{#if (can 'create model' this.scope collection='host-catalogs')}}
{{#if @model.hostCatalogsExist}}
{{#if @model.doHostCatalogsExist}}
<Hds::Button
@route='scopes.scope.host-catalogs.new'
@text={{t 'resources.host-catalog.titles.new'}}
@@ -31,7 +31,7 @@
</page.actions>
<page.body class='search-filtering'>
{{#if @model.hostCatalogsExist}}
{{#if @model.doHostCatalogsExist}}
<Hds::SegmentedGroup as |S|>
<S.TextInput
@value={{this.search}}
@@ -14,14 +14,14 @@
{{t 'resources.role.title_plural'}}
<DocLink @doc='role' @iconSize='large' />
</h2>
{{#if @model.rolesExist}}
{{#if @model.doRolesExist}}
<p>{{t 'resources.role.description'}}</p>
{{/if}}
</page.header>
<page.actions>
{{#if (can 'create model' this.scope collection='roles')}}
{{#if @model.rolesExist}}
{{#if @model.doRolesExist}}
<Hds::Button
@route='scopes.scope.roles.new'
@text={{t 'resources.role.titles.new'}}
@@ -31,7 +31,7 @@
</page.actions>
<page.body class='search-filtering'>
{{#if @model.rolesExist}}
{{#if @model.doRolesExist}}
<Hds::SegmentedGroup as |S|>
<S.TextInput
@value={{this.search}}
@@ -15,7 +15,7 @@
{{t 'resources.org.title_plural'}}
<DocLink @doc='org' @iconSize='large' />
</h2>
{{#if @model.scopesExist}}
{{#if @model.doScopesExist}}
<p>{{t 'resources.org.description'}}</p>
{{/if}}
{{else if @model.currentScope.isOrg}}
@@ -23,7 +23,7 @@
{{t 'resources.project.title_plural'}}
<DocLink @doc='project' @iconSize='large' />
</h2>
{{#if @model.scopesExist}}
{{#if @model.doScopesExist}}
<p>{{t 'resources.project.description'}}</p>
{{/if}}
{{/if}}
@@ -31,7 +31,7 @@
<page.actions>
{{#if (can 'create model' @model.currentScope collection='scopes')}}
{{#if @model.scopesExist}}
{{#if @model.doScopesExist}}
<Hds::Button
@route='scopes.scope.scopes.new'
@text={{t
@@ -48,7 +48,7 @@
<page.body class='search-filtering'>
{{#if @model.scopesExist}}
{{#if @model.doScopesExist}}
<Hds::SegmentedGroup as |S|>
<S.TextInput
@value={{this.search}}
@@ -13,14 +13,14 @@
{{t 'resources.target.title_plural'}}
<DocLink @doc='target' @iconSize='large' />
</h2>
{{#if @model.targetsExist}}
{{#if @model.doTargetsExist}}
<p>{{t 'resources.target.description'}}</p>
{{/if}}
</page.header>
<page.actions>
{{#if (can 'create model' this.scope collection='targets')}}
{{#if @model.targetsExist}}
{{#if @model.doTargetsExist}}
<Hds::Button
@route='scopes.scope.targets.new'
@text={{t 'resources.target.titles.new'}}
@@ -29,7 +29,7 @@
{{/if}}
</page.actions>
<page.body class='search-filtering'>
{{#if @model.targetsExist}}
{{#if @model.doTargetsExist}}
<Hds::SegmentedGroup as |S|>
<S.TextInput
@value={{this.search}}
@@ -14,14 +14,14 @@
{{t 'resources.user.title_plural'}}
<DocLink @doc='user' @iconSize='large' />
</h2>
{{#if @model.usersExist}}
{{#if @model.doUsersExist}}
<p>{{t 'resources.user.description'}}</p>
{{/if}}
</page.header>
<page.actions>
{{#if (can 'create model' this.scope collection='users')}}
{{#if @model.usersExist}}
{{#if @model.doUsersExist}}
<Hds::Button
@route='scopes.scope.users.new'
@text={{t 'resources.user.titles.new'}}
@@ -31,7 +31,7 @@
</page.actions>
<page.body class='search-filtering'>
{{#if @model.usersExist}}
{{#if @model.doUsersExist}}
<Hds::SegmentedGroup as |S|>
<S.TextInput
@value={{this.search}}
+66 -10
View File
@@ -4,7 +4,7 @@
*/
import { module, test } from 'qunit';
import { visit, click, currentURL } from '@ember/test-helpers';
import { visit, click, currentURL, waitFor, fillIn } from '@ember/test-helpers';
import { setupApplicationTest } from 'ember-qunit';
import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
import { setupIndexedDb } from 'api/test-support/helpers/indexed-db';
@@ -18,10 +18,14 @@ module('Acceptance | aliases | list', function (hooks) {
let intl;
const ALIAS_TITLE = 'Aliases';
const MESSAGE_DESCRIPTION_SELECTOR = '.rose-message-description';
const MESSAGE_LINK_SELECTOR = '.rose-message-body .hds-link-standalone';
const DROPDOWN_BUTTON_SELECTOR = '.hds-dropdown-toggle-icon';
const MESSAGE_DESCRIPTION_SELECTOR = '.hds-application-state__body';
const MESSAGE_LINK_SELECTOR =
'.hds-application-state__footer .hds-link-standalone';
const DROPDOWN_BUTTON_SELECTOR = (id) =>
`tbody [data-test-alias-row="${id}"] td:last-child .hds-dropdown-toggle-icon`;
const DROPDOWN_ITEM_SELECTOR = '.hds-dropdown-list-item a';
const SEARCH_INPUT_SELECTOR = '.search-filtering [type="search"]';
const NO_RESULTS_MSG_SELECTOR = '[data-test-no-alias-results]';
const instances = {
scopes: {
@@ -29,12 +33,15 @@ module('Acceptance | aliases | list', function (hooks) {
org: null,
},
alias: null,
target: null,
aliasWithTarget: null,
};
const urls = {
globalScope: null,
aliases: null,
alias: null,
aliasWithTarget: null,
};
hooks.beforeEach(function () {
@@ -43,15 +50,32 @@ module('Acceptance | aliases | list', function (hooks) {
type: 'org',
scope: { id: 'global', type: 'global' },
});
instances.scopes.project = this.server.create('scope', {
type: 'project',
scope: { id: instances.scopes.org.id, type: 'org' },
});
instances.target = this.server.create('target', {
scope: instances.scopes.project,
});
instances.alias = this.server.create('alias', {
scope: instances.scopes.global,
destination_id: null,
});
instances.aliasWithTarget = this.server.create('alias', {
scope: instances.scopes.global,
destination_id: instances.target.id,
});
urls.globalScope = `/scopes/global`;
urls.aliases = `${urls.globalScope}/aliases`;
urls.alias = `${urls.aliases}/${instances.alias.id}`;
urls.aliasWithTarget = `${urls.aliases}/${instances.aliasWithTarget.id}`;
intl = this.owner.lookup('service:intl');
authenticateSession({});
});
test('users can navigate to aliases with proper authorization', async function (assert) {
this.server.schema.aliases.all().destroy();
await visit(urls.globalScope);
assert.ok(
@@ -76,6 +100,7 @@ module('Acceptance | aliases | list', function (hooks) {
});
test('user cannot navigate to index without either list or create actions', async function (assert) {
this.server.schema.aliases.all().destroy();
instances.scopes.global.authorized_collection_actions['aliases'] = [];
await visit(urls.globalScope);
@@ -105,6 +130,7 @@ module('Acceptance | aliases | list', function (hooks) {
});
test('user can navigate to index with only create action', async function (assert) {
this.server.schema.aliases.all().destroy();
instances.scopes.global.authorized_collection_actions['aliases'] =
instances.scopes.global.authorized_collection_actions['aliases'].filter(
(item) => item !== 'list',
@@ -135,6 +161,7 @@ module('Acceptance | aliases | list', function (hooks) {
});
test('user can navigate to index with only list action', async function (assert) {
this.server.schema.aliases.all().destroy();
instances.scopes.global.authorized_collection_actions['aliases'] =
instances.scopes.global.authorized_collection_actions['aliases'].filter(
(item) => item !== 'create',
@@ -164,17 +191,46 @@ module('Acceptance | aliases | list', function (hooks) {
test('edit action in table directs user to appropriate page', async function (assert) {
await visit(urls.globalScope);
instances.alias = this.server.create('alias', {
scope: instances.scopes.global,
});
urls.alias = `${urls.aliases}/${instances.alias.id}`;
await click(`[href="${urls.aliases}"]`);
await click(DROPDOWN_BUTTON_SELECTOR);
await click(DROPDOWN_BUTTON_SELECTOR(instances.alias.id));
assert.dom(DROPDOWN_ITEM_SELECTOR).exists();
assert.dom(DROPDOWN_ITEM_SELECTOR).hasText('Edit');
await click(DROPDOWN_ITEM_SELECTOR);
assert.strictEqual(currentURL(), urls.alias);
});
test('user can search for a specific alias by id', async function (assert) {
await visit(urls.globalScope);
await click(`[href="${urls.aliases}"]`);
assert.dom(`[href="${urls.alias}"]`).exists();
assert.dom(`[href="${urls.aliasWithTarget}"]`).exists();
await fillIn(SEARCH_INPUT_SELECTOR, instances.alias.id);
await waitFor(`[href="${urls.aliasWithTarget}"]`, { count: 0 });
assert.dom(`[href="${urls.alias}"]`).exists();
assert.dom(`[href="${urls.aliasWithTarget}"]`).doesNotExist();
});
test('user can search for aliases and get no results', async function (assert) {
await visit(urls.globalScope);
await click(`[href="${urls.aliases}"]`);
assert.dom(`[href="${urls.alias}"]`).exists();
assert.dom(`[href="${urls.aliasWithTarget}"]`).exists();
await fillIn(SEARCH_INPUT_SELECTOR, 'fake alias that does not exist');
await waitFor(NO_RESULTS_MSG_SELECTOR, { count: 1 });
assert.dom(`[href="${urls.alias}"]`).doesNotExist();
assert.dom(`[href="${urls.aliasWithTarget}"]`).doesNotExist();
assert
.dom(NO_RESULTS_MSG_SELECTOR)
.includesText(intl.t('titles.no-results-found'));
});
});
@@ -4,13 +4,103 @@
*/
import { module, test } from 'qunit';
import { setupTest } from 'admin/tests/helpers';
import { setupTest } from 'ember-qunit';
import { waitUntil, visit } from '@ember/test-helpers';
import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
import { setupIndexedDb } from 'api/test-support/helpers/indexed-db';
import { setupIntl } from 'ember-intl/test-support';
import { authenticateSession } from 'ember-simple-auth/test-support';
module('Unit | Controller | scopes/scope/aliases/index', function (hooks) {
setupTest(hooks);
setupMirage(hooks);
setupIndexedDb(hooks);
setupIntl(hooks, 'en-us');
let store;
let controller;
let getAliasCount;
const instances = {
scopes: {
global: null,
},
alias: null,
};
const urls = {
globalScope: null,
aliases: null,
};
hooks.beforeEach(function () {
authenticateSession({});
store = this.owner.lookup('service:store');
controller = this.owner.lookup('controller:scopes/scope/aliases/index');
instances.scopes.global = this.server.create('scope', { id: 'global' });
instances.alias = this.server.create('alias', {
scope: instances.scopes.global,
});
urls.globalScope = `/scopes/global`;
urls.aliases = `${urls.globalScope}/aliases`;
getAliasCount = () => this.server.schema.aliases.all().models.length;
});
test('it exists', function (assert) {
let controller = this.owner.lookup('controller:scopes/scope/aliases/index');
assert.ok(controller);
});
test('handleSearchInput action sets expected values correctly', async function (assert) {
const searchValue = 'test';
controller.handleSearchInput({ target: { value: searchValue } });
await waitUntil(() => controller.search === searchValue);
assert.strictEqual(controller.page, 1);
assert.strictEqual(controller.search, searchValue);
});
test('cancel action rolls-back changes on the specified model', async function (assert) {
await visit(urls.aliases);
const alias = await store.findRecord('alias', instances.alias.id);
alias.name = 'test';
assert.strictEqual(alias.name, 'test');
await controller.cancel(alias);
assert.notEqual(alias.name, 'test');
});
test('save action saves changes on the specified model', async function (assert) {
await visit(urls.aliases);
const alias = await store.findRecord('alias', instances.alias.id);
alias.name = 'test';
await controller.save(alias);
assert.strictEqual(alias.name, 'test');
});
test('deleteAlias action destroys specified model', async function (assert) {
const alias = await store.findRecord('alias', instances.alias.id);
const aliasCount = getAliasCount();
await controller.deleteAlias(alias);
assert.strictEqual(getAliasCount(), aliasCount - 1);
});
test('clearAlias action removes destination_id on the specified model', async function (assert) {
const targetId = 't_1234567';
instances.alias.update({ destination_id: targetId });
const alias = await store.findRecord('alias', instances.alias.id);
assert.strictEqual(alias.destination_id, targetId);
await controller.clearAlias(alias);
assert.notOk(alias.destination_id);
});
});