Skip to content

Commit

Permalink
Fix TS for vislib
Browse files Browse the repository at this point in the history
  • Loading branch information
@maryia-lapata
maryia-lapata committed Feb 24, 2020
1 parent db0a9cc commit 41fccfd
Show file tree
Hide file tree
Showing 7 changed files with 80 additions and 83 deletions.
12 changes: 0 additions & 12 deletions .eslintrc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,18 +76,6 @@ module.exports = {
'react-hooks/exhaustive-deps': 'off',
},
},
{
files: ['src/legacy/core_plugins/vis_type_vislib/**/*.{js,ts,tsx}'],
rules: {
'react-hooks/exhaustive-deps': 'off',
},
},
{
files: ['src/legacy/core_plugins/vis_type_table/**/*.{js,ts,tsx}'],
rules: {
'react-hooks/exhaustive-deps': 'off',
},
},
{
files: [
'src/legacy/core_plugins/vis_default_editor/public/components/controls/**/*.{ts,tsx}',
Expand Down
2 changes: 1 addition & 1 deletion src/legacy/core_plugins/vis_type_vislib/public/components/common/validation_wrapper.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ function ValidationWrapper<T = unknown>({

useEffect(() => {
setValidity(isPanelValid);
}, [isPanelValid]);
}, [isPanelValid, setValidity]);

return <Component {...rest} setMultipleValidity={setValidityHandler} />;
}
Expand Down
4 changes: 2 additions & 2 deletions ...re_plugins/vis_type_vislib/public/components/options/metrics_axes/category_axis_panel.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ function CategoryAxisPanel(props: CategoryAxisPanelProps) {
};
setCategoryAxis(updatedAxis);
},
[setCategoryAxis]
[setCategoryAxis, axis]
);

const setPosition = useCallback(
Expand Down Expand Up @@ -89,7 +89,7 @@ function CategoryAxisPanel(props: CategoryAxisPanelProps) {
setValue={setAxis}
/>

{axis.show && <LabelOptions axis={axis} axesName="categoryAxes" index={0} {...props} />}
{axis.show && <LabelOptions axesName="categoryAxes" index={0} {...props} />}
</EuiPanel>
);
}
Expand Down
138 changes: 74 additions & 64 deletions src/legacy/core_plugins/vis_type_vislib/public/components/options/metrics_axes/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,72 +89,82 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<BasicVislibParams>)
}
);

const updateAxisTitle = (seriesParams?: SeriesParam[]) => {
const series = seriesParams || stateParams.seriesParams;
const axes = cloneDeep(stateParams.valueAxes);
let isAxesChanged = false;
let lastValuesChanged = false;
const lastLabels = { ...lastCustomLabels };
const lastMatchingSeriesAgg = { ...lastSeriesAgg };

stateParams.valueAxes.forEach((axis, axisNumber) => {
let newCustomLabel = '';
const matchingSeries: IAggConfig[] = [];

series.forEach((serie, seriesIndex) => {
if ((axisNumber === 0 && !serie.valueAxis) || serie.valueAxis === axis.id) {
const aggByIndex = aggs.bySchemaName('metric')[seriesIndex];
matchingSeries.push(aggByIndex);
const updateAxisTitle = useCallback(
(seriesParams?: SeriesParam[]) => {
const series = seriesParams || stateParams.seriesParams;
const axes = cloneDeep(stateParams.valueAxes);
let isAxesChanged = false;
let lastValuesChanged = false;
const lastLabels = { ...lastCustomLabels };
const lastMatchingSeriesAgg = { ...lastSeriesAgg };

stateParams.valueAxes.forEach((axis, axisNumber) => {
let newCustomLabel = '';
const matchingSeries: IAggConfig[] = [];

series.forEach((serie, seriesIndex) => {
if ((axisNumber === 0 && !serie.valueAxis) || serie.valueAxis === axis.id) {
const aggByIndex = aggs.bySchemaName('metric')[seriesIndex];
matchingSeries.push(aggByIndex);
}
});

if (matchingSeries.length === 1) {
// if several series matches to the axis, axis title is set according to the first serie.
newCustomLabel = matchingSeries[0].makeLabel();
}
});

if (matchingSeries.length === 1) {
// if several series matches to the axis, axis title is set according to the first serie.
newCustomLabel = matchingSeries[0].makeLabel();
}

if (lastCustomLabels[axis.id] !== newCustomLabel && newCustomLabel !== '') {
const lastSeriesAggType = get(lastSeriesAgg, `${matchingSeries[0].id}.type`);
const lastSeriesAggField = get(lastSeriesAgg, `${matchingSeries[0].id}.field`);
const matchingSeriesAggType = get(matchingSeries, '[0]type.name', '');
const matchingSeriesAggField = get(matchingSeries, '[0]params.field.name', '');
if (lastCustomLabels[axis.id] !== newCustomLabel && newCustomLabel !== '') {
const lastSeriesAggType = get(lastSeriesAgg, `${matchingSeries[0].id}.type`);
const lastSeriesAggField = get(lastSeriesAgg, `${matchingSeries[0].id}.field`);
const matchingSeriesAggType = get(matchingSeries, '[0]type.name', '');
const matchingSeriesAggField = get(matchingSeries, '[0]params.field.name', '');

const aggTypeIsChanged = lastSeriesAggType !== matchingSeriesAggType;
const aggFieldIsChanged = lastSeriesAggField !== matchingSeriesAggField;
const aggTypeIsChanged = lastSeriesAggType !== matchingSeriesAggType;
const aggFieldIsChanged = lastSeriesAggField !== matchingSeriesAggField;

lastMatchingSeriesAgg[matchingSeries[0].id] = {
type: matchingSeriesAggType,
field: matchingSeriesAggField,
};
lastLabels[axis.id] = newCustomLabel;
lastValuesChanged = true;

if (
Object.keys(lastCustomLabels).length !== 0 &&
(aggTypeIsChanged ||
aggFieldIsChanged ||
axis.title.text === '' ||
lastCustomLabels[axis.id] === axis.title.text)
) {
// Override axis title with new custom label
axes[axisNumber] = {
...axis,
title: { ...axis.title, text: newCustomLabel },
lastMatchingSeriesAgg[matchingSeries[0].id] = {
type: matchingSeriesAggType,
field: matchingSeriesAggField,
};
isAxesChanged = true;
lastLabels[axis.id] = newCustomLabel;
lastValuesChanged = true;

if (
Object.keys(lastCustomLabels).length !== 0 &&
(aggTypeIsChanged ||
aggFieldIsChanged ||
axis.title.text === '' ||
lastCustomLabels[axis.id] === axis.title.text)
) {
// Override axis title with new custom label
axes[axisNumber] = {
...axis,
title: { ...axis.title, text: newCustomLabel },
};
isAxesChanged = true;
}
}
}
});
});

if (isAxesChanged) {
setValue('valueAxes', axes);
}
if (isAxesChanged) {
setValue('valueAxes', axes);
}

if (lastValuesChanged) {
setLastSeriesAgg(lastMatchingSeriesAgg);
setLastCustomLabels(lastLabels);
}
};
if (lastValuesChanged) {
setLastSeriesAgg(lastMatchingSeriesAgg);
setLastCustomLabels(lastLabels);
}
},
[
aggs,
lastCustomLabels,
lastSeriesAgg,
setValue,
stateParams.seriesParams,
stateParams.valueAxes,
]
);

const onValueAxisPositionChanged = useCallback(
(index: number, value: ValueAxis['position']) => {
Expand All @@ -168,7 +178,7 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<BasicVislibParams>)
};
setValue('valueAxes', valueAxes);
},
[stateParams.valueAxes, getUpdatedAxisName, setValue]
[stateParams.valueAxes, setValue]
);

const onCategoryAxisPositionChanged = useCallback(
Expand Down Expand Up @@ -226,7 +236,7 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<BasicVislibParams>)
setValue('grid', { ...stateParams.grid, valueAxis: undefined });
}
},
[stateParams.seriesParams, stateParams.valueAxes, setValue]
[stateParams.seriesParams, stateParams.valueAxes, setValue, stateParams.grid]
);

const changeValueAxis: ChangeValueAxis = useCallback(
Expand All @@ -241,13 +251,13 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<BasicVislibParams>)

updateAxisTitle();
},
[addValueAxis, setParamByIndex]
[addValueAxis, setParamByIndex, updateAxisTitle]
);

const schemaName = vis.type.schemas.metrics[0].name;
const metrics = useMemo(() => {
const schemaName = vis.type.schemas.metrics[0].name;
return aggs.bySchemaName(schemaName);
}, [vis.type.schemas.metrics[0].name, aggs]);
}, [schemaName, aggs]);

const firstValueAxesId = stateParams.valueAxes[0].id;

Expand Down Expand Up @@ -278,7 +288,7 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<BasicVislibParams>)

setValue('seriesParams', updatedSeries);
updateAxisTitle(updatedSeries);
}, [metrics, firstValueAxesId]);
}, [metrics, firstValueAxesId, setValue, stateParams.seriesParams, updateAxisTitle]);

const visType = useMemo(() => {
const types = uniq(stateParams.seriesParams.map(({ type }) => type));
Expand Down
2 changes: 1 addition & 1 deletion .../core_plugins/vis_type_vislib/public/components/options/metrics_axes/value_axes_panel.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ function ValueAxesPanel(props: ValueAxesPanelProps) {
/>
</EuiToolTip>
),
[removeValueAxis]
[removeValueAxis, removeButtonTooltip]
);

const addButtonTooltip = useMemo(
Expand Down
3 changes: 1 addition & 2 deletions ...ore_plugins/vis_type_vislib/public/components/options/metrics_axes/value_axis_options.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -175,7 +175,7 @@ function ValueAxisOptions(props: ValueAxisOptionsParams) {
setValue={setValueAxisTitle}
/>

<LabelOptions axis={axis} axesName="valueAxes" index={index} {...props} />
<LabelOptions axesName="valueAxes" {...props} />
</>
) : (
<EuiSpacer size="xs" />
Expand Down Expand Up @@ -204,7 +204,6 @@ function ValueAxisOptions(props: ValueAxisOptionsParams) {
<>
<EuiSpacer size="m" />
<CustomExtentsOptions
axis={axis}
setValueAxisScale={setValueAxisScale}
setValueAxis={setValueAxis}
{...props}
Expand Down
2 changes: 1 addition & 1 deletion ...legacy/core_plugins/vis_type_vislib/public/components/options/point_series/grid_panel.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ function GridPanel({ stateParams, setValue, hasHistogramAgg }: VisOptionsProps<B
if (hasHistogramAgg) {
setGrid('categoryLines', false);
}
}, [hasHistogramAgg]);
}, [hasHistogramAgg, setGrid]);

return (
<EuiPanel paddingSize="s">
Expand Down

0 comments on commit 41fccfd

Please sign in to comment.