Skip to content

Commit

Permalink
Merge pull request #205 from pastelnetwork/feature/improvement-ticket…
Browse files Browse the repository at this point in the history
…-page

improvement ticket page
  • Loading branch information
ngvtuan authored Nov 17, 2023
2 parents 18f1336 + 58f65ee commit 4ce9030
Show file tree
Hide file tree
Showing 30 changed files with 760 additions and 189 deletions.
56 changes: 56 additions & 0 deletions public/locales/en/translation.json
Original file line number Diff line number Diff line change
Expand Up @@ -1029,6 +1029,10 @@
"signature3": {
"message": "Registering Supernode #3 - Signature:",
"description": "Used for the signatures component"
},
"registeringSupernode": {
"message": "Registering Supernode",
"description": "Used for the signatures component"
}
},
"transferTicket": {
Expand Down Expand Up @@ -1063,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 Expand Up @@ -1257,6 +1269,10 @@
"message": "Download CSV",
"description": "Used for the CascadeAndSenseStatistics page"
},
"downloading": {
"message": "Downloading...",
"description": "Used for the CascadeAndSenseStatistics page"
},
"address": {
"message": "{{currency}} Address",
"description": "Used for the CascadeAndSenseStatistics page"
Expand Down Expand Up @@ -2256,6 +2272,10 @@
"feeSchedule": {
"message": "Fee Schedule",
"description": "Used for the HistoricalStatistics page"
},
"pslBurnt": {
"message": "{{currency}} Burnt",
"description": "Used for the HistoricalStatistics page"
}
},
"movement": {
Expand Down Expand Up @@ -2862,6 +2882,30 @@
"senseAndNFTCollectionTickets": {
"message": "Sense and NFT Collection Tickets",
"description": "Used for the Tickets page"
},
"sortingBy": {
"message": "Sorting by:",
"description": "Used for the Tickets page"
},
"timestamp": {
"message": "Timestamp",
"description": "Used for the Tickets page"
},
"blockNumber": {
"message": "Block Height of the TXID",
"description": "Used for the Tickets page"
},
"blockNumberRegistered": {
"message": "Block Height When Ticket Registered",
"description": "Used for the Tickets page"
},
"totalCost": {
"message": "Total Cost",
"description": "Used for the Tickets page"
},
"registeringSupernode": {
"message": "Registering Supernode",
"description": "Used for the Tickets page"
}
},
"burned": {
Expand Down Expand Up @@ -3513,6 +3557,10 @@
"feeSchedule": {
"message": "Fee Schedule",
"description": "Used for the routes"
},
"pslBurnt": {
"message": "{{currency}} Burnt",
"description": "Used for the routes"
}
},
"chartOptions": {
Expand Down Expand Up @@ -3667,6 +3715,10 @@
"totalFingerprints": {
"message": "Total fingerprints",
"description": "Used for the chartOptions"
},
"pslBurnt": {
"message": "{{currency}} Burnt",
"description": "Used for the chartOptions"
}
},
"constants": {
Expand Down Expand Up @@ -3868,6 +3920,10 @@
"feeSchedule": {
"message": "Fee Schedule",
"description": "Used for the constants"
},
"pslBurnt": {
"message": "{{currency}} Burnt",
"description": "Used for the constants"
}
}
}
Expand Down
10 changes: 6 additions & 4 deletions src/components/Summary/Summary.tsx
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
226 changes: 132 additions & 94 deletions src/components/Ticket/Signatures.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,10 @@
import { useState } from 'react';
import Grid from '@material-ui/core/Grid';
import Box from '@material-ui/core/Box';
import parse from 'html-react-parser';
import AccordionSummary from '@material-ui/core/AccordionSummary';
import AccordionDetails from '@material-ui/core/AccordionDetails';
import { ExpandMore as ExpandMoreIcon } from '@material-ui/icons';

import { ISignature } from '@utils/types/ITransactions';
import { translate } from '@utils/helpers/i18n';
Expand All @@ -13,6 +17,8 @@ interface ISignaturesProps {
}

const Signatures: React.FC<ISignaturesProps> = ({ signatures, signature, variant }) => {
const [isExpanded, setIsExpanded] = useState(false);

if (signature) {
if (variant === 'transaction') {
return (
Expand Down Expand Up @@ -45,100 +51,132 @@ const Signatures: React.FC<ISignaturesProps> = ({ signatures, signature, variant
if (signatures) {
return (
<Box>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.pastelIDOfUserSubmittingTicket'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent>{Object.keys(signatures.principal)[0]}</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.signatureOfUser'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.values(signatures.principal)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.supernode1'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.keys(signatures.mn1)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.signature1'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.values(signatures.mn1)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.supernode2'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.keys(signatures.mn2)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.signature2'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.values(signatures.mn2)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.supernode3'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.keys(signatures.mn3)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.signature3'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.values(signatures.mn3)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Styles.Accordion
expanded={isExpanded}
onChange={(event, isPanelExpanded) => setIsExpanded(isPanelExpanded)}
>
<AccordionSummary>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.registeringSupernode'))}:
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="expand-more">
{isExpanded
? parse(translate('components.ticket.actionRegistrationTicket.hideDetail'))
: parse(
translate('components.ticket.actionRegistrationTicket.clickToSeeDetail'),
)}{' '}
<ExpandMoreIcon />
</Styles.TicketContent>
</Grid>
</Grid>
</AccordionSummary>
<AccordionDetails>
<Box>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(
translate('components.ticket.signatures.pastelIDOfUserSubmittingTicket'),
)}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent>
{Object.keys(signatures.principal)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.signatureOfUser'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.values(signatures.principal)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.supernode1'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.keys(signatures.mn1)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.signature1'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.values(signatures.mn1)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.supernode2'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.keys(signatures.mn2)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.signature2'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.values(signatures.mn2)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.supernode3'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.keys(signatures.mn3)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
<Grid container spacing={3}>
<Grid item xs={4} sm={3} className="max-w-355">
<Styles.TicketTitle>
{parse(translate('components.ticket.signatures.signature3'))}
</Styles.TicketTitle>
</Grid>
<Grid item xs={8} sm={9}>
<Styles.TicketContent className="break-all">
{Object.values(signatures.mn3)[0]}
</Styles.TicketContent>
</Grid>
</Grid>
</Box>
</AccordionDetails>
</Styles.Accordion>
</Box>
);
}
Expand Down
Loading

0 comments on commit 4ce9030

Please sign in to comment.