Relations referred to based on their position in the array rather than their identity, causing state to be incorrectly associated with different relations #7716
Description
Describe the bug
When relations are re-sorted, relations are referred to based on their position in the array rather than their identity, causing state to be incorrectly associated with different relations.
By changing the identifier from the array index to the relation id id, we should properly track the relation items.
const RelationsList: FC<RelationsListProps> = observer(({ relations }) => {
return (
<>
{relations.map((rel, i) => {
return <RelationItem key={rel.id} relation={rel} />;
})}
</>
);
});To Reproduce
In a list of relations hover over the items before and after sorting based on order. Hovering over the first relation will highlight the last one in the list after re-sorting.
Expected behaviour
Relations are properly tracked and the component's selected values remain associated with the correct relation.
Environment (please complete the following information):
- OS: Windows
- Label Studio Version 1.19.0