[Lens] Fix open custom ranges saved issue (#78915)
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
parent
6364c14ffd
commit
d679624532
3 changed files with 57 additions and 8 deletions
|
@ -132,11 +132,11 @@ export const RangePopover = ({
|
||||||
</EuiFlexItem>
|
</EuiFlexItem>
|
||||||
<EuiFlexItem>
|
<EuiFlexItem>
|
||||||
<EuiFieldNumber
|
<EuiFieldNumber
|
||||||
value={isFinite(to) ? Number(to) : ''}
|
value={isValidNumber(to) ? Number(to) : ''}
|
||||||
onChange={({ target }) => {
|
onChange={({ target }) => {
|
||||||
const newRange = {
|
const newRange = {
|
||||||
...tempRange,
|
...tempRange,
|
||||||
to: target.value !== '' ? Number(target.value) : -Infinity,
|
to: target.value !== '' ? Number(target.value) : Infinity,
|
||||||
};
|
};
|
||||||
setTempRange(newRange);
|
setTempRange(newRange);
|
||||||
saveRangeAndReset(newRange);
|
saveRangeAndReset(newRange);
|
||||||
|
|
|
@ -485,7 +485,7 @@ describe('ranges', () => {
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
|
||||||
// This series of act clojures are made to make it work properly the update flush
|
// This series of act closures are made to make it work properly the update flush
|
||||||
act(() => {
|
act(() => {
|
||||||
instance.find(RangePopover).find(EuiLink).prop('onClick')!({} as ReactMouseEvent);
|
instance.find(RangePopover).find(EuiLink).prop('onClick')!({} as ReactMouseEvent);
|
||||||
});
|
});
|
||||||
|
@ -550,6 +550,46 @@ describe('ranges', () => {
|
||||||
expect(instance.find(RangePopover)).toHaveLength(1);
|
expect(instance.find(RangePopover)).toHaveLength(1);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should handle correctly open ranges when saved', () => {
|
||||||
|
const setStateSpy = jest.fn();
|
||||||
|
|
||||||
|
// Add an extra open range:
|
||||||
|
(state.layers.first.columns.col1 as RangeIndexPatternColumn).params.ranges.push({
|
||||||
|
from: null,
|
||||||
|
to: null,
|
||||||
|
label: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
const instance = mount(
|
||||||
|
<InlineOptions
|
||||||
|
{...defaultOptions}
|
||||||
|
state={state}
|
||||||
|
setState={setStateSpy}
|
||||||
|
columnId="col1"
|
||||||
|
currentColumn={state.layers.first.columns.col1 as RangeIndexPatternColumn}
|
||||||
|
layerId="first"
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
|
||||||
|
act(() => {
|
||||||
|
instance.find(RangePopover).last().find(EuiLink).prop('onClick')!({} as ReactMouseEvent);
|
||||||
|
});
|
||||||
|
|
||||||
|
act(() => {
|
||||||
|
// need another wrapping for this in order to work
|
||||||
|
instance.update();
|
||||||
|
|
||||||
|
// Check UI values for open ranges
|
||||||
|
expect(
|
||||||
|
instance.find(RangePopover).last().find(EuiFieldNumber).first().prop('value')
|
||||||
|
).toBe('');
|
||||||
|
|
||||||
|
expect(instance.find(RangePopover).last().find(EuiFieldNumber).last().prop('value')).toBe(
|
||||||
|
''
|
||||||
|
);
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -16,7 +16,13 @@ import { updateColumnParam, changeColumn } from '../../../state_helpers';
|
||||||
import { MODES, AUTO_BARS, DEFAULT_INTERVAL, MIN_HISTOGRAM_BARS, SLICES } from './constants';
|
import { MODES, AUTO_BARS, DEFAULT_INTERVAL, MIN_HISTOGRAM_BARS, SLICES } from './constants';
|
||||||
|
|
||||||
type RangeType = Omit<Range, 'type'>;
|
type RangeType = Omit<Range, 'type'>;
|
||||||
export type RangeTypeLens = RangeType & { label: string };
|
// Try to cover all possible serialized states for ranges
|
||||||
|
export type RangeTypeLens = (RangeType | { from: Range['from'] | null; to: Range['to'] | null }) & {
|
||||||
|
label: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
// This is a subset of RangeTypeLens which has both from and to defined
|
||||||
|
type FullRangeTypeLens = Extract<RangeTypeLens, NonNullable<RangeType>>;
|
||||||
|
|
||||||
export type MODES_TYPES = typeof MODES[keyof typeof MODES];
|
export type MODES_TYPES = typeof MODES[keyof typeof MODES];
|
||||||
|
|
||||||
|
@ -35,10 +41,13 @@ export type UpdateParamsFnType = <K extends keyof RangeColumnParams>(
|
||||||
value: RangeColumnParams[K]
|
value: RangeColumnParams[K]
|
||||||
) => void;
|
) => void;
|
||||||
|
|
||||||
export const isValidNumber = (value: number | '') =>
|
// on initialization values can be null (from the Infinity serialization), so handle it correctly
|
||||||
value !== '' && !isNaN(value) && isFinite(value);
|
// or they will be casted to 0 by the editor ( see #78867 )
|
||||||
export const isRangeWithin = (range: RangeTypeLens): boolean => range.from <= range.to;
|
export const isValidNumber = (value: number | '' | null): value is number =>
|
||||||
const isFullRange = ({ from, to }: RangeType) => isValidNumber(from) && isValidNumber(to);
|
value != null && value !== '' && !isNaN(value) && isFinite(value);
|
||||||
|
export const isRangeWithin = (range: RangeType): boolean => range.from <= range.to;
|
||||||
|
const isFullRange = (range: RangeTypeLens): range is FullRangeTypeLens =>
|
||||||
|
isValidNumber(range.from) && isValidNumber(range.to);
|
||||||
export const isValidRange = (range: RangeTypeLens): boolean => {
|
export const isValidRange = (range: RangeTypeLens): boolean => {
|
||||||
if (isFullRange(range)) {
|
if (isFullRange(range)) {
|
||||||
return isRangeWithin(range);
|
return isRangeWithin(range);
|
||||||
|
|
Loading…
Reference in a new issue