From b2697f00772684bf7887782799ee002dd1c99122 Mon Sep 17 00:00:00 2001 From: Zach Pomerantz Date: Tue, 16 Nov 2021 16:20:46 -0800 Subject: [PATCH] fix: format date using Date.toLocaleString (#2459) * fix: format date using Date.toLocaleString Fixes #2458 * fix: date typings --- package.json | 2 -- src/pages/Vote/VotePage.tsx | 51 ++++++++++++++++++++++--------------- yarn.lock | 10 -------- 3 files changed, 31 insertions(+), 32 deletions(-) diff --git a/package.json b/package.json index 13c00b1358..61777386df 100644 --- a/package.json +++ b/package.json @@ -37,7 +37,6 @@ "@types/lingui__core": "^2.7.1", "@types/lingui__macro": "^2.7.4", "@types/lingui__react": "^2.8.3", - "@types/luxon": "^1.24.4", "@types/ms.macro": "^2.0.0", "@types/multicodec": "^1.0.0", "@types/node": "^13.13.5", @@ -94,7 +93,6 @@ "graphql-request": "^3.4.0", "inter-ui": "^3.13.1", "jest-styled-components": "^7.0.5", - "luxon": "^1.25.0", "microbundle": "^0.13.3", "ms.macro": "^2.0.0", "multicodec": "^3.0.1", diff --git a/src/pages/Vote/VotePage.tsx b/src/pages/Vote/VotePage.tsx index 03f16d21cc..1c29bf14bf 100644 --- a/src/pages/Vote/VotePage.tsx +++ b/src/pages/Vote/VotePage.tsx @@ -2,9 +2,9 @@ import { BigNumber } from '@ethersproject/bignumber' // eslint-disable-next-line no-restricted-imports import { t, Trans } from '@lingui/macro' import { CurrencyAmount, Token } from '@uniswap/sdk-core' +import { useActiveLocale } from 'hooks/useActiveLocale' import useCurrentBlockTimestamp from 'hooks/useCurrentBlockTimestamp' import JSBI from 'jsbi' -import { DateTime } from 'luxon/src/luxon' import { useState } from 'react' import { ArrowLeft } from 'react-feather' import ReactMarkdown from 'react-markdown' @@ -127,14 +127,17 @@ function getDateFromBlock( currentBlock: number | undefined, averageBlockTimeInSeconds: number | undefined, currentTimestamp: BigNumber | undefined -): DateTime | undefined { - return targetBlock && currentBlock && averageBlockTimeInSeconds && currentTimestamp - ? DateTime.fromSeconds( - currentTimestamp - .add(BigNumber.from(averageBlockTimeInSeconds).mul(BigNumber.from(targetBlock - currentBlock))) - .toNumber() - ) - : undefined +): Date | undefined { + if (targetBlock && currentBlock && averageBlockTimeInSeconds && currentTimestamp) { + const date = new Date() + date.setTime( + currentTimestamp + .add(BigNumber.from(averageBlockTimeInSeconds).mul(BigNumber.from(targetBlock - currentBlock))) + .toNumber() * 1000 + ) + return date + } + return undefined } export default function VotePage({ @@ -161,19 +164,28 @@ export default function VotePage({ // get and format date from data const currentTimestamp = useCurrentBlockTimestamp() const currentBlock = useBlockNumber() - const startDate: DateTime | undefined = getDateFromBlock( + const startDate = getDateFromBlock( proposalData?.startBlock, currentBlock, (chainId && AVERAGE_BLOCK_TIME_IN_SECS[chainId]) ?? DEFAULT_AVERAGE_BLOCK_TIME_IN_SECS, currentTimestamp ) - const endDate: DateTime | undefined = getDateFromBlock( + const endDate = getDateFromBlock( proposalData?.endBlock, currentBlock, (chainId && AVERAGE_BLOCK_TIME_IN_SECS[chainId]) ?? DEFAULT_AVERAGE_BLOCK_TIME_IN_SECS, currentTimestamp ) - const now: DateTime = DateTime.local() + const now = new Date() + const locale = useActiveLocale() + const dateFormat: Intl.DateTimeFormatOptions = { + year: 'numeric', + month: 'long', + day: 'numeric', + hour: 'numeric', + minute: 'numeric', + timeZoneName: 'short', + } // get total votes and format percentages for UI const totalVotes: number | undefined = proposalData ? proposalData.forCount + proposalData.againstCount : undefined @@ -241,19 +253,18 @@ export default function VotePage({ {startDate && startDate > now ? ( - - Voting starts approximately {startDate && startDate.toLocaleString(DateTime.DATETIME_FULL)} - + Voting starts approximately {startDate.toLocaleString(locale, dateFormat)} ) : null} - {endDate && endDate < now ? ( - Voting ended {endDate && endDate.toLocaleString(DateTime.DATETIME_FULL)} - ) : ( - Voting ends approximately {endDate && endDate.toLocaleString(DateTime.DATETIME_FULL)} - )} + {endDate && + (endDate < now ? ( + Voting ended {endDate.toLocaleString(locale, dateFormat)} + ) : ( + Voting ends approximately {endDate.toLocaleString(locale, dateFormat)} + ))} {proposalData && proposalData.status === ProposalState.ACTIVE && !showVotingButtons && ( diff --git a/yarn.lock b/yarn.lock index c604b0a044..e21a4c6cd6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4123,11 +4123,6 @@ resolved "https://registry.yarnpkg.com/@types/long/-/long-4.0.1.tgz#459c65fa1867dafe6a8f322c4c51695663cc55e9" integrity sha512-5tXH6Bx/kNGd3MgffdmP4dy2Z+G4eaXw0SE81Tq3BNadtnMR5/ySMzX4SLEzHJzSmPNn4HIdpQsBvXMUykr58w== -"@types/luxon@^1.24.4": - version "1.27.1" - resolved "https://registry.yarnpkg.com/@types/luxon/-/luxon-1.27.1.tgz#aceeb2d5be8fccf541237e184e37ecff5faa9096" - integrity sha512-cPiXpOvPFDr2edMnOXlz3UBDApwUfR+cpizvxCy0n3vp9bz/qe8BWzHPIEFcy+ogUOyjKuCISgyq77ELZPmkkg== - "@types/minimatch@*": version "3.0.5" resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.5.tgz#1001cc5e6a3704b83c236027e77f2f58ea010f40" @@ -14123,11 +14118,6 @@ ltgt@~2.2.0: resolved "https://registry.npmjs.org/ltgt/-/ltgt-2.2.1.tgz" integrity sha1-81ypHEk/e3PaDgdJUwTxezH4fuU= -luxon@^1.25.0: - version "1.27.0" - resolved "https://registry.npmjs.org/luxon/-/luxon-1.27.0.tgz" - integrity sha512-VKsFsPggTA0DvnxtJdiExAucKdAnwbCCNlMM5ENvHlxubqWd0xhZcdb4XgZ7QFNhaRhilXCFxHuoObP5BNA4PA== - lz-string@^1.4.4: version "1.4.4" resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.4.4.tgz#c0d8eaf36059f705796e1e344811cf4c498d3a26"