From d59d834237a24ff9237bc32efd0e538f243b6fab Mon Sep 17 00:00:00 2001
From: 1emu <github@lemu.sh>
Date: Thu, 7 Sep 2023 18:36:19 -0300
Subject: [PATCH] fix: use Dayjs to calculate dates for voting stats

---
 src/back/services/vote.test.ts    |  2 +-
 src/components/Home/TopVoters.tsx | 11 ++++++-----
 src/hooks/useVotingStats.ts       |  6 ++++--
 src/utils/date/aMonthAgo.ts       |  6 ++++++
 4 files changed, 17 insertions(+), 8 deletions(-)
 create mode 100644 src/utils/date/aMonthAgo.ts

diff --git a/src/back/services/vote.test.ts b/src/back/services/vote.test.ts
index 1f671f243..ea6b67464 100644
--- a/src/back/services/vote.test.ts
+++ b/src/back/services/vote.test.ts
@@ -12,7 +12,7 @@ import clearAllMocks = jest.clearAllMocks
 
 describe('getTopVoters', () => {
   describe('when fetching top voters for August 2023', () => {
-    const firstOfAugust = Time.utc('2023-08-01T00:00:00Z').toDate()
+    const firstOfAugust = Time.utc('2023-08-01T00:00:00.000Z').toDate()
     const { start, end } = getPreviousMonthStartAndEnd(firstOfAugust)
     beforeEach(() => {
       jest.clearAllMocks()
diff --git a/src/components/Home/TopVoters.tsx b/src/components/Home/TopVoters.tsx
index 8ac3dd420..11c808553 100644
--- a/src/components/Home/TopVoters.tsx
+++ b/src/components/Home/TopVoters.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useMemo } from 'react'
 
 import { Card } from 'decentraland-ui/dist/components/Card/Card'
 import { Header } from 'decentraland-ui/dist/components/Header/Header'
@@ -8,6 +8,7 @@ import { VOTES_VP_THRESHOLD } from '../../constants'
 import useFormatMessage from '../../hooks/useFormatMessage'
 import useTopVoters from '../../hooks/useTopVoters'
 import Time from '../../utils/date/Time'
+import { getAMonthAgo } from '../../utils/date/aMonthAgo'
 import Helper from '../Helper/Helper'
 
 import HomeLoader from './HomeLoader'
@@ -18,12 +19,12 @@ const createRow = ({ address, votes }: { address: string; votes: number }, idx:
   return <TopVotersRow key={idx} address={address} votes={votes} rank={idx + 1} />
 }
 
-const now = Time()
-const aMonthAgo = now.subtract(1, 'month').toDate()
-
 function TopVoters() {
+  const now = useMemo(() => Time().toDate(), [])
+  const aMonthAgo = useMemo(() => getAMonthAgo(now), [])
+
   const t = useFormatMessage()
-  const { topVoters, isLoadingTopVoters } = useTopVoters(aMonthAgo, now.toDate())
+  const { topVoters, isLoadingTopVoters } = useTopVoters(aMonthAgo, now)
 
   return (
     <Card className="TopVoters">
diff --git a/src/hooks/useVotingStats.ts b/src/hooks/useVotingStats.ts
index fe68f5361..d2fd36057 100644
--- a/src/hooks/useVotingStats.ts
+++ b/src/hooks/useVotingStats.ts
@@ -7,6 +7,8 @@ import { getQueryTimestamp } from '../clients/SnapshotGraphql'
 import { SnapshotProposal, SnapshotVote } from '../clients/SnapshotGraphqlTypes'
 import { calculateMatch, getChecksumAddress, outcomeMatch } from '../entities/Snapshot/utils'
 import { getFormattedPercentage } from '../helpers'
+import Time from '../utils/date/Time'
+import { getAMonthAgo } from '../utils/date/aMonthAgo'
 
 import { DEFAULT_QUERY_STALE_TIME } from './constants'
 
@@ -47,8 +49,8 @@ function getParticipation(
 }
 
 export default function useVotingStats(address: string, userAddress: string | null) {
-  const now = useMemo(() => new Date(), [])
-  const aMonthAgo = useMemo(() => new Date(now.getFullYear(), now.getMonth() - 1, now.getDay()), [now])
+  const now = useMemo(() => Time().toDate(), [])
+  const aMonthAgo = useMemo(() => getAMonthAgo(now), [])
 
   const { data: last30DaysProposals, isLoading: isLoadingProposals } = useQuery({
     queryKey: [`last30DaysProposals#${aMonthAgo.getTime()}`],
diff --git a/src/utils/date/aMonthAgo.ts b/src/utils/date/aMonthAgo.ts
new file mode 100644
index 000000000..1abc4c066
--- /dev/null
+++ b/src/utils/date/aMonthAgo.ts
@@ -0,0 +1,6 @@
+import Time from './Time'
+
+export function getAMonthAgo(now: Date) {
+  const nowDayjs = Time(now)
+  return nowDayjs.subtract(1, 'month').toDate()
+}