CyberCoveLLC/threshold-ui
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Icu 17166 implement sort for auth methods (#2855)

Browse Source 
* Implement sorting for auth methods
This commit is contained in:
Carlos Alcaide Corvo authored and GitHub committed 2025-06-04 09:05:19 +02:00
1 parent 204bd10e04
commit e685295d04
4 files changed
+234 -74
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

ui/admin/app/controllers/scopes/scope/auth-methods/index.js
+16
View File
@@ -28,6 +28,8 @@ export default class ScopesScopeAuthMethodsIndexController extends Controller {
{ primary: { type: 'array' } },
'page',
'pageSize',
'sortAttribute',
'sortDirection',
];
@tracked search;
@@ -35,6 +37,8 @@ export default class ScopesScopeAuthMethodsIndexController extends Controller {
@tracked primary = [];
@tracked page = 1;
@tracked pageSize = 10;
@tracked sortAttribute;
@tracked sortDirection;
/**
* True if the current scope has a primary auth method set.
@@ -326,4 +330,16 @@ export default class ScopesScopeAuthMethodsIndexController extends Controller {
async changeState(authMethod, state) {
await authMethod.changeState(state);
}
/**
* Set sort values and sets page to 1
* @param {string} sortBy
* @param {string} sortOrder
*/
@action
onSort(sortBy, sortOrder) {
this.sortAttribute = sortBy;
this.sortDirection = sortOrder;
this.page = 1;
}
}
ui/admin/app/routes/scopes/scope/auth-methods/index.js
+24 -2
View File
@@ -35,6 +35,14 @@ export default class ScopesScopeAuthMethodsIndexRoute extends Route {
pageSize: {
refreshModel: true,
},
sortAttribute: {
refreshModel: true,
replace: true,
},
sortDirection: {
refreshModel: true,
replace: true,
},
};
// =methods
@@ -50,7 +58,16 @@ export default class ScopesScopeAuthMethodsIndexRoute extends Route {
}
retrieveData = restartableTask(
async ({ search, types, primary, page, pageSize, useDebounce }) => {
async ({
search,
types,
primary,
page,
pageSize,
sortAttribute,
sortDirection,
useDebounce,
}) => {
if (useDebounce) {
await timeout(250);
}
@@ -63,6 +80,11 @@ export default class ScopesScopeAuthMethodsIndexRoute extends Route {
is_primary: [],
};
const sort = {
attribute: sortAttribute,
direction: sortDirection,
};
types.forEach((type) => {
filters.type.push({ equals: type });
});
@@ -82,7 +104,7 @@ export default class ScopesScopeAuthMethodsIndexRoute extends Route {
'auth-method',
{
scope_id,
query: { search, filters },
query: { search, filters, sort },
page,
pageSize,
},
ui/admin/app/templates/scopes/scope/auth-methods/index.hbs
+93 -71
View File
@@ -94,80 +94,102 @@
{{#if @model.authMethods}}
<Hds::Table
class='auth-methods-list-table'
@model={{@model.authMethods}}
@columns={{array
(hash label=(t 'form.name.label'))
(hash label=(t 'form.type.label'))
(hash label=(t 'form.id.label'))
(hash
label=(t 'resources.auth-method.titles.primary')
isVisuallyHidden=true
)
(hash label=(t 'titles.actions'))
}}
@valign='middle'
@onSort={{this.onSort}}
@sortBy={{this.sortAttribute}}
@sortOrder={{this.sortDirection}}
>
<:head as |H|>
<H.Tr>
<H.ThSort
@onClickSort={{fn H.setSortBy 'name'}}
@sortOrder={{if (eq 'name' H.sortBy) H.sortOrder}}
>{{t 'form.name.label'}}</H.ThSort>
<H.ThSort
@onClickSort={{fn H.setSortBy 'type'}}
@sortOrder={{if (eq 'type' H.sortBy) H.sortOrder}}
>{{t 'form.type.label'}}</H.ThSort>
<H.ThSort
@onClickSort={{fn H.setSortBy 'id'}}
@sortOrder={{if (eq 'id' H.sortBy) H.sortOrder}}
>{{t 'form.id.label'}}</H.ThSort>
<H.Th @isVisuallyHidden={{true}}>{{t
'resources.auth-method.titles.primary'
}}</H.Th>
<H.Th>{{t 'titles.actions'}}</H.Th>
</H.Tr>
</:head>
<:body as |B|>
<B.Tr data-test-auth-methods-table-row={{B.data.id}}>
<B.Td>
{{#if (can 'read auth-method' B.data)}}
<LinkTo
@route='scopes.scope.auth-methods.auth-method'
@model={{B.data.id}}
>
{{B.data.displayName}}
</LinkTo>
{{else}}
{{B.data.displayName}}
{{/if}}
<Hds::Text::Body @tag='p'>
{{B.data.description}}
</Hds::Text::Body>
</B.Td>
<B.Td>
<Hds::Badge
@text={{t
(concat 'resources.auth-method.types.' B.data.type)
}}
/>
</B.Td>
<B.Td>
<Hds::Copy::Snippet
@textToCopy={{B.data.id}}
@color='secondary'
/>
</B.Td>
<B.Td>
{{#if B.data.isPrimary}}
<Hds::Badge @text={{t 'states.primary'}} @color='success' />
{{/if}}
</B.Td>
<B.Td>
{{#if (can 'makePrimary auth-method' B.data)}}
<Hds::Dropdown as |dd|>
<dd.ToggleIcon
@icon='more-horizontal'
@text={{t 'actions.manage'}}
@hasChevron={{false}}
/>
{{#unless B.data.isPrimary}}
<dd.Interactive
{{on 'click' (fn this.makePrimary B.data)}}
>
{{t 'resources.auth-method.actions.make-primary'}}
</dd.Interactive>
{{/unless}}
{{#if B.data.isPrimary}}
<dd.Interactive
{{on 'click' (fn this.removeAsPrimary B.data)}}
>
{{t 'resources.auth-method.actions.remove-as-primary'}}
</dd.Interactive>
{{/if}}
</Hds::Dropdown>
{{/if}}
</B.Td>
</B.Tr>
{{#each @model.authMethods as |data|}}
<B.Tr data-test-auth-methods-table-row={{data.id}}>
{{! Name }}
<B.Td>
{{#if (can 'read auth-method' data)}}
<LinkTo
@route='scopes.scope.auth-methods.auth-method'
@model={{data.id}}
>
{{data.displayName}}
</LinkTo>
{{else}}
{{data.displayName}}
{{/if}}
<Hds::Text::Body @tag='p'>
{{data.description}}
</Hds::Text::Body>
</B.Td>
{{! Type }}
<B.Td>
<Hds::Badge
@text={{t
(concat 'resources.auth-method.types.' data.type)
}}
/>
</B.Td>
{{! ID }}
<B.Td>
<Hds::Copy::Snippet
@textToCopy={{data.id}}
@color='secondary'
/>
</B.Td>
{{! isPrimary }}
<B.Td>
{{#if data.isPrimary}}
<Hds::Badge @text={{t 'states.primary'}} @color='success' />
{{/if}}
</B.Td>
{{! Actions }}
<B.Td>
{{#if (can 'makePrimary auth-method' data)}}
<Hds::Dropdown as |dd|>
<dd.ToggleIcon
@icon='more-horizontal'
@text={{t 'actions.manage'}}
@hasChevron={{false}}
/>
{{#unless data.isPrimary}}
<dd.Interactive
{{on 'click' (fn this.makePrimary data)}}
>
{{t 'resources.auth-method.actions.make-primary'}}
</dd.Interactive>
{{/unless}}
{{#if data.isPrimary}}
<dd.Interactive
{{on 'click' (fn this.removeAsPrimary data)}}
>
{{t
'resources.auth-method.actions.remove-as-primary'
}}
</dd.Interactive>
{{/if}}
</Hds::Dropdown>
{{/if}}
</B.Td>
</B.Tr>
{{/each}}
</:body>
</Hds::Table>
<Rose::Pagination
ui/admin/tests/acceptance/auth-methods/list-test.js
+101 -1
View File
@@ -4,11 +4,12 @@
*/
import { module, test } from 'qunit';
import { visit, click, waitFor, fillIn } from '@ember/test-helpers';
import { visit, click, waitFor, fillIn, currentURL } from '@ember/test-helpers';
import { setupApplicationTest } from 'admin/tests/helpers';
import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
import { setupIndexedDb } from 'api/test-support/helpers/indexed-db';
import { authenticateSession } from 'ember-simple-auth/test-support';
import { faker } from '@faker-js/faker';
import {
TYPE_AUTH_METHOD_PASSWORD,
TYPE_AUTH_METHOD_OIDC,
@@ -173,4 +174,103 @@ module('Acceptance | auth-methods | list', function (hooks) {
assert.dom(commonSelectors.HREF(urls.oidcAuthMethod)).isNotVisible();
assert.dom(commonSelectors.HREF(urls.passwordAuthMethod)).isVisible();
});
test('auth-methods table is sorted by `created_time` descending by default', async function (assert) {
this.server.schema.authMethods.all().destroy();
const years = ['2006', '2005', '2004', '2003'];
faker.helpers.shuffle(years).map((year) => {
return this.server.create('auth-method', {
scope: instances.scopes.org,
type: TYPE_AUTH_METHOD_PASSWORD,
created_time: `${year}-01-01T00:00:00Z`,
name: `Auth-method ${year}`,
});
});
await visit(urls.authMethods);
assert.dom(commonSelectors.TABLE_ROWS).exists({ count: years.length });
years.forEach((year, index) => {
// nth-child index starts at 1
assert
.dom(commonSelectors.TABLE_ROW(index + 1))
.containsText(`Auth-method ${year}`);
});
});
test.each(
'sorting',
{
'on name': {
attribute: {
key: 'name',
values: ['Alpha', 'Beta', 'Delta', 'Gamma', 'Epsilon'],
},
expectedAscendingSort: ['Alpha', 'Beta', 'Delta', 'Epsilon', 'Gamma'],
column: 1,
},
'on type': {
attribute: {
key: 'type',
values: ['Password', 'Oidc', 'Oidc', 'Password', 'Ldap'],
},
expectedAscendingSort: ['Ldap', 'Oidc', 'Oidc', 'Password', 'Password'],
column: 2,
},
'on id': {
attribute: {
key: 'id',
values: ['am_1000', 'am_0001', 'am_0100', 'am_0010'],
},
expectedAscendingSort: ['am_0001', 'am_0010', 'am_0100', 'am_1000'],
column: 3,
},
},
async function (assert, input) {
this.server.schema.authMethods.all().destroy();
faker.helpers.shuffle(input.attribute.values).forEach((value) => {
this.server.create('auth-method', {
[input.attribute.key]: value,
scope: instances.scopes.org,
});
});
await visit(urls.authMethods);
// click the sort button again to sort in ascending order
await click(commonSelectors.TABLE_SORT_BTN(input.column));
assert.true(currentURL().includes('sortDirection=asc'));
assert.true(
currentURL().includes(`sortAttribute=${input.attribute.key}`),
);
assert
.dom(commonSelectors.TABLE_SORT_BTN_ARROW_UP(input.column))
.isVisible();
assert
.dom(commonSelectors.TABLE_ROWS)
.isVisible({ count: input.attribute.values.length });
input.expectedAscendingSort.forEach((expected, index) => {
// nth-child index starts at 1
assert.dom(commonSelectors.TABLE_ROW(index + 1)).containsText(expected);
});
// click the sort button again to sort in descending order
await click(commonSelectors.TABLE_SORT_BTN(input.column));
assert.true(currentURL().includes('sortDirection=desc'));
assert.true(
currentURL().includes(`sortAttribute=${input.attribute.key}`),
);
assert
.dom(commonSelectors.TABLE_SORT_BTN_ARROW_DOWN(input.column))
.isVisible();
input.expectedAscendingSort.toReversed().forEach((expected, index) => {
// nth-child index starts at 1
assert.dom(commonSelectors.TABLE_ROW(index + 1)).containsText(expected);
});
},
);
});