Исправлена работа TVD

src/pages/WellOperations/Tvd/index.jsx

@@ -148,7 +148,7 @@ const Tvd = memo(({ idWell: wellId, title, ...other }) => {
         )
     }, [idWell])
 
-	useEffect(() => {
+    const chartData = useMemo(() => {
         const withoutNpt = []
         operations?.fact?.forEach((row) => {
             if (row?.isNPT !== false) return
@@ -160,39 +160,41 @@ const Tvd = memo(({ idWell: wellId, title, ...other }) => {
             })
         })
 
-        const data = { datasets: [
+        return { datasets: [
             makeDataset(operations?.fact, 'Факт', '#0A0', 3),
             makeDataset(operations?.predict, 'Прогноз', 'purple', 1, [7, 3]),
             makeDataset(operations?.plan, 'План', '#F00', 3),
             makeDataset(withoutNpt, 'Факт без НПВ', '#00F', 3)
         ]}
+    }, [operations])
 
-		if (chartRef.current && !chart) {
-			const thisOptions = {}
-			Object.assign(thisOptions, defaultOptions)
-            thisOptions.onClick = onPointClick
-            thisOptions.scales.x = scaleTypes[xLabel]
-            thisOptions.parsing.xAxisKey = xLabel
+    useEffect(() => {
+        if (!chartRef.current) return
+        const options = {}
+        Object.assign(options, defaultOptions)
 
-			const newChart = new Chart(chartRef.current, {
-				type: 'line',
-				plugins: [ChartDataLabels],
-				options: thisOptions,
-				data: data
-			})
-			setChart(newChart)
+        const newChart = new Chart(chartRef.current, {
+            type: 'line',
+            plugins: [ChartDataLabels],
+            options: options,
+            data: { datasets: [] },
+        })
+        setChart(newChart)
 
-			return () => chart?.destroy()
-		} else {
-            chart.data = data
-            chart.options.scales.x = scaleTypes[xLabel]
-            chart.options.parsing.xAxisKey = xLabel
-            chart.update()
-            // Обнуление ширины необходимо для уменьшения размена при resize после появления элементов
-            chart.canvas.parentNode.style.width = '0'
-            chart.resize()
-        }
-	}, [chart, operations, xLabel, onPointClick, other])
+        return () => newChart?.destroy()
+    }, [chartRef])
+
+    useEffect(() => {
+        if (!chart) return
+        chart.data = chartData
+        chart.options.onClick = onPointClick
+        chart.options.scales.x = scaleTypes[xLabel]
+        chart.options.parsing.xAxisKey = xLabel
+        chart.update()
+        // Обнуление ширины необходимо для уменьшения размена при resize после появления элементов
+        chart.canvas.parentNode.style.width = '0'
+        chart.resize()
+    }, [chart, chartData, xLabel, onPointClick])
 
     const toogleTable = useCallback(() => {
         setOperations(pre => ({ ...pre }))