@@ -57,8 +72,7 @@ export const TableRow = ({
...props
}: TableRowProps) => {
const cellClasses = classnames(className, {
- 'border-b bg-black-40 border-black-40 dark:border-white-40':
- modifier === 'bordered',
+ 'border-b border-black-40 dark:border-white-40': modifier === 'bordered',
'border-b-4 bg-black-40 border-b-white dark:bg-white-25 dark:border-b-black':
modifier === 'background',
});
diff --git a/apps/explorer/src/app/components/table/table.spec.tsx b/apps/explorer/src/app/components/table/table.spec.tsx
index 107558357..6937d3c58 100644
--- a/apps/explorer/src/app/components/table/table.spec.tsx
+++ b/apps/explorer/src/app/components/table/table.spec.tsx
@@ -1,15 +1,15 @@
import { render, screen } from '@testing-library/react';
-import { Table, TableRow, TableHeader, TableCell } from './index';
+import { TableWithTbody, TableRow, TableHeader, TableCell } from './index';
describe('Renders all table components', () => {
render(
-
+
);
expect(screen.getByTestId('test-table')).toBeInTheDocument();
@@ -21,11 +21,11 @@ describe('Renders all table components', () => {
describe('Table row', () => {
it('should include classes based on custom "modifier" prop', () => {
render(
-
+
);
expect(screen.getByTestId('modifier-test')).toHaveClass('border-b');
@@ -35,13 +35,13 @@ describe('Table row', () => {
describe('Table header', () => {
it('should accept props i.e. scope="row"', () => {
render(
-
+
);
expect(screen.getByTestId('props-test')).toHaveAttribute('scope');
@@ -49,13 +49,13 @@ describe('Table header', () => {
it('should include custom class based on scope="row"', () => {
render(
-
+
);
expect(screen.getByTestId('scope-class-test')).toHaveClass('text-left');
@@ -65,13 +65,13 @@ describe('Table header', () => {
describe('Table cell', () => {
it('should include class based on custom "modifier" prop', () => {
render(
-
+
);
expect(screen.getByTestId('modifier-class-test')).toHaveClass('py-4');
diff --git a/apps/explorer/src/app/components/txs/txs-per-block.tsx b/apps/explorer/src/app/components/txs/txs-per-block.tsx
index 970462774..2d9a2f6d1 100644
--- a/apps/explorer/src/app/components/txs/txs-per-block.tsx
+++ b/apps/explorer/src/app/components/txs/txs-per-block.tsx
@@ -2,10 +2,10 @@ import useFetch from '../../hooks/use-fetch';
import { ChainExplorerTxResponse } from '../../routes/types/chain-explorer-response';
import { Routes } from '../../routes/router-config';
import { DATA_SOURCES } from '../../config';
-import { Link } from 'react-router-dom';
import { RenderFetched } from '../render-fetched';
-import { TruncateInline } from '../truncate/truncate';
+import { TruncatedLink } from '../truncate/truncated-link';
import { TxOrderType } from './tx-order-type';
+import { Table, TableRow, TableCell } from '../table';
interface TxsPerBlockProps {
blockHeight: string | undefined;
@@ -33,50 +33,46 @@ export const TxsPerBlock = ({ blockHeight }: TxsPerBlockProps) => {
{decodedBlockData && decodedBlockData.length ? (
-
+
-
+
Transaction |
From |
Type |
-
+
{decodedBlockData.map(({ TxHash, PubKey, Type }) => {
return (
-
-
-
-
-
- |
-
-
-
-
- |
-
-
- |
-
+
+
+
+
+
+
+
+
+
+
);
})}
-
+
) : (
diff --git a/apps/explorer/src/app/routes/blocks/id/block.tsx b/apps/explorer/src/app/routes/blocks/id/block.tsx
index 0cddc8a28..ddfaa94ae 100644
--- a/apps/explorer/src/app/routes/blocks/id/block.tsx
+++ b/apps/explorer/src/app/routes/blocks/id/block.tsx
@@ -6,7 +6,7 @@ import { TendermintBlocksResponse } from '../tendermint-blocks-response';
import { RouteTitle } from '../../../components/route-title';
import { SecondsAgo } from '../../../components/seconds-ago';
import {
- Table,
+ TableWithTbody,
TableRow,
TableHeader,
TableCell,
@@ -56,13 +56,13 @@ const Block = () => {
-
+
Mined by
{header.proposer_address}
@@ -75,7 +75,7 @@ const Block = () => {
-
+
{blockData && blockData.result.block.data.txs.length > 0 ? (
) : null}
diff --git a/apps/explorer/src/app/routes/txs/id/tx-content.tsx b/apps/explorer/src/app/routes/txs/id/tx-content.tsx
index 8d334080c..56583a887 100644
--- a/apps/explorer/src/app/routes/txs/id/tx-content.tsx
+++ b/apps/explorer/src/app/routes/txs/id/tx-content.tsx
@@ -1,13 +1,13 @@
import { StatusMessage } from '../../../components/status-message';
import { SyntaxHighlighter } from '../../../components/syntax-highlighter';
import {
- Table,
+ TableWithTbody,
TableCell,
TableHeader,
TableRow,
} from '../../../components/table';
import { TxOrderType } from '../../../components/txs';
-import { ChainExplorerTxResponse } from '../../../routes/types/chain-explorer-response';
+import { ChainExplorerTxResponse } from '../../types/chain-explorer-response';
interface TxContentProps {
data: ChainExplorerTxResponse | undefined;
@@ -22,7 +22,7 @@ export const TxContent = ({ data }: TxContentProps) => {
return (
<>
-
+
Type
@@ -31,7 +31,7 @@ export const TxContent = ({ data }: TxContentProps) => {
-
+
Decoded transaction content
diff --git a/apps/explorer/src/app/routes/txs/id/tx-details.tsx b/apps/explorer/src/app/routes/txs/id/tx-details.tsx
index 6e3f8e6b8..a85300e6a 100644
--- a/apps/explorer/src/app/routes/txs/id/tx-details.tsx
+++ b/apps/explorer/src/app/routes/txs/id/tx-details.tsx
@@ -1,13 +1,13 @@
import { Link } from 'react-router-dom';
import {
- Table,
+ TableWithTbody,
TableCell,
TableHeader,
TableRow,
} from '../../../components/table';
import { TruncateInline } from '../../../components/truncate/truncate';
-import { Routes } from '../../../routes/router-config';
-import { Result } from '../../../routes/txs/tendermint-transaction-response.d';
+import { Routes } from '../../router-config';
+import { Result } from '../tendermint-transaction-response.d';
interface TxDetailsProps {
txData: Result | undefined;
@@ -23,7 +23,7 @@ export const TxDetails = ({ txData, pubKey, className }: TxDetailsProps) => {
}
return (
-
+
Hash
@@ -64,6 +64,6 @@ export const TxDetails = ({ txData, pubKey, className }: TxDetailsProps) => {
/>
-
+
);
};