[8.6] [Index Management] Fix component template usage count sort (#147141) (#147184)

# Backport

This will backport the following commits from `main` to `8.6`:
- [[Index Management] Fix component template usage count sort
(#147141)](https://github.com/elastic/kibana/pull/147141)

<!--- Backport version: 8.9.7 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Alison
Goryachev","email":"alison.goryachev@elastic.co"},"sourceCommit":{"committedDate":"2022-12-07T13:21:50Z","message":"[Index
Management] Fix component template usage count sort
(#147141)","sha":"031d8a8cead4840659a92e2694ed58603137aab9","branchLabelMapping":{"^v8.7.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix","Feature:Index
Management","Team:Deployment
Management","backport:prev-minor","v8.6.0","v8.7.0"],"number":147141,"url":"https://github.com/elastic/kibana/pull/147141","mergeCommit":{"message":"[Index
Management] Fix component template usage count sort
(#147141)","sha":"031d8a8cead4840659a92e2694ed58603137aab9"}},"sourceBranch":"main","suggestedTargetBranches":["8.6"],"targetPullRequestStates":[{"branch":"8.6","label":"v8.6.0","labelRegex":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v8.7.0","labelRegex":"^v8.7.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/147141","number":147141,"mergeCommit":{"message":"[Index
Management] Fix component template usage count sort
(#147141)","sha":"031d8a8cead4840659a92e2694ed58603137aab9"}}]}]
BACKPORT-->

Co-authored-by: Alison Goryachev <alison.goryachev@elastic.co>
This commit is contained in:
Kibana Machine 2022-12-07 09:47:45 -05:00 committed by GitHub
parent b91dfc93e3
commit b16ce7f6d4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 41 additions and 4 deletions

View file

@ -46,7 +46,16 @@ describe('<ComponentTemplateList />', () => {
isManaged: false,
};
const componentTemplates = [componentTemplate1, componentTemplate2];
const componentTemplate3: ComponentTemplateListItem = {
name: 'test_component_template_3',
hasMappings: true,
hasAliases: true,
hasSettings: true,
usedBy: ['test_index_template_1', 'test_index_template_2'],
isManaged: false,
};
const componentTemplates = [componentTemplate1, componentTemplate2, componentTemplate3];
httpRequestsMockHelpers.setLoadComponentTemplatesResponse(componentTemplates);
@ -63,6 +72,26 @@ describe('<ComponentTemplateList />', () => {
});
});
test('should sort "Usage count" column by number', async () => {
const { actions, table } = testBed;
// Sort ascending
await actions.clickTableColumnSortButton(1);
const { tableCellsValues: ascTableCellsValues } =
table.getMetaData('componentTemplatesTable');
const ascUsageCountValues = ascTableCellsValues.map((row) => row[2]);
expect(ascUsageCountValues).toEqual(['Not in use', '1', '2']);
// Sort descending
await actions.clickTableColumnSortButton(1);
const { tableCellsValues: descTableCellsValues } =
table.getMetaData('componentTemplatesTable');
const descUsageCountValues = descTableCellsValues.map((row) => row[2]);
expect(descUsageCountValues).toEqual(['2', '1', 'Not in use']);
});
test('should reload the component templates data', async () => {
const { component, actions } = testBed;

View file

@ -32,7 +32,7 @@ export type ComponentTemplateListTestBed = TestBed<ComponentTemplateTestSubjects
};
const createActions = (testBed: TestBed) => {
const { find } = testBed;
const { find, component } = testBed;
/**
* User Actions
@ -42,7 +42,7 @@ const createActions = (testBed: TestBed) => {
};
const clickComponentTemplateAt = async (index: number) => {
const { component, table, router } = testBed;
const { table, router } = testBed;
const { rows } = table.getMetaData('componentTemplatesTable');
const componentTemplateLink = findTestSubject(
rows[index].reactWrapper,
@ -57,6 +57,13 @@ const createActions = (testBed: TestBed) => {
});
};
const clickTableColumnSortButton = async (index: number) => {
await act(async () => {
find('tableHeaderSortButton').at(index).simulate('click');
});
component.update();
};
const clickDeleteActionAt = (index: number) => {
const { table } = testBed;
@ -70,6 +77,7 @@ const createActions = (testBed: TestBed) => {
clickReloadButton,
clickComponentTemplateAt,
clickDeleteActionAt,
clickTableColumnSortButton,
};
};

View file

@ -187,7 +187,7 @@ export const ComponentTable: FunctionComponent<Props> = ({
name: i18n.translate('xpack.idxMgmt.componentTemplatesList.table.isInUseColumnTitle', {
defaultMessage: 'Usage count',
}),
sortable: true,
sortable: ({ usedBy }: ComponentTemplateListItem) => usedBy.length,
render: (usedBy: string[]) => {
if (usedBy.length) {
return usedBy.length;