github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 09:19:04 -04:00
Code Issues Projects Releases Packages Wiki Activity

[8.6] [Security Solution] Visualisation actions button is overlap on to the bar chart (#145973) (#146106)

Browse source 
# Backport

This will backport the following commits from `main` to `8.6`:
- [[Security Solution] Visualisation actions button is overlap on to the
bar chart (#145973)](https://github.com/elastic/kibana/pull/145973)

<!--- Backport version: 8.9.7 -->

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

<!--BACKPORT [{"author":{"name":"Angela
Chuang","email":"6295984+angorayc@users.noreply.github.com"},"sourceCommit":{"committedDate":"2022-11-23T09:27:58Z","message":"[Security
Solution] Visualisation actions button is overlap on to the bar chart
(#145973)\n\n## Summary\r\n\r\nOriginal issue: Visualisation actions
button is overlap on to the
bar\r\nchart.\r\nhttps://github.com/elastic/kibana/issues/128344\r\n\r\nBefore:\r\n<img
width=\"575\" alt=\"Screenshot 2022-11-22 at 11 31
19\"\r\nsrc=\"https://user-images.githubusercontent.com/6295984/203304147-ff0ec823-182c-40bf-8da5-fa45180eae0a.png\">\r\n\r\nAfter:\r\n<img
width=\"765\" alt=\"Screenshot 2022-11-22 at 11 30
39\"\r\nsrc=\"https://user-images.githubusercontent.com/6295984/203304150-5dae9a4a-341d-4717-abb1-f56aa20ba6bd.png\">","sha":"a0658669f29ed508c87b79d678f21695591fca89","branchLabelMapping":{"^v8.7.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["bug","release_note:skip","Team:Threat
Hunting","Team:Threat
Hunting:Explore","v8.6.0","v8.7.0"],"number":145973,"url":"https://github.com/elastic/kibana/pull/145973","mergeCommit":{"message":"[Security
Solution] Visualisation actions button is overlap on to the bar chart
(#145973)\n\n## Summary\r\n\r\nOriginal issue: Visualisation actions
button is overlap on to the
bar\r\nchart.\r\nhttps://github.com/elastic/kibana/issues/128344\r\n\r\nBefore:\r\n<img
width=\"575\" alt=\"Screenshot 2022-11-22 at 11 31
19\"\r\nsrc=\"https://user-images.githubusercontent.com/6295984/203304147-ff0ec823-182c-40bf-8da5-fa45180eae0a.png\">\r\n\r\nAfter:\r\n<img
width=\"765\" alt=\"Screenshot 2022-11-22 at 11 30
39\"\r\nsrc=\"https://user-images.githubusercontent.com/6295984/203304150-5dae9a4a-341d-4717-abb1-f56aa20ba6bd.png\">","sha":"a0658669f29ed508c87b79d678f21695591fca89"}},"sourceBranch":"main","suggestedTargetBranches":["8.6"],"targetPullRequestStates":[{"branch":"8.6","label":"v8.6.0","labelRegex":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v8.7.0","labelRegex":"^v8.7.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/145973","number":145973,"mergeCommit":{"message":"[Security
Solution] Visualisation actions button is overlap on to the bar chart
(#145973)\n\n## Summary\r\n\r\nOriginal issue: Visualisation actions
button is overlap on to the
bar\r\nchart.\r\nhttps://github.com/elastic/kibana/issues/128344\r\n\r\nBefore:\r\n<img
width=\"575\" alt=\"Screenshot 2022-11-22 at 11 31
19\"\r\nsrc=\"https://user-images.githubusercontent.com/6295984/203304147-ff0ec823-182c-40bf-8da5-fa45180eae0a.png\">\r\n\r\nAfter:\r\n<img
width=\"765\" alt=\"Screenshot 2022-11-22 at 11 30
39\"\r\nsrc=\"https://user-images.githubusercontent.com/6295984/203304150-5dae9a4a-341d-4717-abb1-f56aa20ba6bd.png\">","sha":"a0658669f29ed508c87b79d678f21695591fca89"}}]}]
BACKPORT-->

Co-authored-by: Angela Chuang <6295984+angorayc@users.noreply.github.com>
This commit is contained in:
Kibana Machine 2022-11-23 05:54:45 -05:00 • committed by GitHub
parent 1e89fbe536
commit f776764cfb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

6
x-pack/plugins/security_solution/public/common/components/charts/barchart.tsx
View file

@ -30,7 +30,7 @@ import {
WrappedByAutoSizer,
useTheme,
Wrapper,
ChartWrapper,
BarChartWrapper,
} from './common';
import { DraggableLegend } from './draggable_legend';
import type { LegendItem } from './draggable_legend_item';
@ -209,7 +209,7 @@ export const BarChartComponent: React.FC<BarChartComponentProps> = ({
<Wrapper>
<HoverVisibilityContainer targetClassNames={[HISTOGRAM_ACTIONS_BUTTON_CLASS]}>
{isValidSeriesExist && barChart && (
<ChartWrapper gutterSize="none">
<BarChartWrapper gutterSize="none">
<EuiFlexItem grow={true}>
<WrappedByAutoSizer ref={measureRef} height={chartHeight}>
<BarChartBase
@ -226,7 +226,7 @@ export const BarChartComponent: React.FC<BarChartComponentProps> = ({
<LegendFlexItem grow={false}>
<DraggableLegend legendItems={legendItems} height={height} />
</LegendFlexItem>
</ChartWrapper>
</BarChartWrapper>
)}
{!isValidSeriesExist && (
<ChartPlaceHolder height={chartHeight} width={chartWidth} data={barChart} />

5
x-pack/plugins/security_solution/public/common/components/charts/common.tsx
View file

@ -154,3 +154,8 @@ export const Wrapper = styled.div`
export const ChartWrapper = styled(EuiFlexGroup)`
z-index: 0;
`;
export const BarChartWrapper = styled(EuiFlexGroup)`
z-index: 0;
padding-right: 20px;
`;