> For the complete documentation index, see [llms.txt](https://lunes-labs.gitbook.io/dao-lunes-labs-pt/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lunes-labs.gitbook.io/dao-lunes-labs-pt/developers/para-desenvolvedores/smart-contract-ink-4.x/frontend-development/hooks/api/useblockheader.md).

# useBlockHeader

A React hook for fetching block header information on each new block. This hook is used internally to trigger subscriptions when a block updates.

### Usage[​](https://use.ink/frontend/react/hooks/substrate/use-block-header#usage) <a href="#usage" id="usage"></a>

```javascript
import { useBlockHeader } from 'useink'

function Balances() {
  // This will use the first chain in the configuration array (aka 'default chain')
  const blockHeader = useBlockHeader() 
  // 'zeitgeist' must be configured in UseInkProvider
  const zeitBlockHeader = useBlockHeader('zeitgeist')

  return (
    <ul>
      <li>Current Block: {blockHeader?.blockNumber ? blockHeader.blockNumber : '--'}</li>
      <li>Zeitgeist Current Block: {zeitBlockHeader?.blockNumber ? zeitBlockHeader.blockNumber : '--'}</li>
    </ul>
  )
}
```

### Return Value[​](https://use.ink/frontend/react/hooks/substrate/use-block-header#return-value) <a href="#return-value" id="return-value"></a>

```javascript
{
  blockNumber: number | undefined;
  header: undefined | {
    readonly parentHash: Hash;
    readonly number: Compact<BlockNumber>;
    readonly stateRoot: Hash;
    readonly extrinsicsRoot: Hash;
    readonly digest: Digest;
  }
} | undefined
```

<br>