Skip to content

Commit

Permalink
update UI for TransferTicket and Network (kB/s) chart section in home…
Browse files Browse the repository at this point in the history 
…page
  • Loading branch information
@ngvtuan
ngvtuan committed Nov 7, 2023
1 parent 772ded5 commit 61d396f
Show file tree
Hide file tree
Showing 7 changed files with 47 additions and 12 deletions.
8 changes: 8 additions & 0 deletions public/locales/en/translation.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1067,6 +1067,14 @@
"timestamp": {
"message": "Timestamp:",
"description": "Used for the TransferTicket component"
},
"activationTxID": {
"message": "Activation txID:",
"description": "Used for the TransferTicket component"
},
"ticketDetail": {
"message": "Ticket detail",
"description": "Used for the TransferTicket component"
}
},
"userNameChangeTicket": {
Expand Down
10 changes: 6 additions & 4 deletions src/components/Summary/Summary.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -319,7 +319,9 @@ const Summary: React.FC = () => {
}

if (sumKey === 'gigaHashPerSec') {
return formatNumber(Number(value) * NETWORK_RANGE, { decimalsLength: 2 });
return formatNumber(Number(value.toString().replaceAll(',', '')) * NETWORK_RANGE, {
decimalsLength: 2,
});
}

return value;
Expand Down Expand Up @@ -351,7 +353,7 @@ const Summary: React.FC = () => {
color="textSecondary"
noWrap
percentagecolor={`${
difference > 0
Number(difference) > 0
? themeVariant.custom.green.success
: themeVariant.custom.red.error
}`}
Expand All @@ -361,9 +363,9 @@ const Summary: React.FC = () => {
: parse(translate('components.summary.last24h'))}
<br />
<span>
{`${difference > 0 ? '+' : ''}`}
{`${Number(difference) > 0 ? '+' : ''}`}
{difference}%&nbsp;
{difference > 0 ? (
{Number(difference) > 0 ? (
<svg
width="10"
height="10"
Expand Down
23 changes: 22 additions & 1 deletion src/components/Ticket/TransferTicket.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,9 +62,11 @@ const TransferTicket: React.FC<ITransferTicketProps> = ({ ticket, variant }) =>
/>
);
};

const getOfferType = () => {
switch (ticket.otherData.offerType) {
case 'sense':
case 'sense-offer':
return parse(translate('components.ticket.offerTicket.sense'));
case 'cascade':
return parse(translate('components.ticket.offerTicket.cascade'));
Expand All @@ -73,6 +75,18 @@ const TransferTicket: React.FC<ITransferTicketProps> = ({ ticket, variant }) =>
}
};

const itemUrl = () => {
switch (ticket.otherData.offerType) {
case 'sense':
case 'sense-offer':
return `/sense?txid=${ticket.otherData.regTxId}`;
case 'cascade':
return `/cascade?txid=${ticket.otherData.regTxId}`;
default:
return `/nft?txid=${ticket.otherData.regTxId}`;
}
};

return (
<Styles.OfferWrapper>
<Grid container spacing={3}>
Expand Down Expand Up @@ -128,7 +142,7 @@ const TransferTicket: React.FC<ITransferTicketProps> = ({ ticket, variant }) =>
<Grid container spacing={3} className="mb-sm-8">
<Grid item xs={12} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.transferTicket.itemTxId'))}
{parse(translate('components.ticket.transferTicket.activationTxID'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={12} sm={9}>
Expand Down Expand Up @@ -157,7 +171,14 @@ const TransferTicket: React.FC<ITransferTicketProps> = ({ ticket, variant }) =>
value={ticket.offer_txid}
title={ticket.offer_txid}
className="address-link"
/>{' '}
(
<RouterLink
route={itemUrl()}
value={parse(translate('components.ticket.transferTicket.ticketDetail'))}
className="address-link"
/>
)
</Styles.TicketContent>
</Grid>
</Grid>
Expand Down
8 changes: 4 additions & 4 deletions src/pages/Details/CascadeDetails/Transfers.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@ const Transfers = () => {
<div className="registration_txid">
<CopyButton copyText={item.registration_txid} />
<RouterLink
route={`${ROUTES.PASTEL_ID_DETAILS}/${item.registration_txid}`}
route={`${ROUTES.TRANSACTION_DETAILS}/${item.registration_txid}`}
value={formatAddress(item.registration_txid, 5, -5)}
title={item.registration_txid}
className="address-link nowrap inline-block read-more full"
Expand All @@ -120,7 +120,7 @@ const Transfers = () => {
<div className="registration_txid">
<CopyButton copyText={item.offer_txid} />
<RouterLink
route={`${ROUTES.PASTEL_ID_DETAILS}/${item.offer_txid}`}
route={`${ROUTES.TRANSACTION_DETAILS}/${item.offer_txid}`}
value={formatAddress(item.offer_txid, 5, -5)}
title={item.offer_txid}
className="address-link nowrap inline-block read-more full"
Expand All @@ -138,7 +138,7 @@ const Transfers = () => {
<div className="registration_txid">
<CopyButton copyText={item.accept_txid} />
<RouterLink
route={`${ROUTES.PASTEL_ID_DETAILS}/${item.accept_txid}`}
route={`${ROUTES.TRANSACTION_DETAILS}/${item.accept_txid}`}
value={formatAddress(item.accept_txid, 5, -5)}
title={item.accept_txid}
className="address-link nowrap inline-block read-more full"
Expand All @@ -156,7 +156,7 @@ const Transfers = () => {
<div className="registration_txid">
<CopyButton copyText={item.item_txid} />
<RouterLink
route={`${ROUTES.PASTEL_ID_DETAILS}/${item.item_txid}`}
route={`${ROUTES.TRANSACTION_DETAILS}/${item.item_txid}`}
value={formatAddress(item.item_txid, 5, -5)}
title={item.item_txid}
className="address-link nowrap inline-block read-more full"
Expand Down
4 changes: 4 additions & 0 deletions src/pages/Details/TransactionDetails/TransactionDetails.styles.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,10 @@ export const Wrapper = styled('div')`
margin-bottom: 20px;
}
.mt-24px {
margin-top: 24px;
}
.none-border-radius-top {
border-top-left-radius: 0;
border-top-right-radius: 0;
Expand Down
2 changes: 1 addition & 1 deletion src/pages/Details/TransactionDetails/TransactionDetails.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -225,7 +225,7 @@ const TransactionDetails = () => {
)}
</Styles.GridStyle>
{tickets.length ? (
<Styles.GridStyle item>
<Styles.GridStyle item className="mt-24px">
<TicketsList
data={tickets}
senses={senses}
Expand Down
4 changes: 2 additions & 2 deletions src/utils/helpers/statisticsLib.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ export function transformMarketVolumePriceInfo(
dataY1.push(+y1.toFixed(8));
dataY2.push(Number(y2.toFixed(2)));
}
if (period === '24h' && checkValidateData(prices[prices.length - 1][0])) {
if (period === '24h' && prices?.length && checkValidateData(prices[prices.length - 1][0])) {
dataX.push(format(Date.now(), 'MM/dd/yyyy hh:mm aa') || '');
dataY1.push(Number(dataY1[dataY1.length - 1]));
dataY2.push(Number(dataY2[dataY2.length - 1]));
Expand All @@ -180,7 +180,7 @@ export function transformMarketCapPriceInfo(
dataY1.push(+y1.toFixed(8));
dataY2.push(Math.round(y2));
}
if (period === '24h' && checkValidateData(prices[prices.length - 1][0])) {
if (period === '24h' && prices?.length && checkValidateData(prices[prices.length - 1][0])) {
dataX.push(format(Date.now(), 'MM/dd/yyyy hh:mm aa') || '');
dataY1.push(Number(dataY1[dataY1.length - 1]));
dataY2.push(Number(dataY2[dataY2.length - 1]));
Expand Down

0 comments on commit 61d396f

Please sign in to comment.