here i am using uncontrolled popover of reactstarp and i have list of categories and i have one edit button option so when i click on edit button icon uncontrolled popover appears that true but now thing is like when i click on below of the categories it opens where the popover opens at first position and when i clicked again then it is visible perfectly as what i need. i did something like this :
<span
className="material-icons-outlined icon icon-fs-16 text-primary cursor-pointer mr-6px"
id={`add-edit-category-subcategory_${category.id}`}
onClick={() => {
this.changestatesStatus(
category,
`add-edit-category-subcategory_${category.id}`
); }}
>
edit
</span>
<UncontrolledPopover
className="custom-popover subcategory-popover"
placement="right"
trigger="legacy"
isOpen={this.state.showPopover}
target={this.state?.popoverId}
>
changestatesStatus = (category, id) => {
console.log("id: ", id);
this.setState(
{
showPopover: true,
isEdit: true,
category: category,
popoverId: id,
},