Search Bar component
📝 Descrição das mudanças
Desenvolvi o componente de Search Bar
seguindo a UI conforme prevista no Figma. Além disso, implementei também o hook useDebounce
para manter melhor performance do app e evitar requisições desnecessárias (quando a integração com a api for feita). Implementei também o gerenciamento dos path params, para gerenciar o conteúdo buscado através do ?search=
na url.
Fiz também um refactor no componente Input
. O componente não permitia o uso de ícones, que conforme o Figma, devem aparecer em alguns casos como: input de senha, busca, etc. O componente só permitia o ícone de olho aberto/fechado, no caso do input de senha. E essa implementação era feita diretamente dentro da implementação do input. E isso é considerado uma má prática visto que o input é um componente genérico e não deve conter detalhes de implementação. Para resolver isso, implementei duas novas props: RightIcon
e onClickRightIcon
, e fiz as alterações necessárias para mostrar esse RightIcon
quando passado para o componente de input.
Fiz a refatoração na tela de login visto que a forma de implementação do input foi alterada.
🎯 Tipo de Mudança
- Bug fix (correção de bug)
- New feature (nova funcionalidade)
- Documentation (documentação)
- Refactoring (refatoração)
- Test (testes)
📸 Evidências
✅ Checklist
- Código segue os padrões do projeto
- Self-review foi feito
- Código foi testado localmente