Depracating warning

src/components/OverviewSingleAssetTab.tsx

@@ -1,6 +1,5 @@
 import React from 'react'
 import { Link as RouterLink, useParams } from 'react-router-dom'
-import moment from 'moment'
 
 import { Box, Link, Table, TableBody, TableContainer, TableRow, Tooltip, Typography } from '@mui/material'
 
@@ -13,6 +12,7 @@ import { useDataSetAssetsContext } from '../hooks/useDatachainOutput'
 
 import { getVerificationComponent } from './Verifications'
 import Issuer from './Issuer'
+import { formatTimeLeft } from '../utils/timestapFormater'
 
 const OverviewSingleAssetTab = () => {
   const { assetContract, assetTokenId, assetSerial, id } = useParams()
@@ -73,9 +73,7 @@ const OverviewSingleAssetTab = () => {
               <TableRow sx={{ backgroundColor: 'grey.50' }}>
                 <TableNameCell>Last verified</TableNameCell>
                 <TableValueCell>
-                  {!isLoading && lastVerified
-                    ? moment(moment.unix(lastVerified).utc().format('DD MMM YYYY HH:mm:ss [UTC]')).fromNow()
-                    : 'loading...'}
+                  {!isLoading && lastVerified ? formatTimeLeft(lastVerified) : 'loading...'}
                 </TableValueCell>
               </TableRow>
 

src/components/VerificationList.tsx

@@ -13,6 +13,7 @@ import { useDataSetAssetsContext } from '../hooks/useDatachainOutput'
 import Pagination from './Pagination'
 
 import Gray from '../assets/images/Collection-gray.png'
+import { formatTimeLeft } from '../utils/timestapFormater'
 
 const PageSize = 5
 
@@ -94,7 +95,7 @@ const VerificationList = () => {
                 const publisher = asset?.metadata?.publisher
                 const datasetContract = asset?.metadata?.contract
                 const datasetAssetClass = asset?.metadata?.['asset-class']
-                const date = moment(moment.unix(lastVerified).utc().format('DD MMM YYYY HH:mm:ss [UTC]')).fromNow()
+                const date = formatTimeLeft(lastVerified)
                 const image = asset.metadata.image === '' ? Gray : asset.metadata.image
                 return (
                   <TableBodyRow

src/utils/timestapFormater.ts

@@ -6,7 +6,7 @@ export const formatDate = (timestamp: number, formatType: string = format) =>
   moment.unix(timestamp).utc().format(formatType)
 
 export const formatTimeLeft = (timestamp: number, formatType: string = format) =>
-  moment(moment.unix(timestamp).utc().format(formatType)).fromNow()
+  moment(moment.unix(timestamp).toISOString()).fromNow()
 
 export const formatTimeStamp = (timestamp: number) => {
   const from = moment.unix(timestamp).utc().format(format)

src/views/Dataset.tsx

@@ -21,6 +21,7 @@ import VerifiedFiles from './VerifiedFiles'
 
 import { useDataSetAssetsContext, StatusType } from '../hooks/useDatachainOutput'
 import { customTheme } from '../theme'
+import { formatTimeLeft } from '../utils/timestapFormater'
 
 const ContentContainer = styled(Container)(({ theme }) => ({
   [theme.breakpoints.up('xl')]: {
@@ -258,10 +259,7 @@ const Dataset = () => {
                 ml={1.25}
                 sx={{ fontSize: '14px', fontStyle: 'italic', color: 'grey.400' }}
               >
-                Last verified{' '}
-                {isLoading || !lastVerified
-                  ? 'loading...'
-                  : moment(moment.unix(lastVerified).utc().format('DD MMM YYYY HH:mm:ss [UTC]')).fromNow()}
+                Last verified {isLoading || !lastVerified ? 'loading...' : formatTimeLeft(lastVerified)}
               </Typography>
             </Box>
           </Box>