Return queue

A React block (a whole screen) in Beamline's Shop app.

A queue of return cases. Search by return, order or customer, exactly (the default) or loosely; status tabs with counts, Requires attention first; a date column that shows the event chosen (requested, delivered, in transit since) under that name, while the filters always say they filter by the date requested, so changing what the column shows never changes what's found; one labelled sheet of filters (date requested, resolution, reason, item checks where partly checked includes negative checks, exchange stock hold, payment) that narrow together, each in force a chip that removes it, Clear all for several. Each row: return, order (linked out), the date, resolution, items, customer, status on its tone with what holds it up and an exchange-stock hold expiring or expired. A refresh that fails keeps the rows shown and says the time they're from. Opening a return keeps the query and marks the row it came from. On a phone each return is a summary card.

Use it for

A queue of cases with stages, where some need a hand and several dates mean different events.
Filters that intersect and must say which date they filter by.

Not for

One return's case (return-case).
A generic data table (data-grid).

Anatomy

header: the tool's mark, Returns, search and Exact match
toolbar: status tabs with counts; Date shown; Filters (count)
chips: the filters in force, Clear all, the date note
table (phone: cards): return, order, date, resolution, items, customer, status
filter sheet: date requested, resolution, reason, item checks, exchange stock, payment; Reset, Apply filters

States

open queue, exact and loose search, several filters, partly checked, hold expiring and expired, requires attention
nothing matches, loading, refresh failed with rows kept
phone: summary cards
right to left: mirrored
reduced motion: through the tokens

Keyboard

Tab through search, Exact match, the tabs (arrows), Date shown, Filters, the chips and the table; Enter opens a return

Motion

Nothing runs at rest.

Props

Prop	Type	Default	Description
`rows` (required)	`ReturnRow[]`	—	The rows the service found for the query (the queue doesn't filter them itself).
`total` (required)	`number`	—	How many match in all (rows may be a page).
`counts`	`Partial<Record<QueueTab, number>>`	—	How many each tab holds, when known.
`query`	`ReturnQuery`	—
`defaultQuery`	`ReturnQuery`	—
`onQueryChange`	`((query: ReturnQuery) => void)`	—
`dateBasis`	`DateBasis`	—
`defaultDateBasis`	`DateBasis`	—
`onDateBasisChange`	`((basis: DateBasis) => void)`	—
`reasons` (required)	`{ id: string; label: string; }[]`	—	The return reasons customers pick, for the filter.
`loading`	`boolean`	—
`error`	`string \| null`	—	The last refresh failed: the reason. The rows shown stay as they were.
`loadedAt`	`string \| null`	—	When the rows shown were loaded.
`onRetry`	`(() => void)`	—
`onOpen`	`((id: string) => void)`	—	Opens a return; the queue keeps its query and marks the row it came from.
`located`	`string \| null`	—	The row last opened.
`product`	`string`	—
`now`	`string`	—	Today, for reservation expiry.
`className`	`string`	—	Classes on the documented visual root; no override by default.
`style`	`CSSProperties`	—	Inline styles on the documented visual root; no overrides by default.
`ref`	`Ref<HTMLDivElement>`	—	Receives the documented native target or imperative handle; omitted by default.

Built from

Dependencies

lucide-react

Import

import { ReturnQueue, EMPTY_QUERY } from "@beamline/return-queue";

Get it

Return queue is part of Beamline UI. Install the parts you need in your React app as compiled packages or editable source. Get Beamline · Connect your agent

Return queueComplete system · $49

A queue of return cases.

Unpaid returns, by delivery date

The queue is narrowed to unpaid returns, and its date column shows when each parcel was delivered. Date filters still use the date requested, and the line beside the chips says so. Requires attention comes first. Filters narrow together, each one a chip you can remove. Search matches exactly until you turn Exact match off.

0 × 0full

States

A refresh that fails keeps the rows that were there and says what time they're from; a search with no match; loading.