# Renewal Reassignment block

> Renewals data grid with multi-field filter builder, bulk owner and stage actions

Revenue-ops renewals table with a Filters builder (account, stage, risk, window, owner), a settings popover for density and column visibility, and bulk owner/stage reassign on row select. ReUI DataGrid, Filters, Badge; shadcn Card, Select, Popover.

- Type: Pro block
- Category: [Filtering](https://web.dev.reui.io/blocks/data-grid/filtering.md)
- Page: https://web.dev.reui.io/blocks/data-grid/filtering/data-grid-filtering-3
- Docs (Base UI): https://web.dev.reui.io/docs/components/base/data-grid.md
- Docs (Radix UI): https://web.dev.reui.io/docs/components/radix/data-grid.md
- MCP: `get_block("data-grid-filtering-3")`
- Built with: Alert Dialog, Avatar, Badge, Button, Card, Data Grid, Dropdown Menu, Field, Filters, Item, Popover, Progress, Select, Separator, Skeleton, Switch, Tooltip
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## Best for

Renewals whose selected rows take a new owner and stage in bulk, in an unpaged list under a sticky header with a live risk summary

## Agent notes

- `RENEWAL_RECORDS` is `RENEWAL_RECORD_SEEDS` plus a copy that `buildRenewalRecord` varies by owner, date and risk; replace both with your renewals query
- `handleApplySelected` and `handleEscalateReview` change local `renewals` state only; persist the owner, stage and risk updates through your API
- `handleOpenAccount` and `handleCreateBrief` only raise toasts, and the New transaction button toasts too; wire them to your workspace

## When not to use

- A paged queue with priority rows pinned to the top: use [At-Risk Renewals](https://web.dev.reui.io/blocks/data-grid/filtering/data-grid-filtering-4.md) (`get_block("data-grid-filtering-4")`)
- Thousands of rows that stream in as the list scrolls: use [Card Payments Ledger](https://web.dev.reui.io/blocks/data-grid/virtualization/data-grid-virtualization-1.md) (`get_block("data-grid-virtualization-1")`)

## Third-party libraries

- TanStack Table v9: [API reference](https://tanstack.com/table/v9/docs/framework/react/reference/index), [docs](https://tanstack.com/table/v9/docs/framework/react/quick-start)
- Sonner v2: [API reference](https://sonner.emilkowal.ski/toast), [docs](https://sonner.emilkowal.ski/getting-started)

## Install

```bash
npx shadcn@latest add @reui/data-grid-filtering-3
```

## About Filtering blocks

### When to use

- Record tables narrowed by a row of filter chips, each holding a field, an operator and a value
- A transactions ledger or a workflow catalog searched by reference, merchant, owner team or delivery mode
- Renewal queues sliced by stage, risk, owner, renewal window or signal to find the accounts at risk

### When not to use

- The table parts alone, wired to your own columns, rows and toolbar: use [Data Grid](https://web.dev.reui.io/components/data-grid.md) (`get_component("data-grid")`)
- Customer, deal, ticket or timesheet tables with a title, toolbar and pagination: use the [Base blocks](https://web.dev.reui.io/blocks/data-grid/base.md)
- Only the chip row and rule builder, to narrow cards or a list you already render: use [Filters](https://web.dev.reui.io/components/filters.md) (`get_component("filters")`)

### Agent notes

- `applyFiltersToData` runs each `FilterQuery` rule over every demo row in the browser; send the query to your API once rows outgrow the client
- The operator switch behind `applyFiltersToData` is written per block; add a case for each operator a new `filterFields` type brings
- Each page.tsx wraps the grid in a `min-h-svh` main with `max-w-7xl` and an sr-only `h1`; drop the wrapper and keep one `h1` in your layout

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