[Metrics UI] Don't mount AlertFlyout and NodeContextPopover when they aren't visible (#99039)
This commit is contained in:
parent
fda2ad4575
commit
8426024f6e
|
@ -106,26 +106,32 @@ export class Node extends React.PureComponent<Props, State> {
|
|||
</NodeContainer>
|
||||
</ConditionalToolTip>
|
||||
</NodeContextMenu>
|
||||
<NodeContextPopover
|
||||
openAlertFlyout={this.openAlertFlyout}
|
||||
node={node}
|
||||
nodeType={nodeType}
|
||||
isOpen={this.state.isOverlayOpen}
|
||||
options={options}
|
||||
currentTime={currentTime}
|
||||
onClose={this.toggleNewOverlay}
|
||||
/>
|
||||
<AlertFlyout
|
||||
filter={
|
||||
options.fields
|
||||
? `${findInventoryFields(nodeType, options.fields).id}: "${node.id}"`
|
||||
: ''
|
||||
}
|
||||
options={options}
|
||||
nodeType={nodeType}
|
||||
setVisible={this.setAlertFlyoutVisible}
|
||||
visible={isAlertFlyoutVisible}
|
||||
/>
|
||||
|
||||
{this.state.isOverlayOpen && (
|
||||
<NodeContextPopover
|
||||
openAlertFlyout={this.openAlertFlyout}
|
||||
node={node}
|
||||
nodeType={nodeType}
|
||||
isOpen={this.state.isOverlayOpen}
|
||||
options={options}
|
||||
currentTime={currentTime}
|
||||
onClose={this.toggleNewOverlay}
|
||||
/>
|
||||
)}
|
||||
|
||||
{isAlertFlyoutVisible && (
|
||||
<AlertFlyout
|
||||
filter={
|
||||
options.fields
|
||||
? `${findInventoryFields(nodeType, options.fields).id}: "${node.id}"`
|
||||
: ''
|
||||
}
|
||||
options={options}
|
||||
nodeType={nodeType}
|
||||
setVisible={this.setAlertFlyoutVisible}
|
||||
visible={isAlertFlyoutVisible}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -201,17 +201,19 @@ export const NodeContextMenu: React.FC<Props & { theme?: EuiTheme }> = withTheme
|
|||
</Section>
|
||||
</div>
|
||||
</ActionMenu>
|
||||
<AlertFlyout
|
||||
filter={
|
||||
options.fields
|
||||
? `${findInventoryFields(nodeType, options.fields).id}: "${node.id}"`
|
||||
: ''
|
||||
}
|
||||
options={options}
|
||||
nodeType={nodeType}
|
||||
setVisible={setFlyoutVisible}
|
||||
visible={flyoutVisible}
|
||||
/>
|
||||
{flyoutVisible && (
|
||||
<AlertFlyout
|
||||
filter={
|
||||
options.fields
|
||||
? `${findInventoryFields(nodeType, options.fields).id}: "${node.id}"`
|
||||
: ''
|
||||
}
|
||||
options={options}
|
||||
nodeType={nodeType}
|
||||
setVisible={setFlyoutVisible}
|
||||
visible={flyoutVisible}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue