@adaptabletools/adaptable
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
33 lines (32 loc) • 1.32 kB
JavaScript
import * as React from 'react';
import { useSelector } from 'react-redux';
import isEqual from 'lodash/isEqual';
import * as InternalRedux from '../../../../Redux/ActionsReducers/InternalRedux';
import { useAdaptable } from '../../../AdaptableContext';
export const PreviewChartSection = (props) => {
const currentChartModels = useSelector((state) => InternalRedux.ChartingCurrentChartModelsSelector(state.Internal));
const [localChartId, setLocalChartId] = React.useState(null);
const adaptable = useAdaptable();
const divRef = React.useRef(null);
React.useEffect(() => {
if (!divRef.current) {
return;
}
const chartRef = adaptable.api.chartingApi.showChartDefinition(props.chartDefinition, divRef.current);
setLocalChartId(chartRef.chartId);
chartRef.chart;
return () => {
chartRef.destroyChart();
};
}, [divRef]);
React.useEffect(() => {
const model = currentChartModels.find((model) => model.chartId == localChartId);
if (model && !isEqual(model, props.chartDefinition.Model)) {
props.onChange({
...props.chartDefinition,
Model: model,
});
}
}, [currentChartModels]);
return React.createElement("div", { ref: divRef });
};