Collapse alert chart previews by default (#77479)

This commit is contained in:
Alejandro Fernández Gómez 2020-09-16 11:30:51 +02:00 committed by GitHub
parent b162cca68d
commit 3c555e2ca2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 30 additions and 15 deletions

View file

@ -5,7 +5,7 @@
*/ */
import React from 'react'; import React from 'react';
import { EuiFlexItem, EuiFlexGroup } from '@elastic/eui'; import { EuiFlexItem, EuiFlexGroup, EuiAccordion } from '@elastic/eui';
import { IFieldType } from 'src/plugins/data/public'; import { IFieldType } from 'src/plugins/data/public';
// eslint-disable-next-line @kbn/eslint/no-restricted-paths // eslint-disable-next-line @kbn/eslint/no-restricted-paths
import { IErrorObject } from '../../../../../../triggers_actions_ui/public/types'; import { IErrorObject } from '../../../../../../triggers_actions_ui/public/types';
@ -44,23 +44,29 @@ export const Criteria: React.FC<Props> = ({
<EuiFlexItem grow> <EuiFlexItem grow>
{criteria.map((criterion, idx) => { {criteria.map((criterion, idx) => {
return ( return (
<React.Fragment key={idx}> <EuiAccordion
<Criterion id={`criterion-${idx}`}
idx={idx} buttonContent={
fields={fields} <Criterion
criterion={criterion} idx={idx}
updateCriterion={updateCriterion} fields={fields}
removeCriterion={removeCriterion} criterion={criterion}
canDelete={criteria.length > 1} updateCriterion={updateCriterion}
errors={errors[idx.toString()] as IErrorObject} removeCriterion={removeCriterion}
/> canDelete={criteria.length > 1}
errors={errors[idx.toString()] as IErrorObject}
/>
}
key={idx}
arrowDisplay="right"
>
<CriterionPreview <CriterionPreview
alertParams={alertParams} alertParams={alertParams}
context={context} context={context}
chartCriterion={criterion} chartCriterion={criterion}
sourceId={sourceId} sourceId={sourceId}
/> />
</React.Fragment> </EuiAccordion>
); );
})} })}
</EuiFlexItem> </EuiFlexItem>

View file

@ -162,7 +162,10 @@ export const Criterion: React.FC<Props> = ({
value={criterion.field} value={criterion.field}
isActive={isFieldPopoverOpen} isActive={isFieldPopoverOpen}
color={errors.field.length === 0 ? 'secondary' : 'danger'} color={errors.field.length === 0 ? 'secondary' : 'danger'}
onClick={() => setIsFieldPopoverOpen(true)} onClick={(e) => {
e.stopPropagation();
setIsFieldPopoverOpen(true);
}}
/> />
} }
isOpen={isFieldPopoverOpen} isOpen={isFieldPopoverOpen}
@ -202,7 +205,10 @@ export const Criterion: React.FC<Props> = ({
? 'secondary' ? 'secondary'
: 'danger' : 'danger'
} }
onClick={() => setIsComparatorPopoverOpen(true)} onClick={(e) => {
e.stopPropagation();
setIsComparatorPopoverOpen(true);
}}
/> />
} }
isOpen={isComparatorPopoverOpen} isOpen={isComparatorPopoverOpen}
@ -260,7 +266,10 @@ export const Criterion: React.FC<Props> = ({
})} })}
color={'danger'} color={'danger'}
iconType={'trash'} iconType={'trash'}
onClick={() => removeCriterion(idx)} onClick={(e: React.MouseEvent) => {
e.stopPropagation();
removeCriterion(idx);
}}
/> />
</EuiFlexItem> </EuiFlexItem>
)} )}