feat(primer/react): update version

[ErickCReis]

Mudanças realizadas

Atualiza versão da lib @primer/react: 35.25.1-> 36.4.0

Durante a execução do pr (#1577) encontrei esse problema (primer/react#3741), nessa nova versão o warning não é mais exibido.

A versão 36 já foi lançada faz alguns meses, e nela tiveram alguns breaking changes que foram descritos aqui: primer/react#3685

Na prática apenas 1 breaking change afetou o projeto visualmente, a alteração das opções de variant no componente FormControl.Validation, onde a opção "warning" foi removida.

O componente PasswordInput input foi afetado:

Antes	Depois

E a página de edição também:

Antes	Depois

Tipo de mudança

• Atualização de pacote

Checklist:

• As modificações não geram novos logs de erro ou aviso (warning).
• Eu adicionei testes que provam que a correção ou novo recurso funciona conforme esperado.
• Tanto os novos testes quanto os antigos estão passando localmente.

[vercel]

@ErickCReis is attempting to deploy a commit to the TabNews Team on Vercel.

A member of the Team first needs to authorize it.

[Rafatcb]

Obrigado pelo PR e por seguir o template, Erick!

Não analisei o código, mas vendo seu PR, não me parece que o variant="error" seja uma boa ideia para esses dois cenários. Talvez faça sentido usar o FormControl.Caption para a senha:

Caption: Provides additional context about the field to help users fill in the correct data or explain how the data will be used. Caption text should be as short as possible. Caption text may be displayed at the same time as a validation message, or it may be hidden if it only provides redundant information.

Fonte.

E para o Email, um Flash de informação ou aviso: "Um email de confirmação foi enviado para ${email}. O email será atualizado apenas após a confirmação.".

Você acha que faz sentido? Pode testar se fica bom na prática?

Eu fui testar localmente para ver se ocorreria um conflito visual aparecendo o Flash do e-mail e o de confirmação de salvamento caso eu atualizasse a descrição, mas quando eu atualizo o e-mail, a descrição é ignorada 😅. Isso pode ser melhorado em outro PR, não analisei quão complexo será. Acredito que futuramente o Flash de sucesso deverá ser substituído pelo Toast, mas me parece que o Flash do e-mail continuará fazendo sentido.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
tabnews	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Dec 21, 2023 2:05am

[aprendendofelipe]

@ErickCReis, muito obrigado pelo PR! 💪

Será que não é bom já atualizar o @primer/octicons-react? Se não me engano, é uma dependência do @primer/react.

E eu concordo com o @Rafatcb 👍

---

Eu fui testar localmente para ver se ocorreria um conflito visual aparecendo o Flash do e-mail e o de confirmação de salvamento caso eu atualizasse a descrição, mas quando eu atualizo o e-mail, a descrição é ignorada

@Rafatcb, quando você diz "a descrição é ignorada", quer dizer que a mensagem "Salvo com sucesso" não é exibida? Se você usou o setGlobalMessageObject, ele só vai mostrar o último valor setado mesmo.

No caso de alteração de email, a mesma mensagem já pode deixar claro que as alterações foram salvas, mas que o email precisa ser confirmado.

[aprendendofelipe]

Com a atualização do Primer, toda ajuda é necessária para testar (em homologação através do link abaixo) se não quebramos algo na interface visual 💪💪💪

https://tabnews-git-fork-erickcreis-feat-update-primer-react-tabnews.vercel.app/

[Rafatcb]

@Rafatcb, quando você diz "a descrição é ignorada", quer dizer que a mensagem "Salvo com sucesso" não é exibida? Se você usou o setGlobalMessageObject, ele só vai mostrar o último valor setado mesmo.

Não mostrou a mensagem, mas analisando melhor agora, entendi que o problema é outro. Ao dar F5 na tela de edição de perfil, a descrição fica vazia, mas ao navegar para ela por meio da UI, aparece. Além disso, o e-mail fica com o texto undefined na primeira renderização.

No caso de alteração de email, a mesma mensagem já pode deixar claro que as alterações foram salvas, mas que o email precisa ser confirmado.

Refazendo o teste, concordo com você que a mensagem seria melhor assim. Será preciso tomar cuidado com a mensagem para não dar a entender que o novo e-mail também foi salvo, pois ele será considerado apenas após a confirmação, certo?

[aprendendofelipe]

Ao dar F5 na tela de edição de perfil, a descrição fica vazia, mas ao navegar para ela por meio da UI, aparece. Além disso, o e-mail fica com o texto undefined na primeira renderização.

Peguei aqui, de fato temos esses bugs 😒

@ErickCReis, não precisa lidar com esses bugs (pelo menos não nesse PR), pois não está relacionado. 🤝

Será preciso tomar cuidado com a mensagem para não dar a entender que o novo e-mail também foi salvo, pois ele será considerado apenas após a confirmação, certo?

Isso mesmo! 👍

[ErickCReis]

@Rafatcb

Não analisei o código, mas vendo seu PR, não me parece que o variant="error" seja uma boa ideia para esses dois cenários. Talvez faça sentido usar o FormControl.Caption para a senha:

Concordo, vou fazer alguns testes com o FormControl.Caption aqui.

E para o Email, um Flash de informação ou aviso: "Um email de confirmação foi enviado para ${email}. O email será atualizado apenas após a confirmação.".

Você acha que faz sentido? Pode testar se fica bom na prática?

Sim, acho que faz mais sentido mesmo, vou verificar como fica.

---

@aprendendofelipe

Será que não é bom já atualizar o @primer/octicons-react? Se não me engano, é uma dependência do @primer/react.

Sim, não tinha notado isso, vou atualizar tbm. Dei uma olhada no changelog e não encontrei nada que possa afetar o projeto.

Com a atualização do Primer, toda ajuda é necessária para testar (em homologação através do link abaixo) se não quebramos algo na interface visual 💪💪💪

Com certeza, acabei não testando muito no meu ambiente local, nesse ambiente de homologação vai dar para testar mais cenários.

@ErickCReis, não precisa lidar com esses bugs (pelo menos não nesse PR), pois não está relacionado. 🤝

Ok, vou focar nesses pontos que o @Rafatcb comentou.

[ErickCReis]

@Rafatcb

No input de senha utilizei o FormControl.Caption e acho que ficou bem melhor, o caption não aplica nenhum efeito na borda do input, mas mesmo assim gostei do resultado.
Você acha que precisa de mais destaque? Eu não apliquei nenhuma modificação no estilo padrão do Primer.

---

Na tela de perfil utilizei o Flash e também achei que ficou melhor que antes.

---

Vou continuar testando o ambiente de homologação, se tiver mais alguma sugestão é só avisar.

[Rafatcb]

Ficou muito legal, Erick 🥳. Não acho que precisamos mudar o estilo, do jeito que está ficou bom.

Deixei uma sugestão para melhorar a mensagem do Flash.

[aprendendofelipe]

@ErickCReis, muito obrigado por mais essa contribuição! 💪💪💪

Já está rodando em produção 🚀🚀🚀