Skip to content

Commit 6e894d9

Browse files
committed
adding useMemo
1 parent c2f2a79 commit 6e894d9

3 files changed

Lines changed: 32 additions & 27 deletions

File tree

x-pack/plugins/endpoint/public/applications/endpoint/view/policy/policy_forms/events/linux.tsx

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -8,18 +8,19 @@ import React, { useMemo } from 'react';
88
import { i18n } from '@kbn/i18n';
99
import { FormattedMessage } from '@kbn/i18n/react';
1010
import { EuiTitle, EuiText, EuiSpacer } from '@elastic/eui';
11+
import { ImmutableArray } from '../../../../../../../common/types';
12+
import { getIn, setIn } from '../../../../models/policy_details_config';
1113
import { EventsCheckbox } from './checkbox';
1214
import { OS, UIPolicyConfig } from '../../../../types';
1315
import { usePolicyDetailsSelector } from '../../policy_hooks';
1416
import { selectedLinuxEvents, totalLinuxEvents } from '../../../../store/policy_details/selectors';
1517
import { ConfigForm } from '../config_form';
16-
import { getIn, setIn } from '../../../../models/policy_details_config';
1718

1819
export const LinuxEvents = React.memo(() => {
1920
const selected = usePolicyDetailsSelector(selectedLinuxEvents);
2021
const total = usePolicyDetailsSelector(totalLinuxEvents);
2122

22-
const checkboxes: Array<{
23+
const checkboxes: ImmutableArray<{
2324
name: string;
2425
os: 'linux';
2526
protectionField: keyof UIPolicyConfig['linux']['events'];
@@ -50,7 +51,7 @@ export const LinuxEvents = React.memo(() => {
5051
[]
5152
);
5253

53-
const renderCheckboxes = () => {
54+
const renderCheckboxes = useMemo(() => {
5455
return (
5556
<>
5657
<EuiTitle size="xxs">
@@ -76,9 +77,9 @@ export const LinuxEvents = React.memo(() => {
7677
})}
7778
</>
7879
);
79-
};
80+
}, [checkboxes]);
8081

81-
const collectionsEnabled = () => {
82+
const collectionsEnabled = useMemo(() => {
8283
return (
8384
<EuiText size="s" color="subdued">
8485
<FormattedMessage
@@ -88,19 +89,20 @@ export const LinuxEvents = React.memo(() => {
8889
/>
8990
</EuiText>
9091
);
91-
};
92+
}, [selected, total]);
9293

9394
return (
9495
<ConfigForm
9596
type={i18n.translate('xpack.endpoint.policy.details.eventCollection', {
9697
defaultMessage: 'Event Collection',
9798
})}
98-
supportedOss={[
99-
i18n.translate('xpack.endpoint.policy.details.linux', { defaultMessage: 'Linux' }),
100-
]}
101-
id="linuxEventingForm"
102-
rightCorner={collectionsEnabled()}
103-
children={renderCheckboxes()}
99+
supportedOss={useMemo(
100+
() => [i18n.translate('xpack.endpoint.policy.details.linux', { defaultMessage: 'Linux' })],
101+
[]
102+
)}
103+
id="linuxEventsForm"
104+
rightCorner={collectionsEnabled}
105+
children={renderCheckboxes}
104106
/>
105107
);
106108
});

x-pack/plugins/endpoint/public/applications/endpoint/view/policy/policy_forms/events/mac.tsx

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -8,18 +8,19 @@ import React, { useMemo } from 'react';
88
import { i18n } from '@kbn/i18n';
99
import { FormattedMessage } from '@kbn/i18n/react';
1010
import { EuiTitle, EuiText, EuiSpacer } from '@elastic/eui';
11+
import { ImmutableArray } from '../../../../../../../common/types';
12+
import { getIn, setIn } from '../../../../models/policy_details_config';
1113
import { EventsCheckbox } from './checkbox';
1214
import { OS, UIPolicyConfig } from '../../../../types';
1315
import { usePolicyDetailsSelector } from '../../policy_hooks';
1416
import { selectedMacEvents, totalMacEvents } from '../../../../store/policy_details/selectors';
1517
import { ConfigForm } from '../config_form';
16-
import { getIn, setIn } from '../../../../models/policy_details_config';
1718

1819
export const MacEvents = React.memo(() => {
1920
const selected = usePolicyDetailsSelector(selectedMacEvents);
2021
const total = usePolicyDetailsSelector(totalMacEvents);
2122

22-
const checkboxes: Array<{
23+
const checkboxes: ImmutableArray<{
2324
name: string;
2425
os: 'mac';
2526
protectionField: keyof UIPolicyConfig['mac']['events'];
@@ -50,7 +51,7 @@ export const MacEvents = React.memo(() => {
5051
[]
5152
);
5253

53-
const renderCheckboxes = () => {
54+
const renderCheckboxes = useMemo(() => {
5455
return (
5556
<>
5657
<EuiTitle size="xxs">
@@ -76,9 +77,9 @@ export const MacEvents = React.memo(() => {
7677
})}
7778
</>
7879
);
79-
};
80+
}, [checkboxes]);
8081

81-
const collectionsEnabled = () => {
82+
const collectionsEnabled = useMemo(() => {
8283
return (
8384
<EuiText size="s" color="subdued">
8485
<FormattedMessage
@@ -88,19 +89,20 @@ export const MacEvents = React.memo(() => {
8889
/>
8990
</EuiText>
9091
);
91-
};
92+
}, [selected, total]);
9293

9394
return (
9495
<ConfigForm
9596
type={i18n.translate('xpack.endpoint.policy.details.eventCollection', {
9697
defaultMessage: 'Event Collection',
9798
})}
98-
supportedOss={[
99-
i18n.translate('xpack.endpoint.policy.details.mac', { defaultMessage: 'Mac' }),
100-
]}
101-
id="macEventingForm"
102-
rightCorner={collectionsEnabled()}
103-
children={renderCheckboxes()}
99+
supportedOss={useMemo(
100+
() => [i18n.translate('xpack.endpoint.policy.details.mac', { defaultMessage: 'Mac' })],
101+
[]
102+
)}
103+
id="macEventsForm"
104+
rightCorner={collectionsEnabled}
105+
children={renderCheckboxes}
104106
/>
105107
);
106108
});

x-pack/plugins/endpoint/public/applications/endpoint/view/policy/policy_forms/events/windows.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ import React, { useMemo } from 'react';
88
import { i18n } from '@kbn/i18n';
99
import { FormattedMessage } from '@kbn/i18n/react';
1010
import { EuiTitle, EuiText, EuiSpacer } from '@elastic/eui';
11+
import { ImmutableArray } from '../../../../../../../common/types';
12+
import { setIn, getIn } from '../../../../models/policy_details_config';
1113
import { EventsCheckbox } from './checkbox';
1214
import { OS, UIPolicyConfig } from '../../../../types';
1315
import { usePolicyDetailsSelector } from '../../policy_hooks';
@@ -16,13 +18,12 @@ import {
1618
totalWindowsEvents,
1719
} from '../../../../store/policy_details/selectors';
1820
import { ConfigForm } from '../config_form';
19-
import { setIn, getIn } from '../../../../models/policy_details_config';
2021

2122
export const WindowsEvents = React.memo(() => {
2223
const selected = usePolicyDetailsSelector(selectedWindowsEvents);
2324
const total = usePolicyDetailsSelector(totalWindowsEvents);
2425

25-
const checkboxes: Array<{
26+
const checkboxes: ImmutableArray<{
2627
name: string;
2728
os: 'windows';
2829
protectionField: keyof UIPolicyConfig['windows']['events'];
@@ -132,7 +133,7 @@ export const WindowsEvents = React.memo(() => {
132133
],
133134
[]
134135
)}
135-
id="windowsEventingForm"
136+
id="windowsEventsForm"
136137
rightCorner={collectionsEnabled}
137138
children={renderCheckboxes}
138139
/>

0 commit comments

Comments
 (0)