Polish block transaction drilldown cleanup

This commit is contained in:
defiQUG
2026-04-16 14:57:12 -07:00
parent 945864af7a
commit c01e7c2c4a
2 changed files with 20 additions and 28 deletions

View File

@@ -29,24 +29,16 @@ export function useBlockTransactions({ blockNumber, chainId, enabled }: UseBlock
setLoading(true)
setError(false)
try {
const result = await transactionsApi.listByBlockSafe(
chainId,
blockNumber,
page,
DEFAULT_BLOCK_TRANSACTION_PAGE_SIZE,
)
setTransactions(result.items)
setHasNextPage(result.hasNextPage)
setError(!result.ok)
} catch (loadError) {
console.error('Failed to load block transactions:', loadError)
setTransactions([])
setHasNextPage(false)
setError(true)
} finally {
setLoading(false)
}
const result = await transactionsApi.listByBlockSafe(
chainId,
blockNumber,
page,
DEFAULT_BLOCK_TRANSACTION_PAGE_SIZE,
)
setTransactions(result.items)
setHasNextPage(result.hasNextPage)
setError(!result.ok)
setLoading(false)
}, [blockNumber, chainId, enabled, page])
useEffect(() => {

View File

@@ -1,6 +1,6 @@
'use client'
import { useCallback, useEffect, useState } from 'react'
import { useCallback, useEffect, useMemo, useState } from 'react'
import { useRouter } from 'next/router'
import { blocksApi, Block } from '@/services/api/blocks'
import { Card, Address, Table } from '@/libs/frontend-ui-primitives'
@@ -62,7 +62,7 @@ export default function BlockDetailPage() {
const gasUtilization = block && block.gas_limit > 0
? Math.round((block.gas_used / block.gas_limit) * 100)
: null
const transactionColumns = [
const transactionColumns = useMemo(() => [
{
header: 'Hash',
accessor: (transaction: Transaction) => (
@@ -102,7 +102,13 @@ export default function BlockDetailPage() {
</span>
),
},
]
], [])
const transactionsEmptyMessage = transactionsError
? 'Unable to load indexed block transactions right now. Please retry from this page in a moment.'
: (block?.transaction_count ?? 0) > 0
? 'No indexed block transactions were returned for this page yet.'
: 'This block does not contain any indexed transactions.'
return (
<div className="container mx-auto px-4 py-6 sm:py-8">
@@ -210,13 +216,7 @@ export default function BlockDetailPage() {
<Table
columns={transactionColumns}
data={blockTransactions}
emptyMessage={
transactionsError
? 'Unable to load indexed block transactions right now. Please retry from this page in a moment.'
: block.transaction_count > 0
? 'No indexed block transactions were returned for this page yet.'
: 'This block does not contain any indexed transactions.'
}
emptyMessage={transactionsEmptyMessage}
keyExtractor={(transaction) => transaction.hash}
/>
{block.transaction_count > 0 ? (