[EDR Workflows] [Osquery] Fix Osquery flyout z-index issue when used externally (#177694)

This commit is contained in:
Tomasz Ciecierski 2024-02-25 23:19:13 +01:00 committed by GitHub
parent b4019a2e5c
commit 3cf9f562b2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 4 additions and 24 deletions

View file

@ -17,7 +17,6 @@ import {
containsDynamicQuery,
replaceParamsQuery,
} from '../../../common/utils/replace_params_query';
import { PLUGIN_NAME as OSQUERY_PLUGIN_NAME } from '../../../common';
import { QueryPackSelectable } from './query_pack_selectable';
import type { SavedQuerySOFormData } from '../../saved_queries/form/use_saved_query_form';
import { useKibana } from '../../common/lib/kibana';
@ -76,7 +75,7 @@ const LiveQueryFormComponent: React.FC<LiveQueryFormProps> = ({
}) => {
const alertAttachmentContext = useContext(AlertAttachmentContext);
const { application, appName } = useKibana().services;
const { application } = useKibana().services;
const permissions = application.capabilities.osquery;
const canRunPacks = useMemo(
() =>
@ -331,11 +330,7 @@ const LiveQueryFormComponent: React.FC<LiveQueryFormProps> = ({
</FormProvider>
{showSavedQueryFlyout ? (
<SavedQueryFlyout
isExternal={appName !== OSQUERY_PLUGIN_NAME}
onClose={handleCloseSaveQueryFlyout}
defaultValue={serializedData}
/>
<SavedQueryFlyout onClose={handleCloseSaveQueryFlyout} defaultValue={serializedData} />
) : null}
</>
);

View file

@ -26,17 +26,10 @@ interface QueryDetailsFlyoutProps {
};
onClose: () => void;
}
const additionalZIndexStyle = { style: 'z-index: 6000' };
const QueryDetailsFlyoutComponent: React.FC<QueryDetailsFlyoutProps> = ({ action, onClose }) => (
<EuiPortal>
<EuiFlyout
size="m"
ownFocus
onClose={onClose}
aria-labelledby="flyoutTitle"
maskProps={additionalZIndexStyle} // For an edge case to display above the alerts flyout
>
<EuiFlyout size="m" ownFocus onClose={onClose} aria-labelledby="flyoutTitle">
<EuiFlyoutHeader hasBorder>
<EuiTitle size="s">
<h2 id="flyoutTitle">

View file

@ -30,16 +30,9 @@ import { useCreateSavedQuery } from './use_create_saved_query';
interface AddQueryFlyoutProps {
defaultValue: SavedQuerySOFormData;
onClose: () => void;
isExternal?: boolean;
}
const additionalZIndexStyle = { style: 'z-index: 6000' };
const SavedQueryFlyoutComponent: React.FC<AddQueryFlyoutProps> = ({
defaultValue,
onClose,
isExternal,
}) => {
const SavedQueryFlyoutComponent: React.FC<AddQueryFlyoutProps> = ({ defaultValue, onClose }) => {
const createSavedQueryMutation = useCreateSavedQuery({ withRedirect: false });
const hooksForm = useSavedQueryForm({
@ -67,7 +60,6 @@ const SavedQueryFlyoutComponent: React.FC<AddQueryFlyoutProps> = ({
ownFocus
onClose={onClose}
aria-labelledby="flyoutTitle"
maskProps={isExternal ? additionalZIndexStyle : undefined} // For an edge case to display above the alerts flyout
>
<EuiFlyoutHeader hasBorder>
<EuiTitle size="s">