shadcn.io is not affiliated with official shadcn/ui
Reminder Follow-Up Comments Block for Radix UI
Five account comments with a Remind me list (In 3 hours, Tomorrow 09:00, Monday 09:00 or a chosen day) and a side column grouping reminders into Overdue, Today and Later, with Snooze 1 day, Done and a collapsed Done list.
Installation
Overview
Never lose a comment you meant to come back to, with these reminder follow-ups for React with Radix UI. A compact header names the list in Nudgewick, a follow-up manager for account teams. A hairline frame splits in two: five comments with a Remind me Button that opens a small Popover list (In 3 hours, Tomorrow 09:00, Monday 09:00, or a Native Select of the next seven days with Set), and a side column that groups the reminders into Overdue, Today and Later by comparing their due times with a fixed Wed 14 Oct, 09:41. Each reminder offers Snooze 1 day and Done; Done moves it into a Collapsible list headed Done (2), where Reopen brings it back. Counts and the status line follow every change, and the two columns keep a fixed height with their own scrolling. It is built from Popover, Native Select, Collapsible, Button, Badge, Avatar and Guides, with CSS only. For account management, support follow-ups and any list of things to chase.
FAQ
How do I change the comments and the reminders?
Edit REMARKS (the comments) and START (the reminders: the comment each is about, a due time in milliseconds and whether it is done). The presets are in PRESETS and the seven days in CHOICES, both worked out from a fixed AS_OF. A comment has at most one open reminder; setting a new one replaces it, and Clear reminder removes it.
How are the groups worked out?
groupOf compares the due time with NOW: before it is Overdue, before the start of tomorrow is Today, and anything later is Later. Nothing reads the clock, so the groups are the same on every visit. Snooze 1 day adds a day to the due time, so an overdue reminder from Tue 13 Oct at 14:00 lands in Today.
What stays local, and how do I make it real?
Everything: nobody is notified, and the reminders are a list in the page. In your app save each reminder with its user, run a job that sends a notification when it falls due, and keep the due time in UTC with the person's time zone beside it so Tomorrow 09:00 means their morning.
Why a popover list and not a menu?
The list holds a day picker with its own button, which a menu does not allow, so each row is a list of buttons in a non-modal popover. Escape closes it and focus returns to the Remind me button. After Done or Reopen the scrolling reminders list takes focus, since the row you pressed is gone.
Is it accessible?
Every button names its comment (Done, reminder on the comment by Rosalind Park) and starts with its visible word. The groups are labelled lists, the Done list is a button with an expanded state, and each change is announced in the polite status line. Due times are written as text, never colour alone.