View listagem de usuário

TiagoGouvea commented 4 years ago

Branch: 22-view-listagem-de-usuario
Antes de iniciar comentar quantas horas imagina que serão necessárias
Usar padrão Presentational and Container
Este arquivo será o modelo para todas as outras listagens, então é importante fazer bem feito, ter um código fácil de entender, bem comentando e explicado, para quando alguém copiar e colar estes arquivos levar tudo bem organizado já.

Objetivos

A ideia é listar os usuários do banco, para que o usuário possa editar, excluir, incluir novos usuários

[x] Criar arquivo users.json dentro das pastas do stoybook com ao menos 3 registros de exemplo, para ser importado por outros componentes que precisem apresentar informações.
[x] Prop data recebe uma lista de usuários, 'onEdit' recebe um callback de edição, 'onDelete' recebe um callback de exclusão
[x] Exibir grade usando table
[x] Exibir nome, email (com link), telefone (com link para api do whatsapp)
[x] Ter dois botões de ação, editar e excluir que chamam os callbacks das props
[x] Botão excluir exibe prompt (do javascript mesmo) confirmando se a pessoa deseja apagar, e só então chama o callback
[x] Enviar nesta issue um print do componente no storybook, para vermos como está ficando

[x] Criar arquivo container que irá obter os usuários da API usando axios
[x] Já iniciar com um loading, obter os registros com axios da api
[x] Caso falhe em obter, exibir mensagem para o usuário
[x] Ao obter, exibir componente <UserList> passando o user via prop data
[x] Adicionar botão "Incluir" abaixo da lista para incluir novo usuário
[x] Implementar callback onEdit que apenas levará o usuário para /users/{id}/ - que será feita na issue #23
[x] Implementar callback onDelete que irá chamar DEL na API em /users/{id}/, se tiver sucesso obter novamente lista de usuário, se falhar, exibir ao usuário a mensagem
[x] Enviar nesta issue um print do admin nesta rota, para vermos o componente em funcionamento

allanmaral commented 4 years ago

Screenshot_2020-01-15 UserList - Default ⋅ Storybook

Screenshot_2020-01-15 React App(1)

TiagoGouvea commented 4 years ago

Muito bom, ficou muito maneiro! Mandou bem brother.