Skip to content

Commit

Permalink
[8.x] [Security Solution][Document Flyout] Update footer with proper …
Browse files Browse the repository at this point in the history 
…background color (elastic#197524) (elastic#197549)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[Security Solution][Document Flyout] Update footer with proper
background color
(elastic#197524)](elastic#197524)

<!--- Backport version: 9.4.3 -->

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

<!--BACKPORT
[{"author":{"name":"christineweng","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-10-23T23:48:57Z","message":"[Security
Solution][Document Flyout] Update footer with proper background color
(elastic#197524)\n\n## Summary\r\n\r\nFix a small UI bug where the alert flyout
footer is missing background\r\ncolor (currently the background is
white).\r\n\r\n\r\n![image](https://github.com/user-attachments/assets/a049d3cd-ca52-460e-b671-1414e11c2dd1)","sha":"19fa5fda1b38aa854f9c4259b71da888dd25f52f","branchLabelMapping":{"^v9.0.0$":"main","^v8.17.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["backport","release_note:skip","v9.0.0","Team:Threat
Hunting","Team:Threat
Hunting:Investigations","v8.16.0","v8.17.0"],"title":"[Security
Solution][Document Flyout] Update footer with proper background
color","number":197524,"url":"https://github.com/elastic/kibana/pull/197524","mergeCommit":{"message":"[Security
Solution][Document Flyout] Update footer with proper background color
(elastic#197524)\n\n## Summary\r\n\r\nFix a small UI bug where the alert flyout
footer is missing background\r\ncolor (currently the background is
white).\r\n\r\n\r\n![image](https://github.com/user-attachments/assets/a049d3cd-ca52-460e-b671-1414e11c2dd1)","sha":"19fa5fda1b38aa854f9c4259b71da888dd25f52f"}},"sourceBranch":"main","suggestedTargetBranches":["8.16","8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/197524","number":197524,"mergeCommit":{"message":"[Security
Solution][Document Flyout] Update footer with proper background color
(elastic#197524)\n\n## Summary\r\n\r\nFix a small UI bug where the alert flyout
footer is missing background\r\ncolor (currently the background is
white).\r\n\r\n\r\n![image](https://github.com/user-attachments/assets/a049d3cd-ca52-460e-b671-1414e11c2dd1)","sha":"19fa5fda1b38aa854f9c4259b71da888dd25f52f"}},{"branch":"8.16","label":"v8.16.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"8.x","label":"v8.17.0","branchLabelMappingKey":"^v8.17.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: christineweng <[email protected]>
  • Loading branch information
@kibanamachine @christineweng
kibanamachine and christineweng authored Oct 24, 2024
1 parent e2001ca commit 19590f9
Showing 1 changed file with 24 additions and 28 deletions.
52 changes: 24 additions & 28 deletions x-pack/plugins/security_solution/public/flyout/document_details/right/footer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,7 @@
import type { FC } from 'react';
import React, { useCallback, useMemo, useState } from 'react';
import { useExpandableFlyoutApi } from '@kbn/expandable-flyout';
import styled from 'styled-components';
import { euiThemeVars } from '@kbn/ui-theme';
import { EuiFlexGroup, EuiFlexItem, useEuiTheme } from '@elastic/eui';
import { EuiFlexGroup, EuiFlexItem, useEuiTheme, EuiFlyoutFooter, EuiPanel } from '@elastic/eui';
import { find } from 'lodash/fp';
import { FLYOUT_FOOTER_TEST_ID } from './test_ids';
import type { Status } from '../../../../common/api/detection_engine';
Expand All @@ -27,10 +25,6 @@ import { useExceptionFlyout } from '../../../detections/components/alerts_table/
import { isActiveTimeline } from '../../../helpers';
import { useEventFilterModal } from '../../../detections/components/alerts_table/timeline_actions/use_event_filter_modal';

const StyledEuiFlyoutFooter = styled('div')`
padding: ${euiThemeVars.euiPanelPaddingModifiers.paddingMedium};
`;

interface AlertSummaryData {
/**
* Status of the alert (open, closed...)
Expand Down Expand Up @@ -182,27 +176,29 @@ export const PanelFooter: FC<PanelFooterProps> = ({ isPreview }) => {

return (
<>
<StyledEuiFlyoutFooter data-test-subj={FLYOUT_FOOTER_TEST_ID}>
<EuiFlexGroup justifyContent="flexEnd">
<EuiFlexItem grow={false}>
{dataAsNestedObject && (
<TakeActionDropdown
dataFormattedForFieldBrowser={dataFormattedForFieldBrowser}
dataAsNestedObject={dataAsNestedObject}
handleOnEventClosed={closeFlyout}
isHostIsolationPanelOpen={isHostIsolationPanelOpen}
onAddEventFilterClick={onAddEventFilterClick}
onAddExceptionTypeClick={onAddExceptionTypeClick}
onAddIsolationStatusClick={showHostIsolationPanelCallback}
refetchFlyoutData={refetchFlyoutData}
refetch={refetchAll}
scopeId={scopeId}
onOsqueryClick={setOsqueryFlyoutOpenWithAgentId}
/>
)}
</EuiFlexItem>
</EuiFlexGroup>
</StyledEuiFlyoutFooter>
<EuiFlyoutFooter data-test-subj={FLYOUT_FOOTER_TEST_ID}>
<EuiPanel color="transparent">
<EuiFlexGroup justifyContent="flexEnd">
<EuiFlexItem grow={false}>
{dataAsNestedObject && (
<TakeActionDropdown
dataFormattedForFieldBrowser={dataFormattedForFieldBrowser}
dataAsNestedObject={dataAsNestedObject}
handleOnEventClosed={closeFlyout}
isHostIsolationPanelOpen={isHostIsolationPanelOpen}
onAddEventFilterClick={onAddEventFilterClick}
onAddExceptionTypeClick={onAddExceptionTypeClick}
onAddIsolationStatusClick={showHostIsolationPanelCallback}
refetchFlyoutData={refetchFlyoutData}
refetch={refetchAll}
scopeId={scopeId}
onOsqueryClick={setOsqueryFlyoutOpenWithAgentId}
/>
)}
</EuiFlexItem>
</EuiFlexGroup>
</EuiPanel>
</EuiFlyoutFooter>

{openAddExceptionFlyout &&
alertSummaryData.ruleId != null &&
Expand Down

0 comments on commit 19590f9

Please sign in to comment.