Merge pull request #13 from yongenaelf/fix/AELF_24674424

fix/AELF_24674424: In all transactions list, the content of age is different compared with aelf explorer

components/transactions/components/AllTransactions.tsx

@@ -5,7 +5,7 @@ import { useRecoilValue } from "recoil";
 import { Table, Tooltip, Flex, Space, Tag } from "antd";
 import { SwapOutlined } from "@ant-design/icons";
 import type { ColumnsType, TablePaginationConfig } from "antd/es/table";
-import { formatDistanceToNow, parseISO, format } from "date-fns";
+import { parseISO, format } from "date-fns";
 import { endEllipsis, middleEllipsis } from "@/utils";
 import { explorerUrlState } from "@/state/selector";
 import { addressState } from "@/state";
@@ -15,6 +15,7 @@ import {MIN_TRANSACTIONS_TO_SHOW_EXPLORER_LINK} from '@/utils/constants';
 import {roundNumber} from '@/utils';
 import rightArrowImage from '@/assets/icon/right-arrow.svg';
 import rightArrowSuccessImage from '@/assets/icon/right-arrow-success.svg';
+import { getLastTwoUnits } from '../constants';
 import { List } from "../../../app/transactions/route";
 import styles from "../style.module.css";
 
@@ -80,9 +81,7 @@ const AllTransactions = () => {
             <span>
               {showDate
                 ? format(parseISO(timestamp), "yyyy-LL-dd kk:mm:ss")
-                : formatDistanceToNow(parseISO(timestamp), {
-                  addSuffix: true,
-                })}
+                : getLastTwoUnits(parseISO(timestamp))}
             </span>
           );
         } catch (err) {

components/transactions/constants.ts

@@ -1,8 +1,25 @@
-
+import { differenceInMilliseconds } from "date-fns";
 import {ChainStateEnum} from "@/state";
 
 export const CHAIN_OPTIONS: Record<ChainStateEnum, string> = {
   [ChainStateEnum.AELF]: 'MainChain '.concat(ChainStateEnum.AELF),
   [ChainStateEnum.tDVV]: 'SideChain '.concat(ChainStateEnum.tDVV),
   [ChainStateEnum.tDVW]: 'SideChain '.concat(ChainStateEnum.tDVW),
+}
+
+export const getLastTwoUnits = (date) => {
+  const now = new Date();
+  const distance = differenceInMilliseconds(now, date);
+
+  const days = Math.floor(distance / (1000 * 60 * 60 * 24));
+  const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+  const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
+
+  if (days > 0) {
+    return `${days} day${days > 1 ? 's' : ''} ${hours} hr${hours > 1 ? 's' : ''} ago`;
+  } else if (hours > 0) {
+    return `${hours} hr${hours > 1 ? 's' : ''} ${minutes} min${minutes > 1 ? 's' : ''} ago`;
+  } else {
+    return `${minutes} min${minutes > 1 ? 's' : ''} ago`;
+  }
 }