Mesmo adicionando uma key continua aparecendo warning no console

Olá boa tarde, mesmo que eu já tenha adicionado uma key no componente Time, o warning segue aparecendo no devTools. Por favor, se alguém puder me ajudar, agradeço :)

Warning: Each child in a list should have a unique "key" prop.

Check the render method of Time. See https://reactjs.org/link/warning-keys for more information. at Colaborador (http://localhost:3000/static/js/bundle.js:447:3) at Time (http://localhost:3000/static/js/bundle.js:968:28) at div at div at App (http://localhost:3000/static/js/bundle.js:56:92)

Meu código:

`import Colaborador from '../Colaborador'

import './Time.css'

const Time = (props) => {

const css = {backgroundColor: props.corSecundaria}

return (

    (props.colaboradores.length > 0) ? <section style={css} className='time'>
        <div className='nome__time'>
        <h3 style={{ borderColor: props.corPrimaria }}>{props.nome}</h3>
        </div>
        <div className='colaboradores'>
            {props.colaboradores.map(colaborador => <Colaborador key={colaborador.nome} corDeFundo={props.corPrimaria} nome={colaborador.Nome} cargo={colaborador.Cargo} imagem={colaborador.Imagem} />)}
        </div>
    </section>
        : ''
) }

export default Time`

Deixo o link do repositório no GitHub.

https://github.com/naritagodoy/Organo.git

Se continuar o warning tenta isso:

No seu código, você está usando a propriedade "key" com o valor "colaborador.nome". No entanto, se o valor de "colaborador.nome" não for único para cada item da lista, o warning pode continuar aparecendo.

Uma sugestão é utilizar uma propriedade única de cada colaborador, como o "indice" por exemplo, que é uma propriedade do próprio ".map" ele é o segundo parâmetro do ".map" após a vírgula, então adiciona esse indice a propriedade "key". Por exemplo:

<div className='colaboradores'> {props.colaboradores.map((colaborador, indice) => <Colaborador corDeFundo={props.corPrimaria} key={indice} nome={colaborador.nome} cargo={colaborador.cargo} imagem={colaborador.imagem} />)} </div>

Feito isso o warning deve sumir.

Espero ter ajudado e bons estudos!

Mergulhe em programação

Se continuar o warning tenta isso: