From 822a307cec7c4b6ecbf62632ec1e67f6b242f3a2 Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Sun, 8 Oct 2023 18:51:47 +0800
Subject: [PATCH] feat: add unit calc for fetch pagestat

---
 src/client/components/website/WebsiteOverview.tsx |  3 +--
 src/client/hooks/useGlobalRangeDate.tsx           | 15 ++++++++++++++-
 src/server/utils/common.ts                        | 15 +--------------
 src/shared/date.ts                                | 15 +++++++++++++++
 src/shared/index.ts                               |  1 +
 5 files changed, 32 insertions(+), 17 deletions(-)
 create mode 100644 src/shared/date.ts
 create mode 100644 src/shared/index.ts

diff --git a/src/client/components/website/WebsiteOverview.tsx b/src/client/components/website/WebsiteOverview.tsx
index c3e7e7c..799299b 100644
--- a/src/client/components/website/WebsiteOverview.tsx
+++ b/src/client/components/website/WebsiteOverview.tsx
@@ -29,8 +29,7 @@ export const WebsiteOverview: React.FC<{
   website: WebsiteInfo;
   actions?: React.ReactNode;
 }> = React.memo((props) => {
-  const unit: DateUnit = 'hour';
-  const { startDate, endDate } = useGlobalRangeDate();
+  const { startDate, endDate, unit } = useGlobalRangeDate();
 
   const {
     pageviews,
diff --git a/src/client/hooks/useGlobalRangeDate.tsx b/src/client/hooks/useGlobalRangeDate.tsx
index 9b13d19..6776bf7 100644
--- a/src/client/hooks/useGlobalRangeDate.tsx
+++ b/src/client/hooks/useGlobalRangeDate.tsx
@@ -1,12 +1,15 @@
 import { CalendarOutlined } from '@ant-design/icons';
 import dayjs, { Dayjs } from 'dayjs';
 import { useMemo } from 'react';
+import { getMinimumUnit } from '../../shared';
 import { DateRange, useGlobalStateStore } from '../store/global';
+import { DateUnit } from '../utils/date';
 
 export function useGlobalRangeDate(): {
   label: React.ReactNode;
   startDate: Dayjs;
   endDate: Dayjs;
+  unit: DateUnit;
 } {
   const { dateRange, startDate, endDate } = useGlobalStateStore();
 
@@ -30,6 +33,7 @@ export function useGlobalRangeDate(): {
         ),
         startDate: _startDate,
         endDate: _endDate,
+        unit: getMinimumUnit(_startDate, _endDate),
       };
     }
 
@@ -38,6 +42,7 @@ export function useGlobalRangeDate(): {
         label: 'Today',
         startDate: dayjs().startOf('day'),
         endDate: dayjs().endOf('day'),
+        unit: 'hour',
       };
     }
 
@@ -46,6 +51,7 @@ export function useGlobalRangeDate(): {
         label: 'Yesterday',
         startDate: dayjs().subtract(1, 'day').startOf('day'),
         endDate: dayjs().subtract(1, 'day').endOf('day'),
+        unit: 'hour',
       };
     }
 
@@ -54,6 +60,7 @@ export function useGlobalRangeDate(): {
         label: 'This week',
         startDate: dayjs().startOf('week'),
         endDate: dayjs().endOf('week'),
+        unit: 'day',
       };
     }
 
@@ -62,6 +69,7 @@ export function useGlobalRangeDate(): {
         label: 'Last 7 days',
         startDate: dayjs().subtract(7, 'day').startOf('day'),
         endDate: dayjs().endOf('day'),
+        unit: 'day',
       };
     }
 
@@ -70,6 +78,7 @@ export function useGlobalRangeDate(): {
         label: 'This month',
         startDate: dayjs().startOf('month'),
         endDate: dayjs().endOf('month'),
+        unit: 'day',
       };
     }
 
@@ -78,6 +87,7 @@ export function useGlobalRangeDate(): {
         label: 'Last 30 days',
         startDate: dayjs().subtract(30, 'day').startOf('day'),
         endDate: dayjs().endOf('day'),
+        unit: 'day',
       };
     }
 
@@ -86,14 +96,16 @@ export function useGlobalRangeDate(): {
         label: 'Last 90 days',
         startDate: dayjs().subtract(90, 'day').startOf('day'),
         endDate: dayjs().endOf('day'),
+        unit: 'day',
       };
     }
 
     if (dateRange === DateRange.ThisYear) {
       return {
-        label: 'Last 90 days',
+        label: 'This year',
         startDate: dayjs().startOf('year'),
         endDate: dayjs().endOf('year'),
+        unit: 'month',
       };
     }
 
@@ -102,6 +114,7 @@ export function useGlobalRangeDate(): {
       label: 'Last 24 hours',
       startDate: dayjs().subtract(1, 'day'),
       endDate: dayjs(),
+      unit: 'hour',
     };
   }, [dateRange, startDate, endDate]);
 }
diff --git a/src/server/utils/common.ts b/src/server/utils/common.ts
index 382484c..b800255 100644
--- a/src/server/utils/common.ts
+++ b/src/server/utils/common.ts
@@ -8,6 +8,7 @@ import jwt from 'jsonwebtoken';
 import _ from 'lodash';
 import { getWorkspaceWebsiteDateRange } from '../model/workspace';
 import { isCuid } from '@paralleldrive/cuid2';
+import { getMinimumUnit } from '../../shared';
 
 export { isCuid };
 
@@ -208,20 +209,6 @@ export function getAllowedUnits(startDate: Date, endDate: Date) {
   return index >= 0 ? units.splice(index) : [];
 }
 
-export function getMinimumUnit(startDate: Date, endDate: Date) {
-  if (dayjs(endDate).diff(startDate, 'minutes') <= 60) {
-    return 'minute';
-  } else if (dayjs(endDate).diff(startDate, 'hours') <= 48) {
-    return 'hour';
-  } else if (dayjs(endDate).diff(startDate, 'days') <= 90) {
-    return 'day';
-  } else if (dayjs(endDate).diff(startDate, 'months') <= 24) {
-    return 'month';
-  }
-
-  return 'year';
-}
-
 /**
  * fork from https://github.com/mcnaveen/numify/blob/main/src/index.ts
  */
diff --git a/src/shared/date.ts b/src/shared/date.ts
new file mode 100644
index 0000000..01f5ff0
--- /dev/null
+++ b/src/shared/date.ts
@@ -0,0 +1,15 @@
+import dayjs, { ConfigType } from 'dayjs';
+
+export function getMinimumUnit(startDate: ConfigType, endDate: ConfigType) {
+  if (dayjs(endDate).diff(startDate, 'minutes') <= 60) {
+    return 'minute';
+  } else if (dayjs(endDate).diff(startDate, 'hours') <= 48) {
+    return 'hour';
+  } else if (dayjs(endDate).diff(startDate, 'days') <= 90) {
+    return 'day';
+  } else if (dayjs(endDate).diff(startDate, 'months') <= 24) {
+    return 'month';
+  }
+
+  return 'year';
+}
diff --git a/src/shared/index.ts b/src/shared/index.ts
new file mode 100644
index 0000000..05b562f
--- /dev/null
+++ b/src/shared/index.ts
@@ -0,0 +1 @@
+export * from './date';