[8.6] [Security Solution][List details page]: Sort Manage rules table based on selection (#146003) (#146123)

# Backport

This will backport the following commits from `main` to `8.6`:
- [[Security Solution][List details page]: Sort Manage rules table based
on selection (#146003)](https://github.com/elastic/kibana/pull/146003)

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

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

<!--BACKPORT [{"author":{"name":"Wafaa
Nasr","email":"wafaa.nasr@elastic.co"},"sourceCommit":{"committedDate":"2022-11-23T10:28:36Z","message":"[Security
Solution][List details page]: Sort Manage rules table based on selection
(#146003)\n\n## Summary\r\n\r\n- Addresses
https://github.com/elastic/kibana/issues/145807\r\n\r\n- Sort table
based on the `initiallySelectedRules` so it renders the\r\nselected on
the first
page","sha":"8ded29a18abc958d36ab3ab5e2488628fb20f353","branchLabelMapping":{"^v8.7.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","Team:Security
Solution
Platform","backport:prev-minor","ci:cloud-deploy","v8.6.0","v8.7.0"],"number":146003,"url":"https://github.com/elastic/kibana/pull/146003","mergeCommit":{"message":"[Security
Solution][List details page]: Sort Manage rules table based on selection
(#146003)\n\n## Summary\r\n\r\n- Addresses
https://github.com/elastic/kibana/issues/145807\r\n\r\n- Sort table
based on the `initiallySelectedRules` so it renders the\r\nselected on
the first
page","sha":"8ded29a18abc958d36ab3ab5e2488628fb20f353"}},"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/146003","number":146003,"mergeCommit":{"message":"[Security
Solution][List details page]: Sort Manage rules table based on selection
(#146003)\n\n## Summary\r\n\r\n- Addresses
https://github.com/elastic/kibana/issues/145807\r\n\r\n- Sort table
based on the `initiallySelectedRules` so it renders the\r\nselected on
the first page","sha":"8ded29a18abc958d36ab3ab5e2488628fb20f353"}}]}]
BACKPORT-->

Co-authored-by: Wafaa Nasr <wafaa.nasr@elastic.co>
This commit is contained in:
Kibana Machine 2022-11-23 07:02:20 -05:00 committed by GitHub
parent e4baf889b7
commit 7b6d34c7d0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 3 deletions

View file

@ -24,7 +24,7 @@ export const textCss = css`
margin-left: ${euiThemeVars.euiSizeXS};
`;
export const descriptionContainerCss = css`
margin-top: -${euiThemeVars.euiSizeXXL};
margin-top: -${euiThemeVars.euiSizeL};
margin-bottom: -${euiThemeVars.euiSizeL};
`;

View file

@ -10,6 +10,7 @@ import type { CriteriaWithPagination } from '@elastic/eui';
import { EuiSpacer, EuiPanel, EuiText, EuiInMemoryTable, EuiLoadingContent } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { sortBy } from 'lodash';
import * as myI18n from './translations';
import type { Rule } from '../../../../rule_management/logic/types';
import { useFindRulesInMemory } from '../../../../rule_management_ui/components/rules_table/rules_table/use_find_rules_in_memory';
@ -91,6 +92,15 @@ const ExceptionsAddToRulesTableComponent: React.FC<ExceptionsAddToRulesComponent
[rules]
);
const sortedRulesBySelection = useMemo(
() =>
sortBy(rules, [
(rule) => {
return initiallySelectedRules?.find((initRule) => initRule.id === rule.id);
},
]),
[initiallySelectedRules, rules]
);
return (
<EuiPanel color="subdued" borderRadius="none" hasShadow={false}>
<>
@ -98,8 +108,8 @@ const ExceptionsAddToRulesTableComponent: React.FC<ExceptionsAddToRulesComponent
<EuiSpacer size="s" />
<EuiInMemoryTable<Rule>
tableCaption="Rules table"
items={sortedRulesBySelection}
itemId="id"
items={rules}
loading={!isFetched}
columns={getRulesTableColumn()}
pagination={{
@ -113,7 +123,6 @@ const ExceptionsAddToRulesTableComponent: React.FC<ExceptionsAddToRulesComponent
}
selection={ruleSelectionValue}
search={searchOptions}
sorting
isSelectable
data-test-subj="addExceptionToRulesTable"
/>

View file

@ -45,6 +45,7 @@ export const ManageRules: FC<ManageRulesProps> = memo(
const complicatedFlyoutTitleId = useGeneratedHtmlId({
prefix: 'complicatedFlyoutTitle',
});
return (
<EuiFlyout
hideCloseButton