mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 17:59:23 -04:00
[Cases] Refactor attach alert to new case flyout (#125505)
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
parent
67a38e61a1
commit
1b2f9a43be
28 changed files with 530 additions and 104 deletions
|
@ -8,6 +8,8 @@
|
|||
import React, { memo } from 'react';
|
||||
import { EuiContextMenuItem } from '@elastic/eui';
|
||||
|
||||
import { useKibana } from '../../../../../../../../src/plugins/kibana_react/public';
|
||||
import { TimelinesStartServices } from '../../../../types';
|
||||
import { useAddToCase } from '../../../../hooks/use_add_to_case';
|
||||
import { AddToCaseActionProps } from './add_to_case_action';
|
||||
import * as i18n from './translations';
|
||||
|
@ -25,7 +27,7 @@ const AddToNewCaseButtonComponent: React.FC<AddToNewCaseButtonProps> = ({
|
|||
owner,
|
||||
onClose,
|
||||
}) => {
|
||||
const { addNewCaseClick, isDisabled, userCanCrud } = useAddToCase({
|
||||
const { isDisabled, userCanCrud, caseAttachments, onCaseSuccess, onCaseCreated } = useAddToCase({
|
||||
event,
|
||||
useInsertTimeline,
|
||||
casePermissions,
|
||||
|
@ -33,6 +35,20 @@ const AddToNewCaseButtonComponent: React.FC<AddToNewCaseButtonProps> = ({
|
|||
owner,
|
||||
onClose,
|
||||
});
|
||||
const { cases } = useKibana<TimelinesStartServices>().services;
|
||||
const createCaseFlyout = cases.hooks.getUseCasesAddToNewCaseFlyout({
|
||||
attachments: caseAttachments,
|
||||
afterCaseCreated: onCaseCreated,
|
||||
onSuccess: onCaseSuccess,
|
||||
});
|
||||
|
||||
const handleClick = () => {
|
||||
// close the popover
|
||||
if (onClose) {
|
||||
onClose();
|
||||
}
|
||||
createCaseFlyout.open();
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
|
@ -40,7 +56,7 @@ const AddToNewCaseButtonComponent: React.FC<AddToNewCaseButtonProps> = ({
|
|||
<EuiContextMenuItem
|
||||
aria-label={ariaLabel}
|
||||
data-test-subj="add-new-case-item"
|
||||
onClick={addNewCaseClick}
|
||||
onClick={handleClick}
|
||||
// needs forced size="s" since it is lazy loaded and the EuiContextMenuPanel can not initialize the size
|
||||
size="s"
|
||||
disabled={isDisabled}
|
||||
|
|
|
@ -9,14 +9,14 @@ import { useState, useCallback, useMemo, SyntheticEvent } from 'react';
|
|||
import { useDispatch } from 'react-redux';
|
||||
import { ALERT_RULE_NAME, ALERT_RULE_UUID } from '@kbn/rule-data-utils';
|
||||
import { useKibana } from '../../../../../src/plugins/kibana_react/public';
|
||||
import { Case } from '../../../cases/common';
|
||||
import { Case, CommentType } from '../../../cases/common';
|
||||
import { TimelinesStartServices } from '../types';
|
||||
import { TimelineItem } from '../../common/search_strategy';
|
||||
import { tGridActions } from '../store/t_grid';
|
||||
import { useDeepEqualSelector } from './use_selector';
|
||||
import { createUpdateSuccessToaster } from '../components/actions/timeline/cases/helpers';
|
||||
import { AddToCaseActionProps } from '../components/actions';
|
||||
import { CasesDeepLinkId, generateCaseViewPath } from '../../../cases/public';
|
||||
import { CaseAttachments, CasesDeepLinkId, generateCaseViewPath } from '../../../cases/public';
|
||||
|
||||
interface UseAddToCase {
|
||||
addNewCaseClick: () => void;
|
||||
|
@ -32,6 +32,7 @@ interface UseAddToCase {
|
|||
closePopover: () => void;
|
||||
isPopoverOpen: boolean;
|
||||
isCreateCaseFlyoutOpen: boolean;
|
||||
caseAttachments?: CaseAttachments;
|
||||
}
|
||||
|
||||
export const useAddToCase = ({
|
||||
|
@ -39,6 +40,7 @@ export const useAddToCase = ({
|
|||
casePermissions,
|
||||
appId,
|
||||
onClose,
|
||||
owner,
|
||||
}: AddToCaseActionProps): UseAddToCase => {
|
||||
const eventId = event?.ecs._id ?? '';
|
||||
const dispatch = useDispatch();
|
||||
|
@ -109,6 +111,23 @@ export const useAddToCase = ({
|
|||
},
|
||||
[onViewCaseClick, toasts, dispatch, eventId]
|
||||
);
|
||||
const caseAttachments: CaseAttachments = useMemo(() => {
|
||||
const eventIndex = event?.ecs._index ?? '';
|
||||
const { ruleId, ruleName } = normalizedEventFields(event);
|
||||
const attachments = [
|
||||
{
|
||||
alertId: eventId,
|
||||
index: eventIndex ?? '',
|
||||
rule: {
|
||||
id: ruleId,
|
||||
name: ruleName,
|
||||
},
|
||||
owner,
|
||||
type: CommentType.alert as const,
|
||||
},
|
||||
];
|
||||
return attachments;
|
||||
}, [event, eventId, owner]);
|
||||
|
||||
const onCaseClicked = useCallback(
|
||||
(theCase?: Case) => {
|
||||
|
@ -140,6 +159,7 @@ export const useAddToCase = ({
|
|||
}
|
||||
}, [onClose, closePopover, dispatch, eventId]);
|
||||
return {
|
||||
caseAttachments,
|
||||
addNewCaseClick,
|
||||
addExistingCaseClick,
|
||||
onCaseClicked,
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue