diff --git a/explorer/src/components/block/BlockAccountsCard.tsx b/explorer/src/components/block/BlockAccountsCard.tsx index 9a78e54e8..2d1c0a7ab 100644 --- a/explorer/src/components/block/BlockAccountsCard.tsx +++ b/explorer/src/components/block/BlockAccountsCard.tsx @@ -1,6 +1,8 @@ import React from "react"; import { BlockResponse, PublicKey } from "@solana/web3.js"; import { Address } from "components/common/Address"; +import { Link } from "react-router-dom"; +import { clusterPath } from "utils/url"; type AccountStats = { reads: number; @@ -9,7 +11,13 @@ type AccountStats = { const PAGE_SIZE = 25; -export function BlockAccountsCard({ block }: { block: BlockResponse }) { +export function BlockAccountsCard({ + block, + blockSlot, +}: { + block: BlockResponse; + blockSlot: number; +}) { const [numDisplayed, setNumDisplayed] = React.useState(10); const totalTransactions = block.transactions.length; @@ -76,7 +84,16 @@ export function BlockAccountsCard({ block }: { block: BlockResponse }) { return ( -
+ +
+ {writes} {reads} diff --git a/explorer/src/components/block/BlockHistoryCard.tsx b/explorer/src/components/block/BlockHistoryCard.tsx index da1983bd9..af8c41801 100644 --- a/explorer/src/components/block/BlockHistoryCard.tsx +++ b/explorer/src/components/block/BlockHistoryCard.tsx @@ -18,11 +18,21 @@ import { parseProgramLogs } from "utils/program-logs"; const PAGE_SIZE = 25; -const useQueryFilter = (query: URLSearchParams): string => { +const useQueryProgramFilter = (query: URLSearchParams): string => { const filter = query.get("filter"); return filter || ""; }; +const useQueryAccountFilter = (query: URLSearchParams): PublicKey | null => { + const filter = query.get("accountFilter"); + if (filter !== null) { + try { + return new PublicKey(filter); + } catch {} + } + return null; +}; + type SortMode = "index" | "compute"; const useQuerySort = (query: URLSearchParams): SortMode => { const sort = query.get("sort"); @@ -43,7 +53,8 @@ export function BlockHistoryCard({ block }: { block: BlockResponse }) { const [numDisplayed, setNumDisplayed] = React.useState(PAGE_SIZE); const [showDropdown, setDropdown] = React.useState(false); const query = useQuery(); - const filter = useQueryFilter(query); + const programFilter = useQueryProgramFilter(query); + const accountFilter = useQueryAccountFilter(query); const sortMode = useQuerySort(query); const { cluster } = useCluster(); const location = useLocation(); @@ -107,26 +118,40 @@ export function BlockHistoryCard({ block }: { block: BlockResponse }) { const filteredTransactions = React.useMemo(() => { const voteFilter = VOTE_PROGRAM_ID.toBase58(); - const filteredTxs = transactions.filter(({ invocations }) => { - if (filter === ALL_TRANSACTIONS) { - return true; - } else if (filter === HIDE_VOTES) { - // hide vote txs that don't invoke any other programs - return !(invocations.size === 1 || invocations.has(voteFilter)); - } - return invocations.has(filter); - }); + const filteredTxs = transactions + .filter(({ invocations }) => { + if (programFilter === ALL_TRANSACTIONS) { + return true; + } else if (programFilter === HIDE_VOTES) { + // hide vote txs that don't invoke any other programs + return !(invocations.size === 1 || invocations.has(voteFilter)); + } + return invocations.has(programFilter); + }) + .filter(({ index }) => { + if (accountFilter === null) { + return true; + } + const tx = block.transactions[index].transaction; + return tx.message.accountKeys.find((key) => key.equals(accountFilter)); + }); if (sortMode === "compute") { filteredTxs.sort((a, b) => b.computeUnits - a.computeUnits); } return filteredTxs; - }, [transactions, filter, sortMode]); + }, [ + block.transactions, + transactions, + programFilter, + accountFilter, + sortMode, + ]); if (filteredTransactions.length === 0) { const errorMessage = - filter === ALL_TRANSACTIONS + programFilter === ALL_TRANSACTIONS ? "This block has no transactions" : "No transactions found with this filter"; return ; @@ -144,7 +169,7 @@ export function BlockHistoryCard({ block }: { block: BlockResponse }) {

{title}

setDropdown((show) => !show)} show={showDropdown} invokedPrograms={invokedPrograms} @@ -152,6 +177,15 @@ export function BlockHistoryCard({ block }: { block: BlockResponse }) { >
+ {accountFilter !== null && ( +
+ Showing transactions which load account: +
+
+
+
+ )} +
@@ -234,7 +268,7 @@ export function BlockHistoryCard({ block }: { block: BlockResponse }) {
- {block.transactions.length > numDisplayed && ( + {filteredTransactions.length > numDisplayed && (