Skip to content

Commit e773f22

Browse files
author
Tyler Smalley
committed
Revert "[Security Solution][Exceptions] - Improve UX for missing exception list associated with rule (#75898)"
This reverts commit b9c8201.
1 parent d6c45a2 commit e773f22

File tree

13 files changed

+54
-706
lines changed

13 files changed

+54
-706
lines changed

‎x-pack/plugins/security_solution/public/common/components/exceptions/add_exception_modal/index.tsx‎

Lines changed: 26 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import {
1818
EuiCheckbox,
1919
EuiSpacer,
2020
EuiFormRow,
21+
EuiCallOut,
2122
EuiText,
2223
} from '@elastic/eui';
2324
import { Status } from '../../../../../common/detection_engine/schemas/common/schemas';
@@ -27,15 +28,13 @@ import {
2728
ExceptionListType,
2829
} from '../../../../../public/lists_plugin_deps';
2930
import * as i18n from './translations';
30-
import * as sharedI18n from '../translations';
3131
import { TimelineNonEcsData, Ecs } from '../../../../graphql/types';
3232
import { useAppToasts } from '../../../hooks/use_app_toasts';
3333
import { useKibana } from '../../../lib/kibana';
3434
import { ExceptionBuilderComponent } from '../builder';
3535
import { Loader } from '../../loader';
3636
import { useAddOrUpdateException } from '../use_add_exception';
3737
import { useSignalIndex } from '../../../../detections/containers/detection_engine/alerts/use_signal_index';
38-
import { useRuleAsync } from '../../../../detections/containers/detection_engine/rules/use_rule_async';
3938
import { useFetchOrCreateRuleExceptionList } from '../use_fetch_or_create_rule_exception_list';
4039
import { AddExceptionComments } from '../add_exception_comments';
4140
import {
@@ -47,7 +46,6 @@ import {
4746
entryHasNonEcsType,
4847
getMappedNonEcsValue,
4948
} from '../helpers';
50-
import { ErrorInfo, ErrorCallout } from '../error_callout';
5149
import { useFetchIndexPatterns } from '../../../../detections/containers/detection_engine/rules';
5250

5351
export interface AddExceptionModalBaseProps {
@@ -109,14 +107,13 @@ export const AddExceptionModal = memo(function AddExceptionModal({
109107
}: AddExceptionModalProps) {
110108
const { http } = useKibana().services;
111109
const [comment, setComment] = useState('');
112-
const { rule: maybeRule } = useRuleAsync(ruleId);
113110
const [shouldCloseAlert, setShouldCloseAlert] = useState(false);
114111
const [shouldBulkCloseAlert, setShouldBulkCloseAlert] = useState(false);
115112
const [shouldDisableBulkClose, setShouldDisableBulkClose] = useState(false);
116113
const [exceptionItemsToAdd, setExceptionItemsToAdd] = useState<
117114
Array<ExceptionListItemSchema | CreateExceptionListItemSchema>
118115
>([]);
119-
const [fetchOrCreateListError, setFetchOrCreateListError] = useState<ErrorInfo | null>(null);
116+
const [fetchOrCreateListError, setFetchOrCreateListError] = useState(false);
120117
const { addError, addSuccess } = useAppToasts();
121118
const { loading: isSignalIndexLoading, signalIndexName } = useSignalIndex();
122119
const [
@@ -167,41 +164,17 @@ export const AddExceptionModal = memo(function AddExceptionModal({
167164
},
168165
[onRuleChange]
169166
);
170-
171-
const handleDissasociationSuccess = useCallback(
172-
(id: string): void => {
173-
handleRuleChange(true);
174-
addSuccess(sharedI18n.DISSASOCIATE_LIST_SUCCESS(id));
175-
onCancel();
176-
},
177-
[handleRuleChange, addSuccess, onCancel]
178-
);
179-
180-
const handleDissasociationError = useCallback(
181-
(error: Error): void => {
182-
addError(error, { title: sharedI18n.DISSASOCIATE_EXCEPTION_LIST_ERROR });
183-
onCancel();
184-
},
185-
[addError, onCancel]
186-
);
187-
188-
const handleFetchOrCreateExceptionListError = useCallback(
189-
(error: Error, statusCode: number | null, message: string | null) => {
190-
setFetchOrCreateListError({
191-
reason: error.message,
192-
code: statusCode,
193-
details: message,
194-
listListId: null,
195-
});
167+
const onFetchOrCreateExceptionListError = useCallback(
168+
(error: Error) => {
169+
setFetchOrCreateListError(true);
196170
},
197171
[setFetchOrCreateListError]
198172
);
199-
200173
const [isLoadingExceptionList, ruleExceptionList] = useFetchOrCreateRuleExceptionList({
201174
http,
202175
ruleId,
203176
exceptionListType,
204-
onError: handleFetchOrCreateExceptionListError,
177+
onError: onFetchOrCreateExceptionListError,
205178
onSuccess: handleRuleChange,
206179
});
207180

@@ -306,9 +279,7 @@ export const AddExceptionModal = memo(function AddExceptionModal({
306279
]);
307280

308281
const isSubmitButtonDisabled = useMemo(
309-
() =>
310-
fetchOrCreateListError != null ||
311-
exceptionItemsToAdd.every((item) => item.entries.length === 0),
282+
() => fetchOrCreateListError || exceptionItemsToAdd.every((item) => item.entries.length === 0),
312283
[fetchOrCreateListError, exceptionItemsToAdd]
313284
);
314285

@@ -324,27 +295,19 @@ export const AddExceptionModal = memo(function AddExceptionModal({
324295
</ModalHeaderSubtitle>
325296
</ModalHeader>
326297

327-
{fetchOrCreateListError != null && (
328-
<EuiModalFooter>
329-
<ErrorCallout
330-
http={http}
331-
errorInfo={fetchOrCreateListError}
332-
rule={maybeRule}
333-
onCancel={onCancel}
334-
onSuccess={handleDissasociationSuccess}
335-
onError={handleDissasociationError}
336-
data-test-subj="addExceptionModalErrorCallout"
337-
/>
338-
</EuiModalFooter>
298+
{fetchOrCreateListError === true && (
299+
<EuiCallOut title={i18n.ADD_EXCEPTION_FETCH_ERROR_TITLE} color="danger" iconType="alert">
300+
<p>{i18n.ADD_EXCEPTION_FETCH_ERROR}</p>
301+
</EuiCallOut>
339302
)}
340-
{fetchOrCreateListError == null &&
303+
{fetchOrCreateListError === false &&
341304
(isLoadingExceptionList ||
342305
isIndexPatternLoading ||
343306
isSignalIndexLoading ||
344307
isSignalIndexPatternLoading) && (
345308
<Loader data-test-subj="loadingAddExceptionModal" size="xl" />
346309
)}
347-
{fetchOrCreateListError == null &&
310+
{fetchOrCreateListError === false &&
348311
!isSignalIndexLoading &&
349312
!isSignalIndexPatternLoading &&
350313
!isLoadingExceptionList &&
@@ -414,21 +377,20 @@ export const AddExceptionModal = memo(function AddExceptionModal({
414377
</ModalBodySection>
415378
</>
416379
)}
417-
{fetchOrCreateListError == null && (
418-
<EuiModalFooter>
419-
<EuiButtonEmpty onClick={onCancel}>{i18n.CANCEL}</EuiButtonEmpty>
420380

421-
<EuiButton
422-
data-test-subj="add-exception-confirm-button"
423-
onClick={onAddExceptionConfirm}
424-
isLoading={addExceptionIsLoading}
425-
isDisabled={isSubmitButtonDisabled}
426-
fill
427-
>
428-
{i18n.ADD_EXCEPTION}
429-
</EuiButton>
430-
</EuiModalFooter>
431-
)}
381+
<EuiModalFooter>
382+
<EuiButtonEmpty onClick={onCancel}>{i18n.CANCEL}</EuiButtonEmpty>
383+
384+
<EuiButton
385+
data-test-subj="add-exception-confirm-button"
386+
onClick={onAddExceptionConfirm}
387+
isLoading={addExceptionIsLoading}
388+
isDisabled={isSubmitButtonDisabled}
389+
fill
390+
>
391+
{i18n.ADD_EXCEPTION}
392+
</EuiButton>
393+
</EuiModalFooter>
432394
</Modal>
433395
</EuiOverlayMask>
434396
);

‎x-pack/plugins/security_solution/public/common/components/exceptions/edit_exception_modal/index.test.tsx‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,6 @@ describe('When the edit exception modal is opened', () => {
7777
<ThemeProvider theme={() => ({ eui: euiLightVars, darkMode: false })}>
7878
<EditExceptionModal
7979
ruleIndices={[]}
80-
ruleId="123"
8180
ruleName={ruleName}
8281
exceptionListType={'endpoint'}
8382
onCancel={jest.fn()}
@@ -106,7 +105,6 @@ describe('When the edit exception modal is opened', () => {
106105
<ThemeProvider theme={() => ({ eui: euiLightVars, darkMode: false })}>
107106
<EditExceptionModal
108107
ruleIndices={['filebeat-*']}
109-
ruleId="123"
110108
ruleName={ruleName}
111109
exceptionListType={'endpoint'}
112110
onCancel={jest.fn()}
@@ -149,7 +147,6 @@ describe('When the edit exception modal is opened', () => {
149147
<ThemeProvider theme={() => ({ eui: euiLightVars, darkMode: false })}>
150148
<EditExceptionModal
151149
ruleIndices={['filebeat-*']}
152-
ruleId="123"
153150
ruleName={ruleName}
154151
exceptionListType={'endpoint'}
155152
onCancel={jest.fn()}
@@ -193,7 +190,6 @@ describe('When the edit exception modal is opened', () => {
193190
<ThemeProvider theme={() => ({ eui: euiLightVars, darkMode: false })}>
194191
<EditExceptionModal
195192
ruleIndices={['filebeat-*']}
196-
ruleId="123"
197193
ruleName={ruleName}
198194
exceptionListType={'detection'}
199195
onCancel={jest.fn()}
@@ -233,7 +229,6 @@ describe('When the edit exception modal is opened', () => {
233229
<ThemeProvider theme={() => ({ eui: euiLightVars, darkMode: false })}>
234230
<EditExceptionModal
235231
ruleIndices={['filebeat-*']}
236-
ruleId="123"
237232
ruleName={ruleName}
238233
exceptionListType={'detection'}
239234
onCancel={jest.fn()}

‎x-pack/plugins/security_solution/public/common/components/exceptions/edit_exception_modal/index.tsx‎

Lines changed: 23 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -23,14 +23,12 @@ import {
2323
} from '@elastic/eui';
2424
import { useFetchIndexPatterns } from '../../../../detections/containers/detection_engine/rules';
2525
import { useSignalIndex } from '../../../../detections/containers/detection_engine/alerts/use_signal_index';
26-
import { useRuleAsync } from '../../../../detections/containers/detection_engine/rules/use_rule_async';
2726
import {
2827
ExceptionListItemSchema,
2928
CreateExceptionListItemSchema,
3029
ExceptionListType,
3130
} from '../../../../../public/lists_plugin_deps';
3231
import * as i18n from './translations';
33-
import * as sharedI18n from '../translations';
3432
import { useKibana } from '../../../lib/kibana';
3533
import { useAppToasts } from '../../../hooks/use_app_toasts';
3634
import { ExceptionBuilderComponent } from '../builder';
@@ -45,17 +43,14 @@ import {
4543
lowercaseHashValues,
4644
} from '../helpers';
4745
import { Loader } from '../../loader';
48-
import { ErrorInfo, ErrorCallout } from '../error_callout';
4946

5047
interface EditExceptionModalProps {
5148
ruleName: string;
52-
ruleId: string;
5349
ruleIndices: string[];
5450
exceptionItem: ExceptionListItemSchema;
5551
exceptionListType: ExceptionListType;
5652
onCancel: () => void;
5753
onConfirm: () => void;
58-
onRuleChange?: () => void;
5954
}
6055

6156
const Modal = styled(EuiModal)`
@@ -88,18 +83,14 @@ const ModalBodySection = styled.section`
8883

8984
export const EditExceptionModal = memo(function EditExceptionModal({
9085
ruleName,
91-
ruleId,
9286
ruleIndices,
9387
exceptionItem,
9488
exceptionListType,
9589
onCancel,
9690
onConfirm,
97-
onRuleChange,
9891
}: EditExceptionModalProps) {
9992
const { http } = useKibana().services;
10093
const [comment, setComment] = useState('');
101-
const { rule: maybeRule } = useRuleAsync(ruleId);
102-
const [updateError, setUpdateError] = useState<ErrorInfo | null>(null);
10394
const [hasVersionConflict, setHasVersionConflict] = useState(false);
10495
const [shouldBulkCloseAlert, setShouldBulkCloseAlert] = useState(false);
10596
const [shouldDisableBulkClose, setShouldDisableBulkClose] = useState(false);
@@ -117,53 +108,27 @@ export const EditExceptionModal = memo(function EditExceptionModal({
117108
'rules'
118109
);
119110

120-
const handleExceptionUpdateError = useCallback(
121-
(error: Error, statusCode: number | null, message: string | null) => {
111+
const onError = useCallback(
112+
(error) => {
122113
if (error.message.includes('Conflict')) {
123114
setHasVersionConflict(true);
124115
} else {
125-
setUpdateError({
126-
reason: error.message,
127-
code: statusCode,
128-
details: message,
129-
listListId: exceptionItem.list_id,
130-
});
116+
addError(error, { title: i18n.EDIT_EXCEPTION_ERROR });
117+
onCancel();
131118
}
132119
},
133-
[setUpdateError, setHasVersionConflict, exceptionItem.list_id]
134-
);
135-
136-
const handleDissasociationSuccess = useCallback(
137-
(id: string): void => {
138-
addSuccess(sharedI18n.DISSASOCIATE_LIST_SUCCESS(id));
139-
140-
if (onRuleChange) {
141-
onRuleChange();
142-
}
143-
144-
onCancel();
145-
},
146-
[addSuccess, onCancel, onRuleChange]
147-
);
148-
149-
const handleDissasociationError = useCallback(
150-
(error: Error): void => {
151-
addError(error, { title: sharedI18n.DISSASOCIATE_EXCEPTION_LIST_ERROR });
152-
onCancel();
153-
},
154120
[addError, onCancel]
155121
);
156-
157-
const handleExceptionUpdateSuccess = useCallback((): void => {
122+
const onSuccess = useCallback(() => {
158123
addSuccess(i18n.EDIT_EXCEPTION_SUCCESS);
159124
onConfirm();
160125
}, [addSuccess, onConfirm]);
161126

162127
const [{ isLoading: addExceptionIsLoading }, addOrUpdateExceptionItems] = useAddOrUpdateException(
163128
{
164129
http,
165-
onSuccess: handleExceptionUpdateSuccess,
166-
onError: handleExceptionUpdateError,
130+
onSuccess,
131+
onError,
167132
}
168133
);
169134

@@ -257,9 +222,11 @@ export const EditExceptionModal = memo(function EditExceptionModal({
257222
{ruleName}
258223
</ModalHeaderSubtitle>
259224
</ModalHeader>
225+
260226
{(addExceptionIsLoading || isIndexPatternLoading || isSignalIndexLoading) && (
261227
<Loader data-test-subj="loadingEditExceptionModal" size="xl" />
262228
)}
229+
263230
{!isSignalIndexLoading && !addExceptionIsLoading && !isIndexPatternLoading && (
264231
<>
265232
<ModalBodySection className="builder-section">
@@ -313,40 +280,28 @@ export const EditExceptionModal = memo(function EditExceptionModal({
313280
</ModalBodySection>
314281
</>
315282
)}
316-
{updateError != null && (
317-
<ModalBodySection>
318-
<ErrorCallout
319-
http={http}
320-
errorInfo={updateError}
321-
rule={maybeRule}
322-
onCancel={onCancel}
323-
onSuccess={handleDissasociationSuccess}
324-
onError={handleDissasociationError}
325-
/>
326-
</ModalBodySection>
327-
)}
283+
328284
{hasVersionConflict && (
329285
<ModalBodySection>
330286
<EuiCallOut title={i18n.VERSION_CONFLICT_ERROR_TITLE} color="danger" iconType="alert">
331287
<p>{i18n.VERSION_CONFLICT_ERROR_DESCRIPTION}</p>
332288
</EuiCallOut>
333289
</ModalBodySection>
334290
)}
335-
{updateError == null && (
336-
<EuiModalFooter>
337-
<EuiButtonEmpty onClick={onCancel}>{i18n.CANCEL}</EuiButtonEmpty>
338291

339-
<EuiButton
340-
data-test-subj="edit-exception-confirm-button"
341-
onClick={onEditExceptionConfirm}
342-
isLoading={addExceptionIsLoading}
343-
isDisabled={isSubmitButtonDisabled}
344-
fill
345-
>
346-
{i18n.EDIT_EXCEPTION_SAVE_BUTTON}
347-
</EuiButton>
348-
</EuiModalFooter>
349-
)}
292+
<EuiModalFooter>
293+
<EuiButtonEmpty onClick={onCancel}>{i18n.CANCEL}</EuiButtonEmpty>
294+
295+
<EuiButton
296+
data-test-subj="edit-exception-confirm-button"
297+
onClick={onEditExceptionConfirm}
298+
isLoading={addExceptionIsLoading}
299+
isDisabled={isSubmitButtonDisabled}
300+
fill
301+
>
302+
{i18n.EDIT_EXCEPTION_SAVE_BUTTON}
303+
</EuiButton>
304+
</EuiModalFooter>
350305
</Modal>
351306
</EuiOverlayMask>
352307
);

0 commit comments

Comments
 (0)