Organizar itens na tela de edição para facilitar escaneamento rápido

[giggio]

TL;DR

Melhorar o escaneamento de itens e sua prioridade na tela de edição.

Problema

Quando o usuário acessa o contexto do abrigo a seguinte tela aparece:

Aqui é possível entender bem as prioridades e quais itens o abrigo precisa

Já na edição do abrigo a listagem é assim:

Como podemos ver, nessa listagem da edição é bem difícil entender quais são os itens prioritários, já que a ordenação se dá pelas categorias e não pela urgência. É preciso rolar a listagem ou usar a barra de pesquisa para tentar entender os itens necessários.

Requisitos

• Adicionar filtros rápidos abaixo do buscador:
  • Precisa urgente
  • Precisa
  • Disponível para doação
  • Não precisa
• Como default não aplicar nenhum filtro.
• Quando o usuário tocar no filtro rápido então mudar a aparência do botão e filtrar a lista.
• Quando existir mais de um filtro selecionado, utilizar a regra OU para trazer o resultado. Não utilizar E (obviamente, neste caso não vai trazer nenhum resultado).
• Adicionar accordion na categorias para facilitar a navegação entre categorias.
• Mostrar contador de itens em cada categoria.
• Realizar outros ajustes de interface especificado no Figma.

Design

Figma

Engenharia

[willyanr]

estou trabalhando nisso

[willyanr]

finalizei o acordion os filtros etc, vou prosseguir com as opções de pets do abrigo, mas parece q já tinha visto algo relacionado aos pets, alguém tinha tabalhado nisso salvo engano. vlwww