From 4408bc763b041d4604ae763d2abc6f096febcfe9 Mon Sep 17 00:00:00 2001
From: gabriel <gabriel@hexrfactory.com>
Date: Thu, 27 Mar 2025 17:55:27 +0530
Subject: [PATCH] resolved chart data bug

---
 .../realTimeVis/charts/LineGraphComponent.tsx | 27 +++++++++----------
 1 file changed, 13 insertions(+), 14 deletions(-)

diff --git a/app/src/components/ui/realTimeVis/charts/LineGraphComponent.tsx b/app/src/components/ui/realTimeVis/charts/LineGraphComponent.tsx
index 07a387f..cc40187 100644
--- a/app/src/components/ui/realTimeVis/charts/LineGraphComponent.tsx
+++ b/app/src/components/ui/realTimeVis/charts/LineGraphComponent.tsx
@@ -201,18 +201,16 @@ const LineGraphComponent = ({
     const { measurements, setMeasurements, updateDuration, duration } = useChartStore();
 
   useEffect(() => {
-    if ( measurements.length > 0 ) {
-      const socket = io("http://192.168.0.192:5010");
 
+    const socket = io("http://192.168.0.192:5010");
+
+    if ( measurements.length > 0 ) {
       var inputes = {
         measurements: measurements,
         duration: duration,
         interval: 1000,
       }
 
-      console.log('graphHHHHHHHHHHHHHHHHHHHHHHHHHHHHH',inputes);
-      
-
     // Start stream
     const startStream = () => {
       socket.emit("lineInput", inputes);
@@ -226,23 +224,24 @@ const LineGraphComponent = ({
 
       // Extract timestamps and values
       const labels = responceData.time;
-      const datasets = data.measurements.map((measurement: any) => ({
-        label: `${measurement.name}.${measurement.fields}`,
-        data: responceData[`${measurement.name}.${measurement.fields}`]?.values || [],
-        backgroundColor: themeColor[0] || "#5c87df",
-        borderColor: themeColor[1] || "#ffffff",
-        borderWidth: 2,
-        // fill: false,
-      }));
+      const datasets = measurements.map((measurement: any) => {
+        const key = `${measurement.name}.${measurement.fields}`;
+        return {
+          label: key,
+          data: responceData[key]?.values ?? [], // Ensure it exists
+          backgroundColor: themeColor[0] || "#5c87df",
+          borderColor: themeColor[1] || "#ffffff",
+        };
+      });
 
       setChartData({ labels, datasets });
     });
+    }
 
     return () => {
       socket.off("lineOutput");
       socket.emit("stop_stream"); // Stop streaming when component unmounts
     };
-    }
   }, [measurements, duration]);
 
   // useEffect(() => {