[APM] Trace timeline: Multi-fold function doesn't update when all acc…

…ordions are collapsed or expanded (#76899) * update outside state when expanding or collapsing the entry transaction * reverting icons
elastic · Sep 8, 2020 · dc28e0e · dc28e0e
1 parent 2f1c012
commit dc28e0e
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/...sactionDetails/WaterfallWithSummmary/WaterfallContainer/Waterfall/accordion_waterfall.tsx b/...sactionDetails/WaterfallWithSummmary/WaterfallContainer/Waterfall/accordion_waterfall.tsx
@@ -25,9 +25,7 @@ interface AccordionWaterfallProps {
   location: Location;
   errorsPerTransaction: IWaterfall['errorsPerTransaction'];
   childrenByParentId: Record<string, IWaterfallItem[]>;
-  onToggleEntryTransaction?: (
-    nextState: EuiAccordionProps['forceState']
-  ) => void;
+  onToggleEntryTransaction?: () => void;
   timelineMargins: Margins;
   onClickWaterfallItem: (item: IWaterfallItem) => void;
 }
@@ -106,6 +104,7 @@ export function AccordionWaterfall(props: AccordionWaterfallProps) {
     errorsPerTransaction,
     timelineMargins,
     onClickWaterfallItem,
+    onToggleEntryTransaction,
   } = props;
 
   const nextLevel = level + 1;
@@ -147,7 +146,12 @@ export function AccordionWaterfall(props: AccordionWaterfallProps) {
       arrowDisplay={isEmpty(children) ? 'none' : 'left'}
       initialIsOpen={true}
       forceState={isOpen ? 'open' : 'closed'}
-      onToggle={() => setIsOpen((isCurrentOpen) => !isCurrentOpen)}
+      onToggle={() => {
+        setIsOpen((isCurrentOpen) => !isCurrentOpen);
+        if (onToggleEntryTransaction) {
+          onToggleEntryTransaction();
+        }
+      }}
     >
       {children.map((child) => (
         <AccordionWaterfall

diff --git a/...nents/app/TransactionDetails/WaterfallWithSummmary/WaterfallContainer/Waterfall/index.tsx b/...nents/app/TransactionDetails/WaterfallWithSummmary/WaterfallContainer/Waterfall/index.tsx
@@ -109,6 +109,7 @@ export function Waterfall({
         onClickWaterfallItem={(item: IWaterfallItem) =>
           toggleFlyout({ history, item, location })
         }
+        onToggleEntryTransaction={() => setIsAccordionOpen((isOpen) => !isOpen)}
       />
     );
   }
-Original file line number
+Diff line change
@@ Expand Up / @@ -109,6 +109,7 @@ export function Waterfall({ @@
             onClickWaterfallItem={(item: IWaterfallItem) =>
               toggleFlyout({ history, item, location })
             }
+            onToggleEntryTransaction={() => setIsAccordionOpen((isOpen) => !isOpen)}
           />
         );
       }
@@ Expand Down @@