expand already open trays on page re-load

fixes elastic/security-team/issues/6603
elastic · May 17, 2023 · d777167 · d777167
1 parent cf8dbfc
commit d777167
Showing 1 changed file with 23 additions and 11 deletions.
diff --git a/...lic/management/components/endpoint_response_actions_list/components/actions_log_table.tsx b/...lic/management/components/endpoint_response_actions_list/components/actions_log_table.tsx
@@ -19,6 +19,7 @@ import {
   EuiToolTip,
   type HorizontalAlignment,
   type CriteriaWithPagination,
+  EuiSkeletonText,
 } from '@elastic/eui';
 import { euiStyled } from '@kbn/kibana-react-plugin/common';
 import { FormattedMessage } from '@kbn/i18n-react';
@@ -323,20 +324,31 @@ export const ActionsLogTable = memo<ActionsLogTableProps>(
       }
     }, [actionIdsWithOpenTrays, dataTestSubj, items]);
 
-    const [expandedRowMap, setExpandedRowMap] = useState<ExpandedRowMapType>(
-      actionIdsWithOpenTrays.length && items.length
-        ? actionIdsWithOpenTrays.reduce<ExpandedRowMapType>((initialExpandedRowMap, actionId) => {
-            const actionItem = items.filter((item) => item.id === actionId)[0];
-            initialExpandedRowMap[actionId] = (
-              <ActionsLogExpandedTray action={actionItem} data-test-subj={dataTestSubj} />
-            );
-            return initialExpandedRowMap;
-          }, {})
-        : {}
-    );
+    const [expandedRowMap, setExpandedRowMap] = useState<ExpandedRowMapType>({});
 
     const allActionIdsOnPage = useMemo(() => items.map((item) => item.id), [items]);
 
+    // open trays that were open on the history page with URL params
+    useEffect(() => {
+      if (actionIdsWithOpenTrays.length && items.length) {
+        const initialOpenDetails = actionIdsWithOpenTrays.reduce<ExpandedRowMapType>(
+          (initialExpandedRowMap, actionId) => {
+            const actionItem = items.find((item) => item.id === actionId);
+            if (!actionItem) {
+              initialExpandedRowMap[actionId] = <EuiSkeletonText size="relative" lines={8} />;
+            } else {
+              initialExpandedRowMap[actionId] = (
+                <ActionsLogExpandedTray action={actionItem} data-test-subj={dataTestSubj} />
+              );
+            }
+            return initialExpandedRowMap;
+          },
+          {}
+        );
+        setExpandedRowMap(initialOpenDetails);
+      }
+    }, [actionIdsWithOpenTrays, dataTestSubj, items]);
+
     // open trays that were open using URL params/ query params
     useEffect(() => {
       if (actionIdsWithOpenTrays.every((actionId) => allActionIdsOnPage.includes(actionId))) {