Show less columns in Consensus transactions list

oasisprotocol · Sep 4, 2024 · a96ce14 · a96ce14
1 parent dc344bb
commit a96ce14
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 38 deletions.
diff --git a/src/app/components/Transactions/ConsensusTransactionDetails.tsx b/src/app/components/Transactions/ConsensusTransactionDetails.tsx
@@ -21,6 +21,7 @@ export const ConsensusTransactionDetails: FC<ConsensusTransactionDetailsProps> =
   return <Box sx={{ display: 'flex', flexWrap: 'no-wrap', gap: '20px' }}>{details}</Box>
 }
 
+// TODO: validate when new designs are ready and use in details column
 const getConsensusTransactionDetails = (t: TFunction, transaction: Transaction, ownAddress?: string) => {
   const scope = { layer: transaction.layer, network: transaction.network }
 

diff --git a/src/app/components/Transactions/ConsensusTransactions.tsx b/src/app/components/Transactions/ConsensusTransactions.tsx
@@ -66,15 +66,15 @@ export const ConsensusTransactions: FC<ConsensusTransactionsProps> = ({
     { key: 'hash', content: t('common.hash') },
     { key: 'block', content: t('common.block') },
     { key: 'age', content: t('common.age'), align: TableCellAlign.Right },
+    { key: 'type', content: t('common.type') },
+    { key: 'from', content: t('common.from'), width: '150px' },
     ...(verbose
       ? [
-          { key: 'type', content: t('common.type') },
-          { key: 'from', content: t('common.from'), width: '150px' },
           { key: 'to', content: t('common.to'), width: '150px' },
           { key: 'value', align: TableCellAlign.Right, content: t('common.amount'), width: '250px' },
-          { key: 'txnFee', content: t('common.fee'), align: TableCellAlign.Right, width: '250px' },
         ]
       : []),
+    { key: 'txnFee', content: t('common.fee'), align: TableCellAlign.Right, width: '250px' },
   ]
 
   const tableRows = transactions?.map(transaction => {
@@ -98,38 +98,38 @@ export const ConsensusTransactions: FC<ConsensusTransactionsProps> = ({
           content: <Age sinceTimestamp={transaction.timestamp} />,
           key: 'timestamp',
         },
+        {
+          content: <ConsensusTransactionMethod method={transaction.method} truncate />,
+          key: 'type',
+        },
+        {
+          align: TableCellAlign.Right,
+          content: (
+            <Box
+              sx={{
+                display: 'flex',
+                alignItems: 'center',
+                position: 'relative',
+                pr: 3,
+              }}
+            >
+              <AccountLink
+                labelOnly={!!ownAddress && transaction.sender === ownAddress}
+                scope={transaction}
+                address={transaction.sender}
+                alwaysTrim
+              />
+              {transaction.to && (
+                <StyledCircle>
+                  <ArrowForwardIcon fontSize="inherit" />
+                </StyledCircle>
+              )}
+            </Box>
+          ),
+          key: 'from',
+        },
         ...(verbose
           ? [
-              {
-                content: <ConsensusTransactionMethod method={transaction.method} truncate />,
-                key: 'type',
-              },
-              {
-                align: TableCellAlign.Right,
-                content: (
-                  <Box
-                    sx={{
-                      display: 'flex',
-                      alignItems: 'center',
-                      position: 'relative',
-                      pr: 3,
-                    }}
-                  >
-                    <AccountLink
-                      labelOnly={!!ownAddress && transaction.sender === ownAddress}
-                      scope={transaction}
-                      address={transaction.sender}
-                      alwaysTrim
-                    />
-                    {transaction.to && (
-                      <StyledCircle>
-                        <ArrowForwardIcon fontSize="inherit" />
-                      </StyledCircle>
-                    )}
-                  </Box>
-                ),
-                key: 'from',
-              },
               {
                 content: transaction.to ? (
                   <AccountLink
@@ -146,13 +146,13 @@ export const ConsensusTransactions: FC<ConsensusTransactionsProps> = ({
                 content: getConsensusAmount(t, transaction),
                 key: 'value',
               },
-              {
-                align: TableCellAlign.Right,
-                content: <RoundedBalance value={transaction.fee} ticker={transaction.ticker} />,
-                key: 'fee_amount',
-              },
             ]
           : []),
+        {
+          align: TableCellAlign.Right,
+          content: <RoundedBalance value={transaction.fee} ticker={transaction.ticker} />,
+          key: 'fee_amount',
+        },
       ],
       highlight: transaction.markAsNew,
     }

diff --git a/src/app/pages/ConsensusDashboardPage/LatestConsensusTransactions.tsx b/src/app/pages/ConsensusDashboardPage/LatestConsensusTransactions.tsx
@@ -43,6 +43,7 @@ export const LatestConsensusTransactions: FC<{ scope: SearchScope }> = ({ scope
           isLoading={transactionsQuery.isLoading}
           limit={limit}
           pagination={false}
+          verbose={false}
         />
       </CardContent>
     </Card>

diff --git a/src/app/pages/ConsensusTransactionsPage/index.tsx b/src/app/pages/ConsensusTransactionsPage/index.tsx
@@ -92,6 +92,7 @@ export const ConsensusTransactionsPage: FC = () => {
               isTotalCountClipped: data?.data.is_total_count_clipped,
               rowsPerPage: limit,
             }}
+            verbose={false}
           />
         )}
-Original file line number
+Diff line change
@@ Expand Up / @@ -92,6 +92,7 @@ export const ConsensusTransactionsPage: FC = () => { @@
                   isTotalCountClipped: data?.data.is_total_count_clipped,
                   rowsPerPage: limit,
                 }}
+                verbose={false}
               />
             )}
@@ Expand Down @@