[Dúvida] Por que a descontrução dos props precisou estar entre chaves?

Opa Lucas, tudo certo?

Desestruturação em JavaScript é uma forma de extrair valores de objetos ou arrays para variáveis. Isso facilita a manipulação dos dados.

Por exemplo, imagine que temos um objeto chamado "carro", com as propriedades "cor" e "marca". Em vez de acessarmos as propriedades como carro.cor e carro.marca, podemos extraí-las para variáveis, como no exemplo abaixo:

var carro = {
    cor: "amarelo",
    marca: "fiat",
}

var {cor, marca} = obj 
// Aqui estamos declarando as variáveis cor e marca que agora tem os valores: cor = "amarelo" e marca = "fiat"

No React, as propriedades são passadas como objeto para os componentes. Usando a desestruturação, é possível extrair as propriedades diretamente para variáveis, facilitando sua utilização no JSX. Por exemplo: em vez de fazermos props.items e props.styles, podemos extraí-las diretamente como items e styles.

Oi, Lucas! Tudo bem?

É exatamente como o Gustavo explicou. Ao realizar a desestruturação o seu código fica mais bem organizado e legível. Imagine que ao invés de receber diretamente a propriedade itens ou styles você recebesse um objeto com as props, você teriar que utilizá-los em seu código assim:

props.itens
// ou
props.styles

Com a desestruturação você consegue extrair diretamente essas propriedades para variáveis e utilizá-las sem dificuldades.

Essa é uma prática recomendada ao se escrever código em React, e se você quiser saber mais sobre essas práticas eu recomendo que você leia este artigo que escrevi:

• Boas práticas ao escrever código em React js

Bons estudos!