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

Fix indentation in trace waterfall (#122342) (#122359)

Browse source 
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

Co-authored-by: Miriam <31922082+MiriamAparicio@users.noreply.github.com>
This commit is contained in:
Kibana Machine 2022-01-05 13:03:31 -05:00 • committed by GitHub
parent 9b395a8a42
commit d225eadf3a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

5
x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/accordion_waterfall.tsx
View file

@ -102,6 +102,8 @@ export function AccordionWaterfall(props: AccordionWaterfallProps) {
setIsOpen((isCurrentOpen) => !isCurrentOpen);
}
const hasToggle = !!children.length;
return (
<StyledAccordion
className="waterfall_accordion"
@ -117,7 +119,7 @@ export function AccordionWaterfall(props: AccordionWaterfallProps) {
<EuiFlexGroup gutterSize="none">
<EuiFlexItem grow={false}>
<ToggleAccordionButton
show={!!children.length}
show={hasToggle}
isOpen={isOpen}
childrenAmount={children.length}
onClick={toggleAccordion}
@ -129,6 +131,7 @@ export function AccordionWaterfall(props: AccordionWaterfallProps) {
timelineMargins={timelineMargins}
color={item.color}
item={item}
hasToggle={hasToggle}
totalDuration={duration}
isSelected={item.id === waterfallItemId}
errorCount={errorCount}

9
x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_item.tsx
View file

@ -30,6 +30,7 @@ interface IContainerStyleProps {
type: ItemType;
timelineMargins: Margins;
isSelected: boolean;
hasToggle: boolean;
}
interface IBarStyleProps {
@ -44,7 +45,10 @@ const Container = euiStyled.div<IContainerStyleProps>`
padding-top: ${({ theme }) => theme.eui.paddingSizes.s};
padding-bottom: ${({ theme }) => theme.eui.euiSizeM};
margin-right: ${(props) => props.timelineMargins.right}px;
margin-left: ${(props) => props.timelineMargins.left}px;
margin-left: ${(props) =>
props.hasToggle
? props.timelineMargins.left - 30 // fix margin if there is a toggle
: props.timelineMargins.left}px ;
background-color: ${({ isSelected, theme }) =>
isSelected ? theme.eui.euiColorLightestShade : 'initial'};
cursor: pointer;
@ -81,6 +85,7 @@ interface IWaterfallItemProps {
timelineMargins: Margins;
totalDuration?: number;
item: IWaterfallSpanOrTransaction;
hasToggle: boolean;
color: string;
isSelected: boolean;
errorCount: number;
@ -180,6 +185,7 @@ export function WaterfallItem({
timelineMargins,
totalDuration,
item,
hasToggle,
color,
isSelected,
errorCount,
@ -200,6 +206,7 @@ export function WaterfallItem({
type={item.docType}
timelineMargins={timelineMargins}
isSelected={isSelected}
hasToggle={hasToggle}
onClick={(e: React.MouseEvent) => {
e.stopPropagation();
onClick();