modified: src/pages/ngo/StatPage/LineChart.jsx

Author: codewarnab

src/pages/ngo/StatPage/LineChart.jsx

@@ -7,10 +7,8 @@ import {
     PointElement,
     Title,
     Tooltip,
-} from 'chart.js'
-import {
-    Line,
-} from 'react-chartjs-2';
+} from 'chart.js';
+import { Line } from 'react-chartjs-2';
 
 ChartJS.register(
     LineElement,
@@ -24,54 +22,31 @@ ChartJS.register(
 const LineChart = ({ data }) => {
     const [view, setView] = useState('day');
 
-    // Null checking for data prop
-    if (!data || !Array.isArray(data) || data.length === 0) {
-        console.error("Invalid or empty data provided to LineChart component");
-        return <div>No data available for the chart.</div>;
-    }
-
     const convertDataForLineChart = useMemo(() => {
         const countsPerDay = {};
+        const validDates = [];
 
-        // Ensure data is an array before forEach
-        if (Array.isArray(data)) {
-            data.forEach((report) => {
-                if (report && typeof report === 'object' && 'reported_time' in report) {
-                    try {
-                        const reportDate = new Date(report.reported_time);
-                        if (!isNaN(reportDate.getTime())) {
-                            const reportedDate = reportDate.toLocaleDateString('en-GB', {
-                                day: '2-digit',
-                                month: '2-digit'
-                            });
-                            countsPerDay[reportedDate] = (countsPerDay[reportedDate] || 0) + 1;
-                        } else {
-                            console.warn("Invalid date encountered:", report.reported_time);
-                        }
-                    } catch (error) {
-                        console.warn("Error processing report date:", error);
-                    }
-                } else {
-                    console.warn("Encountered a report with missing or invalid reported_time");
-                }
-            });
-        } else {
-            console.error("Data is not an array in convertDataForLineChart");
-            return { dates: [], counts: [] };
-        }
-
-        const dates = [];
-        const validDates = Array.isArray(data) ? data
-            .filter(report => report && typeof report === 'object' && 'reported_time' in report)
-            .map(report => {
+        data.forEach((report, index) => {
+            if (report && typeof report === 'object' && 'reported_time' in report) {
                 try {
-                    const date = new Date(report.reported_time);
-                    return isNaN(date.getTime()) ? null : date;
-                } catch {
-                    return null;
+                    const reportDate = new Date(report.reported_time);
+                    if (!isNaN(reportDate.getTime())) {
+                        const reportedDate = reportDate.toLocaleDateString('en-GB', {
+                            day: '2-digit',
+                            month: '2-digit'
+                        });
+                        countsPerDay[reportedDate] = (countsPerDay[reportedDate] || 0) + 1;
+                        validDates.push(reportDate);
+                    } else {
+                        console.warn(`Invalid date encountered at index ${index}:`, report.reported_time);
+                    }
+                } catch (error) {
+                    console.warn(`Error processing report date at index ${index}:`, error);
                 }
-            })
-            .filter(date => date !== null) : [];
+            } else {
+                console.warn(`Encountered a report with missing or invalid reported_time at index ${index}`);
+            }
+        });
 
         if (validDates.length === 0) {
             console.error("No valid dates found in the data");
@@ -80,6 +55,7 @@ const LineChart = ({ data }) => {
 
         const minDate = new Date(Math.min(...validDates));
         const maxDate = new Date(Math.max(...validDates));
+        const dates = [];
 
         for (let currentDate = new Date(minDate); currentDate <= maxDate; currentDate.setDate(currentDate.getDate() + (view === 'day' ? 1 : view === 'week' ? 7 : view === 'month' ? 30 : 365))) {
             const formattedDate = currentDate.toLocaleDateString('en-GB', {
@@ -99,8 +75,7 @@ const LineChart = ({ data }) => {
 
     const { dates, counts } = convertDataForLineChart;
 
-    // Check if we have valid data after conversion
-    if (!dates || !counts || !Array.isArray(dates) || !Array.isArray(counts) || dates.length === 0 || counts.length === 0) {
+    if (!dates.length || !counts.length) {
         console.error("No valid data after conversion in LineChart component");
         return <div>Unable to generate chart due to insufficient data.</div>;
     }
@@ -189,4 +164,4 @@ const LineChart = ({ data }) => {
     )
 }
 
-export default LineChart;
+export default LineChart;