fix: accounts styles and links fixes

solana-labs · Oct 17, 2019 · 09a689a · 09a689a
1 parent 829a569
commit 09a689a
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 28 deletions.
diff --git a/src/v2/components/Accounts/Detail/Transactions/index.jsx b/src/v2/components/Accounts/Detail/Transactions/index.jsx
@@ -2,6 +2,7 @@
 import React from 'react';
 import {observer} from 'mobx-react-lite';
 import {TableCell, TableRow} from '@material-ui/core';
+import {Link} from 'react-router-dom';
 import Table from 'v2/components/UI/Table';
 import TypeLabel from 'v2/components/UI/TypeLabel';
 
@@ -64,16 +65,26 @@ const Transactions = ({transactions}: {transactions: Array}) => {
     return (
       <TableRow key={transaction.hash}>
         <TableCell>{transaction.hash}</TableCell>
-        <TableCell>{transaction.block}</TableCell>
         <TableCell>
-          {transaction.time}
-          <span className={classes.timeType}>{transaction.timeType}</span>
+          <Link to={`/blocks/${transaction.block}`}>{transaction.block}</Link>
         </TableCell>
-        <TableCell>{transaction.application_id}</TableCell>
         <TableCell>
-          <TypeLabel type={transaction.type} label={transaction.type} />
+          <div>
+            {transaction.time}
+            <span className={classes.timeType}>{transaction.timeType}</span>
+          </div>
         </TableCell>
-        <TableCell>{transaction.confirmations}</TableCell>
+        <TableCell>
+          <Link to={`/applications/${transaction.application_id}`}>
+            {transaction.application_id}
+          </Link>
+        </TableCell>
+        <TableCell>
+          <div>
+            <TypeLabel type={transaction.type} label={transaction.type} />
+          </div>
+        </TableCell>
+        <TableCell width={200}>{transaction.confirmations}</TableCell>
       </TableRow>
     );
   };

diff --git a/src/v2/components/Accounts/Detail/Transactions/styles.js b/src/v2/components/Accounts/Detail/Transactions/styles.js
@@ -9,6 +9,6 @@ export default makeStyles(theme => ({
     borderRadius: 2,
     color: getColor('dark')(theme),
     padding: '2px 10px',
-    marginLeft: 20,
+    marginLeft: 10,
   },
 }));
diff --git a/src/v2/components/Accounts/Detail/index.jsx b/src/v2/components/Accounts/Detail/index.jsx
@@ -14,20 +14,15 @@ import Loader from 'v2/components/UI/Loader';
 import AccountDetailStore from 'v2/stores/accounts/detail';
 import {LAMPORT_SOL_RATIO} from 'v2/constants';
 import TabNav from 'v2/components/UI/TabNav';
-import Chart from './Chart';
 
+import Chart from './Chart';
 import Transactions from './Transactions';
 import AccountCode from './Code';
 import useStyles from './styles';
 
 const AccountDetail = ({match}: {match: Match}) => {
   const classes = useStyles();
-  const {
-    isLoading,
-    accountId,
-    accountInfo,
-    accountView,
-  } = AccountDetailStore;
+  const {isLoading, accountId, accountInfo, accountView} = AccountDetailStore;
 
   if (accountId !== match.params.id) {
     AccountDetailStore.init({accountId: match.params.id});

diff --git a/src/v2/components/Accounts/Table/index.jsx b/src/v2/components/Accounts/Table/index.jsx
@@ -55,9 +55,7 @@ const AccountsTable = ({
     return (
       <TableRow hover key={account.programId}>
         <TableCell>
-          <Link to={`/accounts/${account.programId}`}>
-            {account.programId}
-          </Link>
+          <Link to={`/accounts/${account.programId}`}>{account.programId}</Link>
         </TableCell>
         <TableCell>
           <div>
@@ -87,9 +85,7 @@ const AccountsTable = ({
           </li>
           <li>
             <div className={classes.cardTitle}>Time</div>
-            <div title={account.timestamp}>
-              {asTime(account.timestamp)}
-            </div>
+            <div title={account.timestamp}>{asTime(account.timestamp)}</div>
           </li>
         </ul>
       </div>

diff --git a/src/v2/components/Accounts/index.jsx b/src/v2/components/Accounts/index.jsx
@@ -7,19 +7,14 @@ import SectionHeader from 'v2/components/UI/SectionHeader';
 import AccountsTimelineStore from 'v2/stores/accounts/timeline';
 import formatNum from 'v2/utils/formatNum';
 import CTypography from 'v2/components/UI/CTypography';
+import {Link, Match} from 'react-router-dom';
+
 import Table from './Table';
 import useStyles from './styles';
-import {Link, Match} from 'react-router-dom';
 
 const AccountsPage = ({match}: {match: Match}) => {
   const classes = useStyles();
-  const {
-    accounts,
-    accountCount,
-    start,
-    next,
-    prev,
-  } = AccountsTimelineStore;
+  const {accounts, accountCount, start, next, prev} = AccountsTimelineStore;
 
   if (start !== match.params.start) {
     AccountsTimelineStore.init({start: match.params.start});