Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adicionar paginação no endpoint /users e criar página para listar usuários #1675

Open
Rafatcb opened this issue Apr 14, 2024 · 1 comment
Labels
back Envolve modificações no backend front Envolve modificações no frontend novo recurso Nova funcionalidade/recurso

Comments

@Rafatcb
Copy link
Collaborator

Rafatcb commented Apr 14, 2024

Descrição

Conforme mencionado em #1466 (comment), criar paginação no endpoint de GET /api/v1/users permitirá fornecer a feature read:user:list aos moderadores, e isso pode ajudar na identificação de contas de spam (que podem levantar suspeitas pelo nome ou pela descrição).

Depois da criação do endpoint, será interessante ter uma página para listar os usuários pelo próprio site, sem que o moderador precise usar diretamente a API.

Para esse caso de uso, é interessante ver os usuários por ordem de "criados recentemente" e também "atualizados recentemente".

Sugestão de implementação

O endpoint pode funcionar de forma similar ao GET /api/v1/contents, tanto na paginação quanto ao usar strategy para definir a ordenação.

A página pode ser como a de lista de comentários, onde mostra informações sobre o usuário e também o início da sua descrição. É interessante ter uma forma de selecionar diferentes estratégias (ordenações) na página, com um link para cada uma delas (pode ser com searchParams).

Edit: Não há mais necessidade de ordenação no frontend porque, com a implementação do PR #1676, a API possui apenas uma ordenação (atualizados recentemente primeiro).


Já experimentei algumas coisas na implementação do frontend, e acredito que podem ser discutidas antes de abrir um PR, principalmente por alguns pontos são referentes a padrões que podem ser utilizados e seguidos em novas funcionalidades do TabNews.

1. Local do link para a página de usuários.

Já falei um pouco sobre a inserção de novos links de páginas em #1660 (comment), mas falando especificamente sobre a página de usuários, como apenas moderadores poderão ver isso e é uma página que pode ser visitada com certa frequência para garantir que está tudo em ordem, acredito que o link possa ficar ao lado de Recentes:

Link "Usuários" ao lado direito de "Recentes"

E, em telas menores, ser movido para o menu hambúrguer (as três linhas horizontais no canto superior direito):

Link "Usuários" num grupo abaixo de "Editar perfil" e acima de "Pesquisar"

Repare que ele ficou num grupo separado (divisórias acima e abaixo), e tem o mesmo ícone de "Meus conteúdos". Se houver uma sugestão melhor, pode falar nos comentários. Os ícones que considerei são os Octicons do Primer.

2. Link de cada página.

Hoje não temos um padrão para isso. As páginas Relevantes e Recentes possuem links no estilo /pagina/1, mas as páginas de conteúdo do usuário (no perfil) são apenas /1. Como o /usuarios será um link "no mesmo nível" do /recentes e possivelmente ficará próximo aos links Relevantes e Recentes, pensei em seguir o padrão de /pagina/1.

3. Redirecionamento em /usuarios.

Podemos utilizar um redirecionamento de /usuários para a página 1, ou seja, para /usuarios/pagina/1 ou /usuarios/1 (a depender do ponto anterior). Faz sentido? Esse redirecionamento existe em /recentes, /recentes/comentarios e /recentes/todos, mas não existe em /usuario/conteudos e /usuario/comentarios.

4. Exibir a descrição

Nome do usuário ao lado do número na lista, e embaixo a descrição, embaixo as informações "Membro há 26 minutos, 0 tabcoin, 0 tabcash"

Podemos fazer de forma similar ao que acontece na lista de conteúdos, juntando o caso de publicação e comentário, exibindo o nome do usuário e a descrição. Isso permite ver pela própria lista se o usuário já tem algo suspeito na descrição, com base nos primeiros caracteres.

Fazer exatamente assim, traz alguns problemas, como:

  • Se o usuário deixar os primeiros 255 caracteres (valor usado na lista de comentários) aceitáveis, mas começar a ferir os Termos de Uso nos outros, não será possível identificar pela página /usuarios.
  • Se o usuário adicionar imagens inadequadas, não será possível identificar que ele tem imagens na descrição, já que fazendo da mesma forma que é feita nos comentários, o markdown é removido.
Com a simplificação do PR #1676 , não é mais necessário escolher uma ordenação pelo cliente, já que terá apenas a ordenação de "atualizados recentemente", então esses pontos que estou "escondendo" não são mais necessários, deixo apenas para referência futura caso o assunto surja novamente. **5. Selecionando uma ordenação.**

Hoje ainda não temos ordenação em nenhuma página, mas é algo que será necessário no futuro. Experimentei fazer isso com dois componentes: Select e ActionList. O primeiro caso foi meu primeiro teste, mas é um componente para ser usado em formulários, não ficou legal. O segundo caso ficou parecido com os filtros de Issues e PRs do GitHub:

Screencast.from.2024-04-14.19-36-03.webm

Eu gostei do resultado. Veja como fica numa tela maior:

Lista de usuários com o ActionList antes da lista

6. Detalhe na lista conforme ordenação (membro há / atualizado há)

No vídeo do ponto anterior, a informação mostrada sobre o usuário é sempre Membro há. Caso seja uma ordenação com base na data de atualização, acredito que faça sentido mostrar Atualizado há.

7. URL de ordenação.

Eu gosto da ideia de deixar a URL com base na ordenação "compartilhável", usando o searchParams. Isso também permite a navegação por meio dos botões do navegador para voltar ou avançar de página.

Por exemplo, as URLs podem ser:

  • /usuarios/pagina/1?ordem=criados_novos
  • /usuarios/pagina/1?ordem=criados_antigos
  • /usuarios/pagina/1?ordem=atualizados_novos
  • /usuarios/pagina/1?ordem=atualizados_antigos

Assim segue um padrão no valor ordem e está em português, como todas as URLs do TabNews.

Nenhuma página usa searchParams hoje porque não surgiu a necessidade. O mais próximo disso seria o filtro de conteúdos recentes feito em /recentes/comentários e /recentes/todos, mas acho estranho ter URLs dedicadas para a ordenação (algo como /usuarios/novos, /usuarios/antigos, /usuarios/atualizados_novos e /usuarios/atualizados_antigos).

@Rafatcb Rafatcb added front Envolve modificações no frontend back Envolve modificações no backend novo recurso Nova funcionalidade/recurso labels Apr 14, 2024
@aprendendofelipe
Copy link
Collaborator

A página pode ser como a de lista de comentários, onde mostra informações sobre o usuário e também o início da sua descrição.

Vou listar os pontos que acho interessante sempre mostrar. Poderia vir tudo isso da API, mas na lista só mostrar o que acharem mais importante, e disponibilizar mais detalhes com o hover (ou outra interação melhor):

  • Username
  • Tempo decorrido desde a criação do usuário
  • Tempo decorrido desde a última atualização
  • Saldos de TabCoins e TabCash
  • Contagem de publicações e comentários

Em ver mais:

  • Resumo da descrição
  • As features que o usuário possui
  • ID

Hoje não temos um padrão para isso. As páginas Relevantes e Recentes possuem links no estilo /pagina/1, mas as páginas de conteúdo do usuário (no perfil) são apenas /1. Como o /usuarios será um link "no mesmo nível" do /recentes e possivelmente ficará próximo aos links Relevantes e Recentes, pensei em seguir o padrão de /pagina/1.

Acho que as páginas de moderação podem ficar dentro de /moderacao, que pode ser uma página com todas as abas de moderação. Não acho necessário adicionar o /pagina, então ficaria /moderacao/usuarios/1.

3. Redirecionamento em /usuarios.

Os redirecionamentos são para compatibilizar com links existentes previamente, então não vejo necessidade para esses novos caminhos.

4. Exibir a descrição

Acho suficiente mostrar só um resumo da descrição na página que lista usuários, ou até mesmo somente após alguma interação. Daí poderia ter um mostrar tudo para enfim mostrar o markdown quando for necessário.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
back Envolve modificações no backend front Envolve modificações no frontend novo recurso Nova funcionalidade/recurso
Projects
None yet
Development

No branches or pull requests

2 participants