diff --git a/src/pages/ngo/StatPage/LineChart.jsx b/src/pages/ngo/StatPage/LineChart.jsx
index 722814b..730e736 100644
--- a/src/pages/ngo/StatPage/LineChart.jsx
+++ b/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
No data available for the chart.
;
- }
-
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 Unable to generate chart due to insufficient data.
;
}
@@ -189,4 +164,4 @@ const LineChart = ({ data }) => {
)
}
-export default LineChart;
\ No newline at end of file
+export default LineChart;