shadcn Combobox (CommandGroup) Not Re-rendering with Component

I have this combobox component (https://github.com/tylerpashigian/t3-recipe-book/blob/feature/creatable-combobox/src/components/UI/combobox.tsx) built on shadcn’s combobox that allows for multi-select and creating a custom option if there are no search results found. I am running into an issue where a user may want to create a custom value even if there are similar results. On the branch I linked, I’ve added the avilableOptions variable, which should add a custom option if the search value isn’t empty and the props allow for custom values. I am seeing something strange where the value is correctly added to my availableOptions (tested by logging the values) but it is not reflected in the options in the dropdown. However if I close the popover and I reopen it with the value in the search field, the option is available. I assume this is due to one of the nested components not re-rendering properly. Does anyone have an idea on this? To provide some context, I have a recipe book and I’m selecting from predefined ingredients, but adding a new one if it doesn't exist. This works if there are no results found, but when trying to add "bacon”, “dry elbow macaroni” is being returned as a similar search result.
GitHub
t3-recipe-book/src/components/UI/combobox.tsx at feature/creatable-...
Contribute to tylerpashigian/t3-recipe-book development by creating an account on GitHub.
0 Replies
No replies yetBe the first to reply to this messageJoin

Did you find this page helpful?