feat: improve date/time format

iotaledger · Dec 27, 2024 · 4c7e7c5 · 4c7e7c5
1 parent ab9526d
commit 4c7e7c5
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 10 deletions.
diff --git a/apps/wallet-dashboard/components/Dialogs/vesting/VestingScheduleBox.tsx b/apps/wallet-dashboard/components/Dialogs/vesting/VestingScheduleBox.tsx
@@ -3,7 +3,7 @@
 
 import { useGetCurrentEpochStartTimestamp } from '@/hooks';
 import { DisplayStats, DisplayStatsType } from '@iota/apps-ui-kit';
-import { useFormatCoin } from '@iota/core';
+import { formatDate, useFormatCoin } from '@iota/core';
 import { IOTA_TYPE_ARG } from '@iota/iota-sdk/utils';
 import { LockLocked } from '@iota/ui-icons';
 
@@ -20,9 +20,15 @@ export function VestingScheduleBox({
     const { data: currentEpochMs } = useGetCurrentEpochStartTimestamp();
 
     const isLocked = expirationTimestampMs > Number(currentEpochMs);
+    const transactionDate = formatDate(Number(expirationTimestampMs), [
+        'month',
+        'day',
+        'hour',
+        'minute',
+    ]);
     return (
         <DisplayStats
-            label={new Date(expirationTimestampMs).toLocaleDateString()}
+            label={transactionDate}
             value={`${formattedAmountVested} ${amountVestedSymbol}`}
             type={isLocked ? DisplayStatsType.Default : DisplayStatsType.Secondary}
             icon={isLocked && <LockLocked className="h-4 w-4" />}

diff --git a/apps/wallet-dashboard/components/transactions/TransactionTile.tsx b/apps/wallet-dashboard/components/transactions/TransactionTile.tsx
@@ -5,7 +5,6 @@
 
 import React, { useState } from 'react';
 import TransactionIcon from './TransactionIcon';
-import formatTimestamp from '@/lib/utils/time';
 import { ExtendedTransaction, TransactionState } from '@/lib/interfaces';
 import {
     Card,
@@ -18,7 +17,7 @@ import {
     CardActionType,
     Dialog,
 } from '@iota/apps-ui-kit';
-import { useFormatCoin, getLabel, useTransactionSummary } from '@iota/core';
+import { useFormatCoin, getLabel, useTransactionSummary, formatDate } from '@iota/core';
 import { IOTA_TYPE_ARG } from '@iota/iota-sdk/utils';
 import { useCurrentAccount } from '@iota/dapp-kit';
 import { TransactionDetailsLayout } from '../Dialogs/transaction/TransactionDetailsLayout';
@@ -47,7 +46,9 @@ export function TransactionTile({ transaction }: TransactionTileProps): JSX.Elem
         setOpen(true);
     }
 
-    const transactionDate = transaction?.timestamp && formatTimestamp(transaction.timestamp);
+    const transactionDate =
+        transaction?.timestamp &&
+        formatDate(Number(transaction?.timestamp), ['month', 'day', 'hour', 'minute']);
 
     return (
         <>

diff --git a/apps/wallet-dashboard/lib/utils/time.ts b/apps/wallet-dashboard/lib/utils/time.ts
@@ -1,11 +1,6 @@
 // Copyright (c) 2024 IOTA Stiftung
 // SPDX-License-Identifier: Apache-2.0
 
-export default function formatTimestamp(timeStamp: number): string {
-    const date = new Date(timeStamp);
-    return new Intl.DateTimeFormat('en-US').format(date);
-}
-
 export function parseTimestamp(timestampMs: string): number {
     const timestamp = parseInt(timestampMs, 10);
     if (!Number.isFinite(timestamp)) {