Skip to content

Commit

Permalink
Set key to undefined so index get correct value when creating list items
Browse files Browse the repository at this point in the history
  • Loading branch information
jockis committed Apr 5, 2024
1 parent 308e350 commit 7fa273c
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion components/lib/autocomplete/AutoCompletePanel.js
Original file line number Diff line number Diff line change
Expand Up @@ -153,7 +153,7 @@ export const AutoCompletePanel = React.memo(
getPTOptions(suggestion, 'item')
);

return createListItem(suggestion, index, itemProps);
return createListItem(suggestion, undefined, index, itemProps);
};

const createItems = () => {
Expand Down

4 comments on commit 7fa273c

@CodeElixir
Copy link
Contributor

@CodeElixir CodeElixir commented on 7fa273c Apr 10, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Seems undefined is not the correct value to set as this causes error in react because the key in rendering lists should be unique. Check the below screenshot.
Screenshot from 2024-04-10 10-59-34

@jockis
Copy link
Contributor Author

@jockis jockis commented on 7fa273c Apr 10, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, you are correct, so it looks like key got the value of index before, so we should be able to use the same value for key as index?

@CodeElixir
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes. index will do as list cannot be modified. So, instead of undefined, passing index will work. Otherwise, we can add if check in createListItem function to use index as key if key is undefined.

@CodeElixir
Copy link
Contributor

@CodeElixir CodeElixir commented on 7fa273c Apr 10, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I created PR. Check out #6365

Please sign in to comment.