Command Item not working in combobox component

[pawanrijal]

``const CustomCombobox: React.FC = ({ label }) => {
const [open, setOpen] = React.useState(false)
const [value, setValue] = React.useState("")

const frameworks = [
    {
        value: "next.js",
        label: "Next.js",
    },
    {
        value: "sveltekit",
        label: "SvelteKit",
    },
    {
        value: "nuxt.js",
        label: "Nuxt.js",
    },
    {
        value: "remix",
        label: "Remix",
    },
    {
        value: "astro",
        label: "Astro",
    },
];
return (
    <>
        <Popover open={open} onOpenChange={setOpen}>
            <PopoverTrigger asChild>
                <Button
                    variant="outline"
                    role="combobox"
                    aria-expanded={open}
                    className="w-[200px] justify-between"
                >
                    {value
                        ? frameworks.find((framework) => framework.value === value)?.label
                        : label}
                    <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
                </Button>
            </PopoverTrigger>
            <PopoverContent className="w-[200px] p-0">
                <Command>
                    <CommandInput placeholder="Search framework..." />
                    <CommandEmpty>No framework found.</CommandEmpty>
                    <CommandGroup>
                        <>
                            {frameworks.map((framework) => (
                                <CommandItem
                                    key={framework.value}
                                    value={framework.value}
                                    onSelect={(currentValue) => {
                                        console.log(currentValue, value);
                                        setValue(currentValue === value ? "" : currentValue)
                                        setOpen(false)
                                    }}
                                >
                                    <Check
                                        className={cn(
                                            "mr-2 h-4 w-4",
                                            value === framework.value ? "opacity-100" : "opacity-0"
                                        )}
                                    />
                                    {framework.label}
                                </CommandItem>
                            ))}
                        </>
                    </CommandGroup>
                </Command>
            </PopoverContent>
        </Popover>
    </>
)

}
As I was creating my custom combobox exactly copied from docs of combobox and mase some minor change with label then the error occurs as
Unhandled Runtime Error
TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
as the code works fine until the commandItem is added

[olivblad]

Cmdk introduced changes, making the use of CommandList, as a wrapper of the collection of 'CommandItem', compulsory