shadcn.io is not affiliated with official shadcn/ui
Split Inbox Chat Block for Radix UI
A shared shop inbox split into Primary and Other, where a row's menu moves a conversation between the two with counts that follow, opening a row clears its unread count, and sending bumps it to the top.
Installation
Overview
Sort a team inbox into what needs you and what can wait, with this split inbox chat for React with Radix UI. A hairline frame with a plus mark on each corner holds a wide window of fixed height for Inboxfold, a shop's shared inbox. The start list has a search field and two sections, Primary and Other, with six customer conversations: each row shows an initials avatar, the customer, a one-line preview, the last time and an unread count. A "More actions" Menu on every row (on hover, on focus and always on a touch screen) moves it to the other section; the headings' counts follow and the status line says where it went. Opening a row clears its count and shows its thread beside the list; sending in it brings the row to the top of its section and a sample reply arrives after a short typing line. On a phone the window shows the list or the thread, with a Back button. It's built from Dropdown Menu, Badge, Input, Avatar, Message, Bubble and Guides. For shared inboxes, support desks and any list that triages itself.
FAQ
What stays local, and how do I make it real?
The six conversations and the sample replies are typed in START and REPLIES, and moves and sends only change state: nothing is saved or sent. Save the section in move, send the message in post, and replace the reply with your inbox's own; the counts, the unread total and every preview are derived from the conversations.
What does the row menu do?
It moves that conversation to the other section ("Move to Other" or "Move to Primary"), keeps it where it was in list order, re-derives the counts in both headings and says so in the status line. There is no undo here: that lives in a conversation list with Undo. Focus lands on the moved row.
How does the search field work?
It filters both sections by name and by preview as you type, ignoring case; the section headings count the matches, and a section with none says "No match in Primary." The window keeps its height.
What clears the unread count?
Opening a row. A reply that lands in a conversation you aren't looking at adds one, and the unread total in the list header is the sum of the rows.