Есть заголовок, при клике на который появляется список товаров
<h3 onClick={() => onShowSelectList(!showSelectList)}
className={props.className + "-select-title"}>
{selectedValue ? selectedValue : props.title}
</h3>
В значении мы указываем, что если товар не выбран, берем из пропса props.title, как при загрузке страницы указать, что если товар не выбран, выбираем первую позицию из списка. Объект списка хранится в props.data.