[Exploratory view] Render content only on expand (#114237)

This commit is contained in:
Shahzad 2021-10-12 16:46:23 +02:00 committed by GitHub
parent 0b46bb1b93
commit df971b7dc9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -5,7 +5,7 @@
* 2.0. * 2.0.
*/ */
import React from 'react'; import React, { useEffect, useState } from 'react';
import styled from 'styled-components'; import styled from 'styled-components';
import { i18n } from '@kbn/i18n'; import { i18n } from '@kbn/i18n';
import { EuiFlexItem, EuiFlexGroup, EuiPanel, EuiAccordion, EuiSpacer } from '@elastic/eui'; import { EuiFlexItem, EuiFlexGroup, EuiPanel, EuiAccordion, EuiSpacer } from '@elastic/eui';
@ -47,6 +47,14 @@ export function Series({ item, isExpanded, toggleExpanded }: Props) {
seriesId: id, seriesId: id,
}; };
const [isExapndedOnce, setIsExapndedOnce] = useState(false);
useEffect(() => {
if (isExpanded) {
setIsExapndedOnce(true);
}
}, [isExpanded]);
return ( return (
<EuiPanel hasBorder={true} data-test-subj={`exploratoryViewSeriesPanel${0}`}> <EuiPanel hasBorder={true} data-test-subj={`exploratoryViewSeriesPanel${0}`}>
<StyledAccordion <StyledAccordion
@ -91,7 +99,7 @@ export function Series({ item, isExpanded, toggleExpanded }: Props) {
> >
<EuiSpacer size="s" /> <EuiSpacer size="s" />
<EuiPanel color="subdued"> <EuiPanel color="subdued">
<ExpandedSeriesRow {...seriesProps} /> {isExapndedOnce && <ExpandedSeriesRow {...seriesProps} />}
</EuiPanel> </EuiPanel>
</StyledAccordion> </StyledAccordion>
</EuiPanel> </EuiPanel>