refactor: remove direct access to i18next

DimensionDev · Sep 30, 2024 · ecfec8a · ecfec8a
1 parent 51a1f9e
commit ecfec8a
Show file tree

Hide file tree

Showing 64 changed files with 2,978 additions and 518 deletions.
diff --git a/packages/plugins/FriendTech/package.json b/packages/plugins/FriendTech/package.json
@@ -28,6 +28,7 @@
     "@masknet/web3-shared-evm": "workspace:^",
     "@servie/events": "^3.0.0",
     "bignumber.js": "9.1.2",
+    "date-fns": "^4.1.0",
     "react-router-dom": "^6.24.0",
     "react-use": "^17.5.0",
     "urlcat": "^3.1.0"

diff --git a/packages/plugins/FriendTech/src/SiteAdaptor/components/HistoryList.tsx b/packages/plugins/FriendTech/src/SiteAdaptor/components/HistoryList.tsx
@@ -1,7 +1,7 @@
 import { ElementAnchor, EmptyStatus, FormattedBalance, Image } from '@masknet/shared'
 import { makeStyles } from '@masknet/theme'
 import { FriendTech } from '@masknet/web3-providers'
-import { formatBalance, formatElapsed } from '@masknet/web3-shared-base'
+import { formatBalance } from '@masknet/web3-shared-base'
 import { Box, List, ListItem, Skeleton, Typography, type ListProps } from '@mui/material'
 import { useInfiniteQuery } from '@tanstack/react-query'
 import { range } from 'lodash-es'
@@ -10,6 +10,8 @@ import { Link } from 'react-router-dom'
 import urlcat from 'urlcat'
 import { RoutePaths } from '../../constants.js'
 import { Plural, Trans } from '@lingui/macro'
+import { intlFormatDistance } from 'date-fns'
+import { useLingui } from '@lingui/react'
 
 const useStyles = makeStyles()((theme) => ({
     list: {
@@ -70,6 +72,7 @@ export const HistoryList = memo(function HistoryList({ account, className, ...re
         getNextPageParam: (x) => x.nextIndicator,
     })
     const activities = useMemo(() => data?.pages.flatMap((x) => x.data) || [], [data?.pages])
+    const locale = useLingui().i18n.locale
 
     if (!isLoading && !activities.length) {
         return (
@@ -156,7 +159,9 @@ export const HistoryList = memo(function HistoryList({ account, className, ...re
                                     />{' '}
                                     ETH
                                 </Typography>
-                                <Typography fontSize={14}>, {formatElapsed(activity.createdAt)}</Typography>
+                                <Typography fontSize={14}>
+                                    , {intlFormatDistance(new Date(activity.createdAt), new Date(), { locale })}
+                                </Typography>
                             </Box>
                         </Box>
                     </ListItem>

diff --git a/packages/plugins/FriendTech/src/locale/en-US.po b/packages/plugins/FriendTech/src/locale/en-US.po
@@ -29,11 +29,11 @@ msgstr ""
 msgid "{ownCount, plural, one {# Key} other {# Keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:110
+#: src/SiteAdaptor/components/HistoryList.tsx:113
 msgid "{shareAmount, plural, one {{0} bought {shareAmount} <0>{1}</0> key} other {{2} bought {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:125
+#: src/SiteAdaptor/components/HistoryList.tsx:128
 msgid "{shareAmount, plural, one {{0} sold {shareAmount} <0>{1}</0> key} other {{2} sold {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 

diff --git a/packages/plugins/FriendTech/src/locale/ja-JP.po b/packages/plugins/FriendTech/src/locale/ja-JP.po
@@ -34,11 +34,11 @@ msgstr ""
 msgid "{ownCount, plural, one {# Key} other {# Keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:110
+#: src/SiteAdaptor/components/HistoryList.tsx:113
 msgid "{shareAmount, plural, one {{0} bought {shareAmount} <0>{1}</0> key} other {{2} bought {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:125
+#: src/SiteAdaptor/components/HistoryList.tsx:128
 msgid "{shareAmount, plural, one {{0} sold {shareAmount} <0>{1}</0> key} other {{2} sold {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 

diff --git a/packages/plugins/FriendTech/src/locale/ko-KR.po b/packages/plugins/FriendTech/src/locale/ko-KR.po
@@ -34,11 +34,11 @@ msgstr ""
 msgid "{ownCount, plural, one {# Key} other {# Keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:110
+#: src/SiteAdaptor/components/HistoryList.tsx:113
 msgid "{shareAmount, plural, one {{0} bought {shareAmount} <0>{1}</0> key} other {{2} bought {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:125
+#: src/SiteAdaptor/components/HistoryList.tsx:128
 msgid "{shareAmount, plural, one {{0} sold {shareAmount} <0>{1}</0> key} other {{2} sold {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 

diff --git a/packages/plugins/FriendTech/src/locale/zh-CN.po b/packages/plugins/FriendTech/src/locale/zh-CN.po
@@ -34,11 +34,11 @@ msgstr ""
 msgid "{ownCount, plural, one {# Key} other {# Keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:110
+#: src/SiteAdaptor/components/HistoryList.tsx:113
 msgid "{shareAmount, plural, one {{0} bought {shareAmount} <0>{1}</0> key} other {{2} bought {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:125
+#: src/SiteAdaptor/components/HistoryList.tsx:128
 msgid "{shareAmount, plural, one {{0} sold {shareAmount} <0>{1}</0> key} other {{2} sold {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 

diff --git a/packages/plugins/FriendTech/src/locale/zh-TW.po b/packages/plugins/FriendTech/src/locale/zh-TW.po
@@ -34,11 +34,11 @@ msgstr ""
 msgid "{ownCount, plural, one {# Key} other {# Keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:110
+#: src/SiteAdaptor/components/HistoryList.tsx:113
 msgid "{shareAmount, plural, one {{0} bought {shareAmount} <0>{1}</0> key} other {{2} bought {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 
-#: src/SiteAdaptor/components/HistoryList.tsx:125
+#: src/SiteAdaptor/components/HistoryList.tsx:128
 msgid "{shareAmount, plural, one {{0} sold {shareAmount} <0>{1}</0> key} other {{2} sold {shareAmount} <1>{3}</1> keys}}"
 msgstr ""
 

diff --git a/packages/plugins/RedPacket/src/SiteAdaptor/NftRedPacketHistoryItem.tsx b/packages/plugins/RedPacket/src/SiteAdaptor/NftRedPacketHistoryItem.tsx
@@ -13,8 +13,8 @@ import { RedPacketTrans } from '../locales/index.js'
 import { useAvailabilityNftRedPacket } from './hooks/useAvailabilityNftRedPacket.js'
 import { useCreateNftRedPacketReceipt } from './hooks/useCreateNftRedPacketReceipt.js'
 import { useNftAvailabilityComputed } from './hooks/useNftAvailabilityComputed.js'
-import { dateTimeFormat } from './utils/formatDate.js'
 import { Trans } from '@lingui/macro'
+import { useLingui } from '@lingui/react'
 
 const useStyles = makeStyles<{ listItemBackground?: string; listItemBackgroundIcon?: string }>()((
     theme,
@@ -199,6 +199,7 @@ export const NftRedPacketHistoryItem = memo(function NftRedPacketHistoryItem({
     const { data: redpacketStatus } = useAvailabilityNftRedPacket(rpid, account, patchedHistory.chainId)
     const bitStatusList =
         redpacketStatus ? redpacketStatus.bitStatusList : fill(Array(patchedHistory.token_ids.length), false)
+    const locale = useLingui().i18n.locale
 
     return (
         <ListItem className={classes.root}>
@@ -223,7 +224,7 @@ export const NftRedPacketHistoryItem = memo(function NftRedPacketHistoryItem({
                                     {rpid ?
                                         <Typography variant="body1" className={cx(classes.info, classes.message)}>
                                             <Trans>
-                                                {dateTimeFormat(new Date(patchedHistory.creation_time))} (UTC+8)
+                                                {dateTimeFormat(locale, new Date(patchedHistory.creation_time))} (UTC+8)
                                             </Trans>
                                         </Typography>
                                     :   null}
@@ -278,3 +279,10 @@ export const NftRedPacketHistoryItem = memo(function NftRedPacketHistoryItem({
         </ListItem>
     )
 })
+function dateTimeFormat(locale: string, date: Date) {
+    return new Intl.DateTimeFormat(locale, {
+        year: 'numeric',
+        month: 'numeric',
+        day: 'numeric',
+    }).format(date)
+}
diff --git a/packages/plugins/RedPacket/src/SiteAdaptor/utils/formatDate.ts b/packages/plugins/RedPacket/src/SiteAdaptor/utils/formatDate.ts
diff --git a/packages/plugins/RedPacket/src/locale/en-US.po b/packages/plugins/RedPacket/src/locale/en-US.po
@@ -15,7 +15,7 @@ msgstr ""
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:287
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:290
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:225
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:226
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:199
 msgid "{0} (UTC+8)"
 msgstr ""
@@ -49,7 +49,7 @@ msgid "Best Wishes"
 msgstr ""
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:269
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:215
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:216
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:196
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:224
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:184
@@ -147,7 +147,7 @@ msgid "Create the Lucky Drop"
 msgstr ""
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:276
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:221
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:222
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:190
 msgid "Create time:"
 msgstr ""
@@ -403,7 +403,7 @@ msgstr ""
 msgid "Sent"
 msgstr ""
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:246
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:247
 #: src/SiteAdaptor/RedPacket/OperationFooter.tsx:107
 #: src/SiteAdaptor/RedPacketConfirmDialog.tsx:116
 #: src/SiteAdaptor/RedPacketNft.tsx:455
@@ -422,7 +422,7 @@ msgstr ""
 msgid "Split Mode"
 msgstr ""
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:237
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:238
 msgid "The Lucky Drop can’t be sent due to data damage."
 msgstr ""
 

diff --git a/packages/plugins/RedPacket/src/locale/ja-JP.po b/packages/plugins/RedPacket/src/locale/ja-JP.po
@@ -20,7 +20,7 @@ msgstr ""
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:287
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:290
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:225
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:226
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:199
 msgid "{0} (UTC+8)"
 msgstr "{0} (UTC+8)"
@@ -54,7 +54,7 @@ msgid "Best Wishes"
 msgstr "祝福語"
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:269
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:215
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:216
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:196
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:224
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:184
@@ -152,7 +152,7 @@ msgid "Create the Lucky Drop"
 msgstr "ラッキードロップを作成します。"
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:276
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:221
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:222
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:190
 msgid "Create time:"
 msgstr "作成時間:"
@@ -408,7 +408,7 @@ msgstr "サプライズ暗号のプレゼントを送信します。複数のチ
 msgid "Sent"
 msgstr "送信"
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:246
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:247
 #: src/SiteAdaptor/RedPacket/OperationFooter.tsx:107
 #: src/SiteAdaptor/RedPacketConfirmDialog.tsx:116
 #: src/SiteAdaptor/RedPacketNft.tsx:455
@@ -427,7 +427,7 @@ msgstr "問題が発生しました."
 msgid "Split Mode"
 msgstr "分割モード"
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:237
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:238
 msgid "The Lucky Drop can’t be sent due to data damage."
 msgstr "ラッキードロップはデータの損傷のため送信できません。"
 

diff --git a/packages/plugins/RedPacket/src/locale/ko-KR.po b/packages/plugins/RedPacket/src/locale/ko-KR.po
@@ -20,7 +20,7 @@ msgstr ""
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:287
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:290
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:225
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:226
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:199
 msgid "{0} (UTC+8)"
 msgstr ""
@@ -54,7 +54,7 @@ msgid "Best Wishes"
 msgstr "덕담"
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:269
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:215
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:216
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:196
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:224
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:184
@@ -152,7 +152,7 @@ msgid "Create the Lucky Drop"
 msgstr "다음"
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:276
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:221
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:222
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:190
 msgid "Create time:"
 msgstr "생성 시간:"
@@ -408,7 +408,7 @@ msgstr "사프라이즈 트큰과 NFT 선물을 보내세요. 다양한 체인
 msgid "Sent"
 msgstr ""
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:246
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:247
 #: src/SiteAdaptor/RedPacket/OperationFooter.tsx:107
 #: src/SiteAdaptor/RedPacketConfirmDialog.tsx:116
 #: src/SiteAdaptor/RedPacketNft.tsx:455
@@ -427,7 +427,7 @@ msgstr "오류가 발생합니다."
 msgid "Split Mode"
 msgstr "스플릿 모드"
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:237
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:238
 msgid "The Lucky Drop can’t be sent due to data damage."
 msgstr "테이터 훼손때문에 행운 드랍을 보낼 수 없습니다."
 

diff --git a/packages/plugins/RedPacket/src/locale/zh-CN.po b/packages/plugins/RedPacket/src/locale/zh-CN.po
@@ -20,7 +20,7 @@ msgstr ""
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:287
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:290
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:225
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:226
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:199
 msgid "{0} (UTC+8)"
 msgstr "{0} (UTC+8)"
@@ -54,7 +54,7 @@ msgid "Best Wishes"
 msgstr "祝福语"
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:269
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:215
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:216
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:196
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:224
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:184
@@ -152,7 +152,7 @@ msgid "Create the Lucky Drop"
 msgstr "下一步"
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:276
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:221
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:222
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:190
 msgid "Create time:"
 msgstr "创建时间："
@@ -408,7 +408,7 @@ msgstr "发送一个惊喜的加密货币红包。支持多个链上的代币和
 msgid "Sent"
 msgstr ""
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:246
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:247
 #: src/SiteAdaptor/RedPacket/OperationFooter.tsx:107
 #: src/SiteAdaptor/RedPacketConfirmDialog.tsx:116
 #: src/SiteAdaptor/RedPacketNft.tsx:455
@@ -427,7 +427,7 @@ msgstr "出现了一些问题。"
 msgid "Split Mode"
 msgstr "拆分模式"
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:237
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:238
 msgid "The Lucky Drop can’t be sent due to data damage."
 msgstr "由于数据损坏，红包无法发送。"
 

diff --git a/packages/plugins/RedPacket/src/locale/zh-TW.po b/packages/plugins/RedPacket/src/locale/zh-TW.po
@@ -20,7 +20,7 @@ msgstr ""
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:287
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:290
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:225
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:226
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:199
 msgid "{0} (UTC+8)"
 msgstr ""
@@ -54,7 +54,7 @@ msgid "Best Wishes"
 msgstr ""
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:269
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:215
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:216
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:196
 #: src/SiteAdaptor/RedPacketERC20Form.tsx:224
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:184
@@ -152,7 +152,7 @@ msgid "Create the Lucky Drop"
 msgstr "下一步"
 
 #: src/SiteAdaptor/FireflyRedPacketDetailsItem.tsx:276
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:221
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:222
 #: src/SiteAdaptor/RedPacketInHistoryList.tsx:190
 msgid "Create time:"
 msgstr ""
@@ -408,7 +408,7 @@ msgstr ""
 msgid "Sent"
 msgstr ""
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:246
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:247
 #: src/SiteAdaptor/RedPacket/OperationFooter.tsx:107
 #: src/SiteAdaptor/RedPacketConfirmDialog.tsx:116
 #: src/SiteAdaptor/RedPacketNft.tsx:455
@@ -427,7 +427,7 @@ msgstr ""
 msgid "Split Mode"
 msgstr ""
 
-#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:237
+#: src/SiteAdaptor/NftRedPacketHistoryItem.tsx:238
 msgid "The Lucky Drop can’t be sent due to data damage."
 msgstr ""