Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Combobox - Recent vs All Items
A React combobox with Recent and All Items CommandGroup sections using Clock icon and filter deduplication separating frequently accessed from complete project list with shadcn/ui
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Recent surfaces patterns—history predicts future. This React grouped combobox features Recent section with Clock icon from Lucide React separating recent projects from all projects using CommandSeparator and filter deduplication preventing duplicate display. Built with shadcn/ui Command and Popover featuring usage-based organization prioritizing frequent selections. The recent pattern optimizes for repetition—perfect for project pickers, file selectors, contact lists, workspace switchers, or anywhere user history reveals preferences surfacing likely choices first reducing search time through intelligent prioritization.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Recent Selections Section
Detailed recent implementation with dynamic tracking
Favorites + All Items
Star icon favorite prioritization
Multiple Groups with Labels
Category-based grouping
Categories with Separators
CommandSeparator between groups
Standard Combobox
Ungrouped flat list
Groups with Item Counts
Count display per group
Questions you might have
React Combobox - Collapsible Groups
A React combobox with collapsible CommandGroup sections using ChevronRight and ChevronDown icons toggling group visibility with state management for collapsed categories with shadcn/ui
React Combobox - Favorites + All Items
A React combobox with Favorites CommandGroup featuring filled Star icon and deduplication filter separating user-curated favorites from complete tool list with shadcn/ui