# Social Engagement block

> Multi-line social media activity chart with platform comparison and time-range selector

Multi-line chart comparing Facebook, Instagram and LinkedIn activity over a selectable time range, with custom tooltip and dot legend. ReUI Frame and Select, shadcn ChartContainer, Recharts LineChart. For analytics dashboards and engagement trends.

- Type: Pro block
- Category: [Line Chart](https://reui.io/blocks/chart/line-chart.md)
- Page: https://reui.io/blocks/chart/line-chart/chart-23
- MCP: `get_block("chart-23")`
- Built with: Frame, Select
- Installs with a ReUI Pro or Ultimate license; setup: https://reui.io/docs/license-setup

## Best for

A comparison of 3 platform lines on one shared axis with no headline total, a centered dot legend and a 24 hour to 30 day Select

## Agent notes

- Replace `socialMediaData`; each `Line` hardcodes its stroke while the legend reads `chartConfig`, so change both
- `CustomTooltip` suffixes every value with %, while the `YAxis` adds % only when `selectedPeriod` is 24h
- `CustomTooltip` prints the raw `dataKey`, such as facebook, rather than the `chartConfig` label

## When not to use

- A single metric detail page with a target trend, cohort breakdown and change timeline: use [Metric Deep Dive](https://reui.io/blocks/solutions/analytics/solution-analytics-8.md) (`get_block("solution-analytics-8")`)
- One balance series with its computed high and low called out above the line: use [Balance Tracker](https://reui.io/blocks/chart/line-chart/chart-4.md) (`get_block("chart-4")`)

## Install

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

## About Line Chart blocks

### When to use

- A balance, price or revenue trend as a single stroke with period tabs and a peak marker
- Several platforms or channels compared as separate strokes on one time axis
- Two measures on different scales plotted against left and right axes

### When not to use

- A trend that needs its volume emphasized with a filled region below it: use the [Area Chart blocks](https://reui.io/blocks/chart/area-chart.md)
- Compact tiles where each figure carries a small trend of its own: use the [Sparkline blocks](https://reui.io/blocks/chart/sparkline.md)

### Agent notes

- Each stroke takes its label and color from a `chartConfig` key passed to `ChartContainer`, so add a key for every new series

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.