From 033d1ae1fdf115d2acbceeb2f8f3550fdc3ca388 Mon Sep 17 00:00:00 2001 From: Paul Ochieng Levi Date: Mon, 28 Oct 2024 11:47:55 +0300 Subject: [PATCH 1/6] code cleanup --- platform/src/core/utils/useFetchAnalyticsData.jsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/platform/src/core/utils/useFetchAnalyticsData.jsx b/platform/src/core/utils/useFetchAnalyticsData.jsx index 06e60a2b97..6e963aa43b 100644 --- a/platform/src/core/utils/useFetchAnalyticsData.jsx +++ b/platform/src/core/utils/useFetchAnalyticsData.jsx @@ -1,4 +1,3 @@ -// src/core/utils/useFetchAnalyticsData.js import { useState, useCallback, useEffect } from 'react'; import { getAnalyticsData } from '@/core/apis/DeviceRegistry'; import { parseAndValidateISODate } from '@/core/utils/dateUtils'; @@ -27,7 +26,6 @@ const useFetchAnalyticsData = ({ try { if (selectedSiteIds.length === 0) { - // No sites selected, clear data and error, set loading to false setAllSiteData([]); setError(null); setChartLoading(false); From bf889c182c3ba2e98d1d3e38d022cc0ee9498c61 Mon Sep 17 00:00:00 2001 From: Paul Ochieng Levi Date: Mon, 28 Oct 2024 12:07:24 +0300 Subject: [PATCH 2/6] code clean up --- platform/src/common/components/Calendar/CustomCalendar.jsx | 3 ++- platform/src/lib/store/services/charts/ChartSlice.js | 5 ++--- platform/src/pages/analytics/_components/OverView.jsx | 1 + 3 files changed, 5 insertions(+), 4 deletions(-) diff --git a/platform/src/common/components/Calendar/CustomCalendar.jsx b/platform/src/common/components/Calendar/CustomCalendar.jsx index 1e365bc96e..af6d290038 100644 --- a/platform/src/common/components/Calendar/CustomCalendar.jsx +++ b/platform/src/common/components/Calendar/CustomCalendar.jsx @@ -36,6 +36,7 @@ const isValidDate = (date) => { const CustomCalendar = ({ initialStartDate, initialEndDate, + initial_label, onChange, className = '', dropdown = false, @@ -46,7 +47,7 @@ const CustomCalendar = ({ const [value, setValue] = useState({ startDate: initialStartDate, endDate: initialEndDate, - label: '', + label: initial_label, }); /** diff --git a/platform/src/lib/store/services/charts/ChartSlice.js b/platform/src/lib/store/services/charts/ChartSlice.js index 6c0b77e49d..0395807d01 100644 --- a/platform/src/lib/store/services/charts/ChartSlice.js +++ b/platform/src/lib/store/services/charts/ChartSlice.js @@ -11,12 +11,11 @@ const defaultChartSites = process.env.NEXT_PUBLIC_DEFAULT_CHART_SITES : []; /** - * Utility function to calculate the ISO string for 7 days ago from the current date. - * Ensures that the date is set accurately in UTC. + * Calculates the date 7 days prior to today. */ const getStartDate = () => { const startDate = new Date(); - startDate.setUTCDate(startDate.getUTCDate() - 7); + startDate.setDate(startDate.getDate() - 7); return startDate.toISOString(); }; diff --git a/platform/src/pages/analytics/_components/OverView.jsx b/platform/src/pages/analytics/_components/OverView.jsx index 2601f7e394..3156c8b160 100644 --- a/platform/src/pages/analytics/_components/OverView.jsx +++ b/platform/src/pages/analytics/_components/OverView.jsx @@ -142,6 +142,7 @@ const OverView = () => { Date: Mon, 28 Oct 2024 12:20:47 +0300 Subject: [PATCH 3/6] code clean up --- .../pages/analytics/_components/OverView.jsx | 29 +++++++++++++++++-- 1 file changed, 26 insertions(+), 3 deletions(-) diff --git a/platform/src/pages/analytics/_components/OverView.jsx b/platform/src/pages/analytics/_components/OverView.jsx index 3156c8b160..ab910d0500 100644 --- a/platform/src/pages/analytics/_components/OverView.jsx +++ b/platform/src/pages/analytics/_components/OverView.jsx @@ -1,4 +1,4 @@ -import React, { useState, useCallback } from 'react'; +import React, { useState, useCallback, useEffect } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import ChartContainer from '@/components/Charts/ChartContainer'; import AQNumberCard from '@/components/AQNumberCard'; @@ -27,11 +27,34 @@ const OverView = () => { const dispatch = useDispatch(); const isOpen = useSelector((state) => state.modal.openModal); const chartData = useSelector((state) => state.chart); - const [dateRange, setDateRange] = useState({ + + // Default date range for the last 7 days + const defaultDateRange = { startDate: subDays(new Date(), 7), endDate: new Date(), label: 'Last 7 days', - }); + }; + + const [dateRange, setDateRange] = useState(defaultDateRange); + + // Reset chart data range to default when the component is unmounted + useEffect(() => { + return () => { + const { startDate, endDate } = defaultDateRange; + const { startDateISO, endDateISO } = formatDateRangeToISO( + startDate, + endDate, + ); + + dispatch( + setChartDataRange({ + startDate: startDateISO, + endDate: endDateISO, + label: defaultDateRange.label, + }), + ); + }; + }, [dispatch]); const handleOpenModal = useCallback( (type, ids = []) => { From c07f1e18803d85d0a1ffd7c2c151ed91b13e7797 Mon Sep 17 00:00:00 2001 From: Paul Ochieng Levi Date: Mon, 28 Oct 2024 13:57:25 +0300 Subject: [PATCH 4/6] removed pdf --- platform/src/common/components/Charts/ChartContainer.jsx | 2 +- .../common/components/Modal/dataDownload/constants/index.jsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/platform/src/common/components/Charts/ChartContainer.jsx b/platform/src/common/components/Charts/ChartContainer.jsx index f2a738374b..5a2ea99ac4 100644 --- a/platform/src/common/components/Charts/ChartContainer.jsx +++ b/platform/src/common/components/Charts/ChartContainer.jsx @@ -5,7 +5,7 @@ import { jsPDF } from 'jspdf'; import html2canvas from 'html2canvas'; import CheckIcon from '@/icons/tickIcon'; import CustomDropdown from '@/components/Dropdowns/CustomDropdown'; -// import PrintReportModal from '@/components/Modal/PrintReportModal'; // Retained as per request +// import PrintReportModal from '@/components/Modal/PrintReportModal'; import MoreInsightsChart from './MoreInsightsChart'; import SkeletonLoader from './components/SkeletonLoader'; import { setOpenModal, setModalType } from '@/lib/store/services/downloadModal'; diff --git a/platform/src/common/components/Modal/dataDownload/constants/index.jsx b/platform/src/common/components/Modal/dataDownload/constants/index.jsx index 25b4f9cf46..3cd8da4741 100644 --- a/platform/src/common/components/Modal/dataDownload/constants/index.jsx +++ b/platform/src/common/components/Modal/dataDownload/constants/index.jsx @@ -23,7 +23,7 @@ export const FREQUENCY_OPTIONS = [ export const FILE_TYPE_OPTIONS = [ { id: 1, name: 'CSV' }, { id: 2, name: 'Json' }, - { id: 3, name: 'PDF' }, + // { id: 3, name: 'PDF' }, ]; export const tableData = [ From 6ec30ff20468fb9a35b5a3515703dca998484791 Mon Sep 17 00:00:00 2001 From: Paul Ochieng Levi Date: Mon, 28 Oct 2024 14:02:07 +0300 Subject: [PATCH 5/6] improve skeleton loader for charts --- platform/src/common/components/AQNumberCard/index.jsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/platform/src/common/components/AQNumberCard/index.jsx b/platform/src/common/components/AQNumberCard/index.jsx index d9ba6ccc70..5ce40b5268 100644 --- a/platform/src/common/components/AQNumberCard/index.jsx +++ b/platform/src/common/components/AQNumberCard/index.jsx @@ -114,10 +114,12 @@ const AQNumberCard = () => { }; const SkeletonCard = () => ( -
-
-
-
+
+
+
+
+
+
); From 6ce5f6401e97a41f2758536ec314eb889c22ee28 Mon Sep 17 00:00:00 2001 From: Paul Ochieng Levi Date: Mon, 28 Oct 2024 14:12:37 +0300 Subject: [PATCH 6/6] comment organization --- .../common/components/Charts/ChartContainer.jsx | 16 ---------------- .../components/Charts/MoreInsightsChart.jsx | 3 --- 2 files changed, 19 deletions(-) diff --git a/platform/src/common/components/Charts/ChartContainer.jsx b/platform/src/common/components/Charts/ChartContainer.jsx index 5a2ea99ac4..9f3eeafe43 100644 --- a/platform/src/common/components/Charts/ChartContainer.jsx +++ b/platform/src/common/components/Charts/ChartContainer.jsx @@ -1,6 +1,5 @@ import React, { useRef, useCallback, useEffect, useState } from 'react'; import { useDispatch, useSelector } from 'react-redux'; -import PropTypes from 'prop-types'; import { jsPDF } from 'jspdf'; import html2canvas from 'html2canvas'; import CheckIcon from '@/icons/tickIcon'; @@ -67,7 +66,6 @@ const ChartContainer = ({ }, 4000); } - // Cleanup the timer if component unmounts or chartLoading changes return () => { if (timer) { clearTimeout(timer); @@ -280,18 +278,4 @@ const ChartContainer = ({ ); }; -ChartContainer.propTypes = { - chartType: PropTypes.oneOf(['line', 'bar']).isRequired, - chartTitle: PropTypes.string.isRequired, - height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), - width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), - id: PropTypes.string.isRequired, - showTitle: PropTypes.bool, - data: PropTypes.array.isRequired, - chartLoading: PropTypes.bool.isRequired, - error: PropTypes.string, - refetch: PropTypes.func.isRequired, - // defaultBody: PropTypes.object, // Commented out as per your request -}; - export default ChartContainer; diff --git a/platform/src/common/components/Charts/MoreInsightsChart.jsx b/platform/src/common/components/Charts/MoreInsightsChart.jsx index 18bd060c7b..91277109cb 100644 --- a/platform/src/common/components/Charts/MoreInsightsChart.jsx +++ b/platform/src/common/components/Charts/MoreInsightsChart.jsx @@ -43,9 +43,7 @@ const MoreInsightsChart = ({ }) => { const [activeIndex, setActiveIndex] = useState(null); - // Reference to the chart container const containerRef = useRef(null); - // Use the custom hook to get container dimensions const { width: containerWidth } = useResizeObserver(containerRef); /** @@ -56,7 +54,6 @@ const MoreInsightsChart = ({ const siteIdToName = {}; const allSiteIds = new Set(); - // Build a mapping from site_id to site name data.forEach((dataPoint) => { const { site_id, name } = dataPoint; if (site_id && name) {