mantinedev / mantine

A fully featured React components library
https://mantine.dev
MIT License
26.26k stars 1.86k forks source link

MultiSelect warning when using groups along with numeric values #1153

Closed baba43 closed 2 years ago

baba43 commented 2 years ago

What package has an issue

@mantine/core

Describe the bug

This is the code from the docs:

<MultiSelect
    label="Your favorite Rick and Morty character"
    placeholder="Pick all that you like"
    data={[
      { value: 'rick', label: 'Rick', group: 'Used to be a pickle' },
      { value: 'morty', label: 'Morty', group: 'Never was a pickle' },
      { value: 'beth', label: 'Beth', group: 'Never was a pickle' },
      { value: 'summer', label: 'Summer', group: 'Never was a pickle' },
    ]}
/>

When using numeric values (stringified) React will show up an error:

<MultiSelect
  label="Your favorite Rick and Morty character"
  placeholder="Pick all that you like"
  data={[
    { value: "1", label: "Rick", group: "Used to be a pickle" },
    { value: "2", label: "Morty", group: "Never was a pickle" },
    { value: "3", label: "Beth", group: "Never was a pickle" },
    { value: "4", label: "Summer", group: "Never was a pickle" },
  ]}
/>
Warning: Encountered two children with the same key, `1`. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.

This warning only occurs when using groups.

In which browser did the problem occur

All

If possible, please include a link to a codesandbox with the reproduced problem

No need

Do you know how to fix the issue

No

Are you willing to participate in fixing this issue and create a pull request with the fix

Yes

Possible fix

I guess there is an issue in Key generation but I did not look into the code yet.

baba43 commented 2 years ago

This also leads to wrong UI rendering after selecting items, so it might get a real issue.

rtivital commented 2 years ago

Thanks for reporting, it will be fixed in next patch

rtivital commented 2 years ago

Fixed in 4.1.2