Neste desafio você deve implementar uma página de catálogo de produtos baseado em uma especificação de design. Além disso, deve implementar a lógica de ao clicar num produto do catálogo adicioná-lo ao carrinho. Após adicionar o produto no carrinho, o número de itens e o total do carrinho devem ser refletidos no footer da aplicação. Para finalizar, escreva um teste automatizado para garantir que o clique no produto realmente altera o estado do carrinho.
Acesse o design da página através do figma:
- protótipo navegável: https://www.figma.com/proto/HIjCzxz2ZKSGmrcIuoItFY/Desafio-front?page-id=0%3A1&node-id=5%3A940&viewport=328%2C48%2C0.25&scaling=min-zoom&starting-point-node-id=5%3A698&show-proto-sidebar=1
- specs do protótipo: https://www.figma.com/file/HIjCzxz2ZKSGmrcIuoItFY/Desafio-front?node-id=0%3A1
- o visual da página de catálogo deve seguir as especificações do design o mais próximo possível
- ao clicar num produto do catálogo, este deve ser adicionado ao carrinho
- o carrinho deve ser atualizado a cada adição de produto para refletir o número atual de itens e o valor total em reais
- deve ser escrito um teste automatizado usando RTL (react testing library) para garantir que o clique em um produto realmente altera o estado do carrinho para o valor e total de itens corretos
- não deve ser implementada remoção de produtos do carrinho
Envie um PR no github deste desafio com a sua solução. Não esqueça de descrever em termos gerais no seu PR qual a sua abordagem pra resolver o desafio, quais dúvidas você teve e como escolheu o melhor caminho. Lembre-se que a interpretação do desafio faz parte do processo de avaliação.