[Parabéns TabNews 🥳] Aniversário de lançamento e mais melhorias 🎉

Fala Turma, tudo bem com vocês?

Faz exatamente um ano que foi publicado o vídeo de lançamento, ou seja, hoje é aniversário do TabNews 🎈🎉🎂👏🥳

Como parte das comemorações, venho trazer para vocês as últimas melhorias que foram implementadas pela Turma.

Alinhamento dos botões de qualificar

O @ErickCReis conseguiu melhorar o alinhamento vertical dos botões de qualificação para os principais navegadores:

Safari Desktop	Firefox Desktop	Chrome Desktop	Chrome Mobile

Mais detalhes sobre a melhoria podem ser vistas no PR #1549.

Feedback ao editar perfil

Foi adicionado um feedback ao editar as configurações do perfil de usuário:

Quando é salva alguma alteração:

E quando o botão de salvar é clicado sem nenhuma configuração ter sido alterada:

A melhoria foi iniciada pelo @viniciusamc e concluída por mim. Mais detalhes podem ser vistos nos PRs #1543, #1545 e #1548.

Banimento de usuários

Usuários banidos não são mais mostrados

Não existe mais a página de perfil de usuário banido. Usernames de usuários banidos não são mais mostrados publicamente. Agora apenas moderadores conseguem ver quais usuários foram banidos.

Antes	Depois

Performance do processo de banimento

No momento do banimento de usuários, todos os conteúdos são despublicados com um único comando no banco de dados. Antes eram listadas todas as publicações do usuário e a despublicação ocorria de forma muito mais lenta, com um comando para cada conteúdo.

Menos impacto ao banir usuários

Para diminuir o impacto nos TabCoins de usuários legítimos, apenas as qualificações realizadas nas últimas duas semanas pelo usuário banido serão desfeitas. Em casos específicos podemos atuar pontualmente para desfazer prejuízos mais antigos.

Implementação

As melhorias foram realizadas no PR #1541.

Grafo de qualificações

Criado o grafo que, de forma anonimizada, mostra as últimas 300 qualificações, sejam positivas ou negativas, entre os diferentes usuários (👤).

Mostra também as interações de usuários banidos (❌) e casos de redes de dados compartilhadas (🌐) por diferentes usuários. Obs.: Não há impedimento de uso de uma mesma rede por diferentes usuários, mas a presença dessa informação no grafo ajuda a identificar algumas manipulações nas qualificações.

O grafo se organiza automaticamente através de uma simulação física que pode ser parada e reiniciada conforme a escolha do usuário. A biblioteca utilizada é a vis-network.

Foi criada a feature de moderação read:votes:others e o endpoint protegido /status/votes que permite aos moderadores verem uma quantidade maior de qualificações no grafo, assim como ver os usernames e filtrar os tipos e quantidades de dados mostrados.

As melhorias foram realizadas nos PRs #1531, #1533 e #1541.

Gráficos da página de Status

Foram realizadas algumas melhorias nos gráficos da página de status:

• Corrigida a cor do background do Tooltip (problema reportado por @Poveii na issue #1520).
• Modificada a altura dos gráficos para facilitar a visualização na versão mobile.
• Criado o componente BarChart para centralizar a estilização dos gráficos.
• Adicionado o gráfico com a quantidade de qualificações diárias.
• Corrigidas as ordenações dos dados de todos os gráficos, pois nem sempre as barras estavam em ordem cronológica.

Imagem da versão incorreta com datas fora de ordem:

As melhorias foram realizadas nos PRs #1521, #1531 e #1541.

Lint

Organiza importações

Foi configurado o ESLint para forçar uma padronização das importações do projeto. Em resumo, as importações agora devem seguir uma ordem alfabética, mas também deve existir uma linha em branco separando os grupos de módulos externos e internos.

A melhoria foi iniciada por @imattferreira nos PRs #552 e #1496 e concluído por mim no PR #1499.

Commits mais rápidos ao rodar o lint apenas nos arquivos preparados

A cada commit o script npm run lint:fix era chamado uma vez para cada arquivo preparado, mas esse script rodava o lint em todos os arquivos. Como resultado, um commit com 5 arquivos preparados estava rodando o lint em todos os arquivos do projeto, mas não só isso, fazia esse processo 5 vezes em sequência.

Após a mudança, o eslint e o prettier rodam apenas nos arquivos preparados, e, como esperado, apenas uma vez em cada. E para as extensões json, css, scss e md agora só é executado o prettier.

Antes

"lint-staged": {
  "*.{js,jsx,ts,tsx,json,css,scss,md}": [
    "npm run lint:fix"
  ]
},

Depois

"lint-staged": {
  "*.{js,jsx,ts,tsx}": [
    "eslint --fix",
    "prettier --write"
  ],
  "*.{json,css,scss,md}": [
    "prettier --write"
  ]
},

Melhoria realizada no PR #1525.

Spinner nos Botões

Foi criado o ButtonWithLoader, um botão com um Spinner para indicar que a ação disparada pelo clique está em andamento.

Antes	Depois

A melhoria foi realizada pela @mihtoa no PR #1501.

Ajustes nos ganhos de TabCoins ao publicar

Por enquanto, as recompensas diárias em TabCoins (divulgadas anteriormente em uma publicação específica) utilizam os mesmos critérios das recompensas ao criar publicação/comentário. Por isso foram realizados ajustes nos cálculos desses ganhos no mesmo PR.

Agora é utilizada uma quantidade maior de publicações no cálculo da média (eram 10, agora são 20).

Para usuários com poucas publicações, a quantidade de publicações recentes (com menos do que 48 horas) que não entram no cálculo da média foi reduzida de 10 para 3. Assim um usuário novo que está publicando conteúdo bem avaliado será retribuído mais cedo, assim como os usuários muito negativados serão educados também mais cedo com o bloqueio de novas publicações. Para usuários que já possuem mais de 20 publicações fora da faixa de recentes, nenhuma publicação recente entra na média.

A média para remunerar especificamente os comentários passou a considerar também o desempenho de conteúdos raiz. Isso melhorou os ganhos de comentários na maioria dos casos, já que conteúdos raiz costumam receber mais qualificações positivas do que os comentários. Para não prejudicar os ganhos ao publicar conteúdo raiz, a média para esses casos continua considerando apenas as qualificações de conteúdos raiz.

As melhorias foram realizadas nos PRs #1508 e #1509.

Termos de Uso na tela de Cadastro

Agora, para concluir o cadastro, um novo usuário precisa indicar que leu e concorda com os Termos de Uso do TabNews.

A implementação foi realizada pelo @luizfelipemacedo no PR #1494.

Importações/Exportações de ícones

Como forma de organização, todos os ícones utilizados no projeto agora tem a importação e exportação centralizadas no arquivo /TabNewsUI/icons/index.js, de onde devem ser importados para utilização nos demais arquivos do projeto.

A refatoração foi realizada por @ValbertMartins no PR #1489.

Conclusão

Com o carinho e dedicação de tanta gente legal, não há dúvidas de que estamos construindo juntos o melhor pedaço da internet 😍

Passado esse primeiro ano, agora o foco é devolver valor para os autores das melhores publicações, então toda ajuda é bem vinda para desenvolver a Revenue Share, seja com código ou com ideias.

Bora?! 🚀