[BUG] Click events not working as expected #1141
Description
Hello,
I am trying to update my react-tooltip version from v4 to v5. I have a list of items and I want to show the tooltip on click of every item.
The issue is when I click on the first item it shows the tooltip, when I click on a second item it closes the first tooltip but does not open the second one, and to open the tooltip for the second item I need to click again on the second tooltip. Below is my code snippet. Please let me know if I am doing something wrong with this implementation
<StyledTopTenItems>
<Tooltip
id="my-tooltip"
openEvents={{ click: true }}
closeEvents={{ click: true }}
variant="light"
opacity={1}
/>
{items.map((item, index) => (
<div key={index} className="top-items">
<span
className="item-name"
data-tooltip-content={item.name}
data-tooltip-id="my-tooltip"
>
{item.name}
</span>
<span className="item-allocation">{item.value}</span>
</div>
))}
</StyledTopTenItems>