Movimentações Comuns

Introdução

Essa feature compreende os fluxos de criação, edição, deleção e visualização das movimentações comuns - item base da nossa aplicação. Para cada um desses fluxos temos diferentes interfaces, de telas formulários até modais e todas as requerem contato com o servidor da aplicação.

Terminologia

• Criação: permitir a criação de uma movimentação comum, seja ela receita ou despesa, captando o seu valor, descrição e sua categoria.
• Edição: permitir que após feita a movimentação, o usuário possa ajustar o valor, a descrição ou a categoria, sem necessitar apagar e criar outra movimentação em seguida.
• Deleção: permitir que o usuário possa apagar a movimentação realizada e os efeitos dela nos seus relatórios e em seu saldo.
• Visualização: permitir que o usuário possa ver todas as movimentações que fez, em períodos pré-selecionados e em nível simple sou detalhado de informações.

Fluxo

Para que o usuário passe pelo fluxo de adicionar uma movimentação comum teremos os seguintes passos:

"O usuário clicará no botão de adicionar localizado no menu inferior de navegação - ou nos botões exibidos em estados vazios das telas de listagem e relatório. O botão irá acionar a tela de adição de movimentação e possibilitando a rolagem para a seção de adicionar despesa ou de adicionar receita. Inseridos os dados, o usuário poderá adicionar a movimentação e, então, será redirecionado para a tela inicial."

Para que o usuário passe pelo de visualizar suas movimentações comuns teremos os seguintes passos:

Para uma listagem simples das movimentações o usuário tem duas opções: as 10 movimentações mais recentes, presentes na tela inicial da aplicação e; e uma lista completa paginada e separada por períodos (os três são: essa semana, esse mês e esse ano).

*Para uma vizualização detalhada de uma movimentação: uma vez na tela de listagem de movimentações comuns o usuário pode clicar em uma movimentação especifíca, essa ação abre uma modal com detalhes sobre a movimentação em questão e as opções de deleção e edição da movimentação.

• Para que o usuário passe pelo fluxo de editar uma movimentação comum teremos os seguintes passos:
• Clicando no botão de edição o usuário é direcionado para uma interface de adição de movimentação, mas com dados pré-prenchidos sobre a movimentação em questão. As informações já existentes são placeholders e o usuário pode modificar as informações que desejar, sem precisar re-inserir as informações que não deseja editar. Ao fim da edição, ele confirma a edição e as modificações são realizadas no servidor.*

Para que o usuário passe pelo fluxo de deletar uma movimentação comum teremos os seguintes passos:

Clicando no botão de excluir o usuário é questionado se tem certeza que deseja excluir a movimentação em específico e pode cancelar a ação ou prosseguir com o ato, caso afimartivo a movimentação é retirada da listagem e os seus efeitos no saldo são anulados.

Entregas

Logo, as interfaces envolvidas nesse processo são:

• Botão de adicionar movimentação no menu inferior Figma 🔥

• Interface de adição de movimentação comum 🔥

  • Implementação da UI com React Native Navigation Figma e Figma 🔥
  • Integração com o servidor para adição de movimentação comum 🔥
  • Toast de confirmação de registro de movimentação 🔥
  • Atualização do saldo após registro de movimentação 🔥

• Interface de listagem de movimentaçõs comuns 🔥

  • Implementação do estado vazio Figma 🔥

  • Implementção da UI Figma 🔥

  • Implementação da pesquisa de movimentações

  • Paginação da seção de listagem do tipo receita 🔥

    A interação do usuário com o scroll da flatlist gera mais requisições ao servidor.

  • Integração com o servidor com periodicidadade 🔥

    As abas de "essa semana", "esse mês" e "sempre", apresentam as movimentações dos períodos correspondentes.

• Interface de visualização detalhada de movimentação 🔥

  • Implementação da UI Figma 🔥
  • Integração com o servidor 🔥

• Interface de edição da movimentação 🔥

  • Implementação da UI Figma 🔥
  • Integração com o servidor para preenchimento de placeholders
  • Integração com o servidor para update de dados da movimentação 🔥

• Interface de deleção da movimentação 🔥

  • Implementação da UI Figma 🔥
  • Implementação de interface de confirmação com React Native Alert 🔥
  • Integração com o servidor 🔥

  Necessidades

  • View de Adição de Movimentação Comum
  • View de Movimentações Comuns
  • View de Movimentação Comum detalhada
  • View de Alteração de Movimentação Comum
  • View de Deleção de Movimentação Comum

  Gerenciamento de Erro

  Todas mensagens de erro emitidas devem ser feitas através do método toast (implementado pelo React Native), sem implementação de um componente para notificação de erro.

  Gerenciamento de Sucesso

  • Na criação de uma movimentação comum: um toast confirmando que houve sucesso no envio da movimentação para o servidor deve ser mostrado.
  • Na edição de uma movimentação comum: um toast confirmando que houve sucesso no update da movimentação para o servidor deve ser mostrado.
  • Na deleção de uma movimentação comum: um toast confirmando que houve sucesso no update de movimentação para o servidor deve ser mostrado.

Fora de Escopo

Futuramente

Recursos

• Formik para criação de formulários.
• Yup para validação de formulários.
• React Native Navigation Tabs para interfaces de adição de despesa e receita.
• Toast Android para mensagens de erro.
• React Native Alert para modais de diálogo de confirmação.