diff --git a/src/app/btcblock/[hash]/BitcoinAnchorDetails.tsx b/src/app/btcblock/[hash]/BitcoinAnchorDetails.tsx index 67c0cc550..8ebd99a03 100644 --- a/src/app/btcblock/[hash]/BitcoinAnchorDetails.tsx +++ b/src/app/btcblock/[hash]/BitcoinAnchorDetails.tsx @@ -7,10 +7,12 @@ import { useParamsBlockHash } from '../../../app/block/[hash]/useParamsBlockHash import { KeyValueVertical } from '../../../common/components/KeyValueVertical'; import { Section } from '../../../common/components/Section'; import { useGlobalContext } from '../../../common/context/useGlobalContext'; +import { useBlockByHash } from '../../../common/queries/useBlockByHash'; import { useSuspenseBurnBlock } from '../../../common/queries/useBurnBlock'; import { toRelativeTime, truncateMiddle } from '../../../common/utils/utils'; import { Link } from '../../../ui/Link'; import { Text } from '../../../ui/Text'; +import { TextLink } from '../../../ui/TextLink'; import BitcoinIcon from '../../../ui/icons/BitcoinIcon'; import { ExplorerErrorBoundary } from '../../_components/ErrorBoundary'; @@ -24,6 +26,10 @@ export function BitcoinAnchorDetailsBase() { const { data: btcBlock } = useSuspenseBurnBlock(useParamsBlockHash(), { refetchOnWindowFocus: true, }); + const stxBlockHash = btcBlock?.stacks_blocks?.[0]; + const { data: stxBlock } = useBlockByHash(stxBlockHash, { + enabled: !!stxBlockHash, + }); const { btcBlockBaseUrl, btcTxBaseUrl } = useGlobalContext().activeNetwork; const btcBlockBlockTimeUTC = new Date(btcBlock.burn_block_time_iso).toUTCString(); @@ -64,21 +70,23 @@ export function BitcoinAnchorDetailsBase() { } copyValue={btcBlock.burn_block_hash} /> - - - {truncateMiddle(btcBlock.burn_block_hash, 8)} - - - } - copyValue={btcBlock.burn_block_hash} - /> + {!!stxBlock?.miner_txid && ( + + + {truncateMiddle(stxBlock.miner_txid, 8)} + + + } + copyValue={stxBlock.miner_txid} + /> + )} , 'queryKey'>> = {} -) { +export function useBlockByHash(hash?: string, options: any = {}) { const apiClient = useApiClient(); - return useQuery({ + return useQuery({ queryKey: ['blockByHash', hash], queryFn: async () => { if (!hash) return undefined; - return await callApiWithErrorHandling(apiClient, '/extended/v2/blocks/{height_or_hash}', { + return (await callApiWithErrorHandling(apiClient, '/extended/v2/blocks/{height_or_hash}', { params: { path: { height_or_hash: hash } }, - }); + })) as unknown as Block; }, staleTime: Infinity, enabled: !!hash,