[TabNews] Mais de 7 novas melhorias implementadas 🎉

O TabNews não parou de melhorar mesmo com as festas de fim de ano.

Estas foram as últimas melhorias que já estão no ar.

1) Definir nas variáveis de ambiente quais endpoints passam pelo rate-limit do Upstash

Com essa alteração podemos configurar os caminhos afetados pelo rate-limit de maneira diferente no ambiente de produção e homologação, assim como podemos ter uma configuração específica para uma branch qualquer.

A alteração permite uma redução de custos com o Upstash, já que para a maioria dos endpoints a Cloudflare já nos protege de maneira apropriada.

A implementação foi realizada por mim e os detalhes podem ser conferidos na issue #1216.

2) Corrigido o espaçamento e alinhamento entre label e checkbox de notificações por email

O problema da Fig. 1 surgiu com a atualização da biblioteca @primer/react:

Fig. 1 - Problemas de espaçamento e alinhamento entre label e checkbox

Isso incomodou tanta gente que foram abertos 3 PRs com diferentes soluções.

Agradeço ao laviodias, AndreyArthur e nzimermann pelos PRs 🎉🎉🎉, mas cada versão ainda deixava desalinhado em algum navegador.

Então realizei uma nova implementação e os detalhes podem ser conferidos na issue #1217.

Fig. 2 - Resultado final em diferentes navegadores

3) Adiciona link para RSS no footer

Alguns usuários ainda estavam solicitando a implementação do feed RSS, que já estava implementado, mas que não era muito conhecido porque ainda faltava adicionar o link no footer.

O gabrielsozinho adicionou o link do RSS no footer e os detalhes podem ser conferidos na issue #1219. 🎉🎉🎉

4) Refresh automático dos dados do usuário logado

Agora os dados do usário são atualizados a cada no máximo 10 minutos sem precisar dar refresh na página. Assim o usuário verá seu saldo de TabCoins ser alterado pouco tempo depois de seus conteúdos receberem votos.

Além disso os dados serão sincronizados entre diferentes abas abertas. Com isso todas as abas serão atualizadas quando o usuário fizer qualquer edição do perfil ou votar em qualquer conteúdo.

A implementação foi realizada por mim e os detalhes podem ser conferidos na issue #1220.

5) Corrige a mensagem de recuperação de senha

A f-francine percebeu um erro na mensagem de recuperação de senha solicitação solicitada e já criou o PR #819 corrigindo. 🎉🎉🎉

De:
text: `${user.username}, uma solicitação de recuperação de senha foi solicitada. Caso você não tenha feito esta solicitação, ignore esse email.

Para:
text: `${user.username}, foi solicitada uma recuperação de senha. Caso você não tenha feito a solicitação, ignore esse email.

6) Obter tamanho correto da janela ao jogar confetes

Vocês já devem ter percebido que o TabNews joga confetes quando executamos algumas ações como ativação do cadastro, publicação de conteúdo etc.

Mas para os confetes preencherem totalmente a janela precisamos passar as dimensões para o componente. Também precisamos lidar com um possível redimensionamento da janela durante a queda dos confetes.

Com isso tínhamos dois problemas:

1. Estávamos observando o redimensionamento das janelas em todas as páginas em que o componente Confetti é utilizado, mesmo que a condição de disparo dos confetes não fosse atingida. E isso disparava renderizações desnecessárias ao redimensionar as janelas.
2. As dimensões passadas para o componente Confetti eram as dimensões da tela e não da janela.

Foram criados 3 PRs visando solucionar esses problemas, então agradeço ao bralandealmeida, Jean-Vitor e leonardoelias. 🎉🎉🎉

Na implementação que chegou em produção (do bralandealmeida) foi criado um componente customizado que verifica as dimensões da janela por dentro dele, evitando assim renderizações desnecessárias, e agora o componente utiliza altura e largura de maneira corretamente responsiva.

Mais detalhes podem ser vistos no PR #889.

7) Adicionado botão de rolar para o topo

Agora temos um botão para rolar a página até o topo. Facilitando principalmente em páginas com muito conteúdo e/ou comentários:

A implementação foi realizada por montoyaaa e os detalhes podem ser conferidos no PR #1039. 🎉🎉🎉

Outras melhorias de UX

Implementei mais algumas melhorias que podem ser conferidas abaixo e os detalhes estão no PR #1176.

Scroll

Restaura o scroll ao voltar a página pelo navegador ou ao clicar no link Anterior.

Assim o usuário não precisa procurar novamente em qual posição estava na lista antes de clicar em um conteúdo.

Zoom mobile

Habilita a possibilidade de mudar a escala da página em dispositivos móveis.

Isso facilita visualizar detalhes de imagens que contenham muita informação.

Responsividade dos gráficos

Corrige a responsividade dos gráficos da página de status que não funcionava bem com display: grid

Conclusão

A Turma soube equilibrar o descanso, as comemorações e as contribuições para o TabNews.

Que 2023 seja um ano de saúde, paz e sucesso para todos!