shadcn.io is not affiliated with official shadcn/ui
Chat Bot Notification Log Block for Radix UI
A single-open accordion of five chat channels with sent and failed counts, each opening to the bot's last five messages as bubbles with delivery receipts such as Delivered, Failed: channel_not_found and Retried twice.
Installation
Overview
See what a chat bot posted, channel by channel, and which messages never landed, with this notification log for React with Radix UI. It is Chatterwell, a chat-ops bot (made up) that posts alerts to five channels of a chat tool; Slack is named once, in the header, as the tool it watches. An Accordion keeps one channel open: each row shows the channel in mono, the time of its last message and how many messages it sent and how many failed. Open, it lists the bot's last five messages as Bubble messages with a time and a delivery receipt under each: Delivered at a time, Failed with an error name, or Retried and delivered. The header sentence is worked out from the channels. Guides draw the frame; the entrance is CSS only. For chat-ops bots, alert routing and any integration whose messages can fail quietly.
FAQ
How do I use my own channels?
Edit CHANNELS: each has its sent and failed counts and a list of posts written as time|kind|detail|text, where kind is ok, failed or retried and detail is the error name or the number of retries. The header totals and the receipts are derived from them.
Is this connected to a chat tool?
No. The channels, messages and error names are typed examples, and nothing is posted. The error names (channel_not_found, rate_limited, is_archived) are generic. In your app feed the posts from your bot's own log.
How does the accordion behave?
One channel is open at a time and one always stays open. Enter or Space on a heading opens it, and a polite status line says which channel is open. Arrow keys move between headings.