From a0b47cae8518ab18ffa3edaf48f5ce1386527ad2 Mon Sep 17 00:00:00 2001 From: Robert Austin Date: Wed, 8 Jul 2020 19:21:40 -0400 Subject: [PATCH] [Resolver] Remove `currentPanelView` selector (#71154) The `currentPanelView` selector returns a value that's out of sync with the component that uses it. --- .../public/resolver/store/actions.ts | 12 -------- .../public/resolver/store/reducer.ts | 6 ---- .../public/resolver/store/selectors.ts | 5 ---- .../public/resolver/store/ui/selectors.ts | 5 ---- .../public/resolver/types.ts | 4 --- .../public/resolver/view/panel.tsx | 29 ++++--------------- .../view/panels/panel_content_utilities.tsx | 7 +++-- 7 files changed, 11 insertions(+), 57 deletions(-) diff --git a/x-pack/plugins/security_solution/public/resolver/store/actions.ts b/x-pack/plugins/security_solution/public/resolver/store/actions.ts index 5292cbb6445dc..ac11ab8c88681 100644 --- a/x-pack/plugins/security_solution/public/resolver/store/actions.ts +++ b/x-pack/plugins/security_solution/public/resolver/store/actions.ts @@ -24,17 +24,6 @@ interface UserBroughtProcessIntoView { }; } -/** - * Dispatched to notify state that a different panel needs to be displayed - */ -interface AppDisplayedDifferentPanel { - readonly type: 'appDisplayedDifferentPanel'; - /** - * The name of the panel to display - */ - readonly payload: string; -} - /** * When an examination of query params in the UI indicates that state needs to * be updated to reflect the new selection @@ -130,5 +119,4 @@ export type ResolverAction = | UserRequestedRelatedEventData | UserSelectedRelatedEventCategory | AppDetectedNewIdFromQueryParams - | AppDisplayedDifferentPanel | AppDetectedMissingEventData; diff --git a/x-pack/plugins/security_solution/public/resolver/store/reducer.ts b/x-pack/plugins/security_solution/public/resolver/store/reducer.ts index 65e53eb28549f..fc4c4de5819f3 100644 --- a/x-pack/plugins/security_solution/public/resolver/store/reducer.ts +++ b/x-pack/plugins/security_solution/public/resolver/store/reducer.ts @@ -24,7 +24,6 @@ const uiReducer: Reducer = ( activeDescendantId: null, selectedDescendantId: null, processEntityIdOfSelectedDescendant: null, - panelToDisplay: null, }, action ) => { @@ -39,11 +38,6 @@ const uiReducer: Reducer = ( selectedDescendantId: action.payload.nodeId, processEntityIdOfSelectedDescendant: action.payload.selectedProcessId, }; - } else if (action.type === 'appDisplayedDifferentPanel') { - return { - ...uiState, - panelToDisplay: action.payload, - }; } else if ( action.type === 'userBroughtProcessIntoView' || action.type === 'appDetectedNewIdFromQueryParams' diff --git a/x-pack/plugins/security_solution/public/resolver/store/selectors.ts b/x-pack/plugins/security_solution/public/resolver/store/selectors.ts index e54193ab394a5..2bc254d118d33 100644 --- a/x-pack/plugins/security_solution/public/resolver/store/selectors.ts +++ b/x-pack/plugins/security_solution/public/resolver/store/selectors.ts @@ -127,11 +127,6 @@ export const uiSelectedDescendantProcessId = composeSelectors( uiSelectors.selectedDescendantProcessId ); -/** - * The current panel to display - */ -export const currentPanelView = composeSelectors(uiStateSelector, uiSelectors.currentPanelView); - /** * Returns the camera state from within ResolverState */ diff --git a/x-pack/plugins/security_solution/public/resolver/store/ui/selectors.ts b/x-pack/plugins/security_solution/public/resolver/store/ui/selectors.ts index bddc7d34abf1c..494d8884329c6 100644 --- a/x-pack/plugins/security_solution/public/resolver/store/ui/selectors.ts +++ b/x-pack/plugins/security_solution/public/resolver/store/ui/selectors.ts @@ -39,8 +39,3 @@ export const selectedDescendantProcessId = createSelector( return processEntityIdOfSelectedDescendant; } ); - -// Select the current panel to be displayed -export const currentPanelView = (uiState: ResolverUIState) => { - return uiState.panelToDisplay; -}; diff --git a/x-pack/plugins/security_solution/public/resolver/types.ts b/x-pack/plugins/security_solution/public/resolver/types.ts index 5dd9a944b88ea..2025762a0605c 100644 --- a/x-pack/plugins/security_solution/public/resolver/types.ts +++ b/x-pack/plugins/security_solution/public/resolver/types.ts @@ -45,10 +45,6 @@ export interface ResolverUIState { * The entity_id of the process for the resolver's currently selected descendant. */ readonly processEntityIdOfSelectedDescendant: string | null; - /** - * Which panel the ui should display - */ - readonly panelToDisplay: string | null; } /** diff --git a/x-pack/plugins/security_solution/public/resolver/view/panel.tsx b/x-pack/plugins/security_solution/public/resolver/view/panel.tsx index 009a6422127e0..f4fe4fe520c92 100644 --- a/x-pack/plugins/security_solution/public/resolver/view/panel.tsx +++ b/x-pack/plugins/security_solution/public/resolver/view/panel.tsx @@ -4,15 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { - memo, - useCallback, - useMemo, - useContext, - useLayoutEffect, - useState, - useEffect, -} from 'react'; +import React, { memo, useCallback, useMemo, useContext, useLayoutEffect, useState } from 'react'; import { useSelector } from 'react-redux'; import { useHistory, useLocation } from 'react-router-dom'; // eslint-disable-next-line import/no-nodejs-modules @@ -205,21 +197,12 @@ const PanelContent = memo(function PanelContent() { return 'processListWithCounts'; }, [uiSelectedEvent, crumbEvent, crumbId, graphableProcessEntityIds]); - useEffect(() => { - // dispatch `appDisplayedDifferentPanel` to sync state with which panel gets displayed - dispatch({ - type: 'appDisplayedDifferentPanel', - payload: panelToShow, - }); - }, [panelToShow, dispatch]); - - const currentPanelView = useSelector(selectors.currentPanelView); const terminatedProcesses = useSelector(selectors.terminatedProcesses); const processEntityId = uiSelectedEvent ? event.entityId(uiSelectedEvent) : undefined; const isProcessTerminated = processEntityId ? terminatedProcesses.has(processEntityId) : false; const panelInstance = useMemo(() => { - if (currentPanelView === 'processDetails') { + if (panelToShow === 'processDetails') { return ( sum + val, 0); @@ -278,7 +261,7 @@ const PanelContent = memo(function PanelContent() { crumbId, pushToQueryParams, relatedStatsForIdFromParams, - currentPanelView, + panelToShow, isProcessTerminated, ]); diff --git a/x-pack/plugins/security_solution/public/resolver/view/panels/panel_content_utilities.tsx b/x-pack/plugins/security_solution/public/resolver/view/panels/panel_content_utilities.tsx index 56f88ccb13115..517b847855647 100644 --- a/x-pack/plugins/security_solution/public/resolver/view/panels/panel_content_utilities.tsx +++ b/x-pack/plugins/security_solution/public/resolver/view/panels/panel_content_utilities.tsx @@ -82,10 +82,13 @@ const invalidDateText = i18n.translate( } ); /** - * @param {ConstructorParameters[0]} timestamp To be passed through Date->Intl.DateTimeFormat * @returns {string} A nicely formatted string for a date */ -export function formatDate(timestamp: ConstructorParameters[0]) { +export function formatDate( + /** To be passed through Date->Intl.DateTimeFormat */ timestamp: ConstructorParameters< + typeof Date + >[0] +): string { const date = new Date(timestamp); if (isFinite(date.getTime())) { return formatter.format(date);