# Firewall Traffic block

> Hourly firewall traffic pill grid with a threats toggle, scrubbing readout and incident markers

Firewall traffic over 24 hours as stacked pill columns of blocked, challenged and allowed requests. Hover scrubs the stat readout, a click pins an hour, a ToggleGroup Threats view rescales and a Badge flags incidents. Frame card for WAF dashboards.

- Type: Pro block
- Category: [Bar Chart](https://reui.io/blocks/chart/bar-chart.md)
- Page: https://reui.io/blocks/chart/bar-chart/chart-40
- MCP: `get_block("chart-40")`
- Built with: Badge, Frame, Toggle Group
- Installs with a ReUI Pro or Ultimate license; setup: https://reui.io/docs/license-setup

## Best for

An hourly firewall pill grid built from plain elements, where hover scrubs the readout, a click pins an hour and Threats rescales

## Agent notes

- Replace `HOURLY` counts, oldest first, and `HOUR_NOTES`, keyed by bucket index; every hour hangs off the fixed `REFERENCE_MS`, 14:20 UTC
- `AXIS` ticks and the `grid-cols-24` columns assume exactly 24 buckets in `TRAFFIC`; a different window needs both rewritten
- A click only sets `pinned` for the readout and emits nothing; lift it to open that hour's requests in your log view

## When not to use

- Connector sync runs per hour, switched between run outcomes and rows moved: use [Data Sync Activity](https://reui.io/blocks/chart/bar-chart/chart-45.md) (`get_block("chart-45")`)
- Scheduled job runner time per hour, stacked by succeeded, timed out and failed: use [Cron Runner Load](https://reui.io/blocks/chart/bar-chart/chart-32.md) (`get_block("chart-32")`)

## Install

```bash
npx shadcn@latest add @reui/chart-40
```

## About Bar Chart blocks

### When to use

- Values compared across hours, days or categories as grouped, stacked or hatched columns
- Run durations or event volumes against a timeout or limit line, with outcome toggles
- Segmented meters that split a capacity, a fund or a heart rate zone into colored slices

### When not to use

- A share of a whole where the slices read better around a ring: use the [Pie Chart blocks](https://reui.io/blocks/chart/pie-chart.md)
- A progress reading shown as an arc gauge with a status label: use the [Radial Chart blocks](https://reui.io/blocks/chart/radial-chart.md)
- Rows of jobs or deploys, each with its own run history strip: use the [Status Tracker blocks](https://reui.io/blocks/chart/status-tracker.md)

### Agent notes

- `Chart` renders with no props, so every bar, meter value and limit comes from constants kept in the block folder

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.