diff --git a/public/locales/en.json b/public/locales/en.json index 8c0991a..a7324a7 100644 --- a/public/locales/en.json +++ b/public/locales/en.json @@ -484,7 +484,9 @@ "blocks": { "title": "Network Blocks", + "titleLowest": "Lowest Blocks", "siteTitle": "Network Blocks", + "siteTitleLowest": "Lowest Blocks", "columnHeight": "Height", "columnAddress": "Miner", diff --git a/src/global/AppRouter.tsx b/src/global/AppRouter.tsx index 54d3e4e..6d51276 100644 --- a/src/global/AppRouter.tsx +++ b/src/global/AppRouter.tsx @@ -44,14 +44,15 @@ { path: "/network/addresses/:address/names", name: "addressNames", component: }, { path: "/network/blocks", name: "blocks", component: }, - { path: "/network/blocks/:id", name: "blocks", component: }, + { path: "/network/blocks/lowest", name: "blocksLowest", component: }, + { path: "/network/blocks/:id", name: "block", component: }, { path: "/network/transactions", name: "transactions", component: }, { path: "/network/names", name: "networkNames", component: }, { path: "/network/names/new", name: "networkNamesNew", component: }, - { path: "/network/names/:name", name: "networkNames", + { path: "/network/names/:name", name: "networkName", component: }, { path: "/network/names/:name/history", name: "nameHistory", component: }, diff --git a/src/pages/blocks/BlocksPage.tsx b/src/pages/blocks/BlocksPage.tsx index 801a1cf..cf16a18 100644 --- a/src/pages/blocks/BlocksPage.tsx +++ b/src/pages/blocks/BlocksPage.tsx @@ -12,7 +12,11 @@ import { useBooleanSetting } from "../../utils/settings"; -export function BlocksPage(): JSX.Element { +interface Props { + lowest?: boolean; +} + +export function BlocksPage({ lowest }: Props): JSX.Element { const [error, setError] = useState(); // Used to handle memoisation and auto-refreshing @@ -25,16 +29,20 @@ // Memoise the table so that it only updates the props (thus triggering a // re-fetch of the blocks) when something relevant changes const memoTable = useMemo(() => ( - - ), [usedRefreshID, setError]); + + ), [usedRefreshID, lowest, setError]); return {error ? diff --git a/src/pages/blocks/BlocksTable.tsx b/src/pages/blocks/BlocksTable.tsx index 5df954b..03bb67a 100644 --- a/src/pages/blocks/BlocksTable.tsx +++ b/src/pages/blocks/BlocksTable.tsx @@ -22,10 +22,11 @@ interface Props { // Number used to trigger a refresh of the blocks listing refreshingID?: number; + lowest?: boolean; setError?: Dispatch>; } -export function BlocksTable({ refreshingID, setError }: Props): JSX.Element { +export function BlocksTable({ refreshingID, lowest, setError }: Props): JSX.Element { const { t } = useTranslation(); const [loading, setLoading] = useState(true); @@ -33,8 +34,8 @@ const [options, setOptions] = useState({ limit: 20, offset: 0, - orderBy: "height", - order: "DESC" + orderBy: lowest ? "hash" : "height", + order: lowest ? "ASC" : "DESC" }); // Fetch the blocks from the API, mapping the table options @@ -99,7 +100,8 @@ render: hash => , - sorter: true + sorter: true, + defaultSortOrder: lowest ? "ascend" : undefined }, // Value @@ -131,7 +133,7 @@ width: 200, sorter: true, - defaultSortOrder: "descend" + defaultSortOrder: lowest ? undefined : "descend" } ]} />;