refactor: add new style to FeedBackError & update the icon

[JpBurgarelli]

Closes #374

Feature

Foram realizados ajustes Estilísticos no Componente para ficar em conformidade com o novo Layoput. A primeira imagem representa o layout do figma e o que está em baixo ( outra imagem e vídeo ) o resultado. Para isso foram adicionados novos códigos e, também, estilizações. Foi preciso adicionar o novo icone da nossa lib de icones ("Alert" ) e tive que adiconar o icone que nomei como "DropDownArrow" que representa a setinha com para baixo.

Visual evidences :framed_picture:

  https://github.com/devhatt/octopost/assets/30197026/b9619f6f-192d-4e57-858a-bfceeca7a866

Checklist

- [X] Issue linked - [X] Build working correctly - [X] Tests created

Additional info

Foi removida uma regra de Lint que ja tinha sido removida antes que impede a utilização do operador lógico &&

[github-actions[bot]]

Coverage Report

Status	Category	Percentage	Covered / Total
🔵	Lines	38.48%	142 / 369
🔵	Statements	39.65%	159 / 401
🔵	Functions	45.22%	71 / 157
🔵	Branches	53.28%	73 / 137

File Coverage

File	Stmts	% Branch	% Funcs	% Lines	Uncovered Lines
Changed Files
src/components/FeedbackError/FeedbackError.data.ts	100%	100%	100%	100%
src/components/FeedbackError/FeedbackError.tsx	100%	100%	100%	100%
src/components/Icon/data.ts	100%	100%	100%	100%
src/stores/useError/useError.ts	100%	100%	100%	100%

Generated in workflow #1111

[JpBurgarelli]

No último commit, fiz ajustes pontuais na estilização e na condição (if) dentro do meu arquivo, conforme orientado pelo Alecel.

[hxsggsz]

ta faltando adicionar os testes dessa lista nova de erros

[JpBurgarelli]

No último commit foi feita uma alteração semântica, já que usei uma div com o evento onClick, quando, na verdade, deveria ter usado um button e na lógica do useState também foi feita uma alteração, usando uma função para atualizar o estado e garantindo que "prevState" é o valor mais recente do estado no momento em que a função é executada.

[JpBurgarelli]

Segundo o @Alecell, o trecho "return {errorMessage && renderError()}; " estava ruim, pois estava sendo animado algo que podia nem mesmo aparecer, sendo a animação renderizada apenas quando necessário, portanto eu fiz um ternário ( " return errorMessage ? renderError() : null; " ) que verifica se há um mensagem de erro e, caso haja, a estrutura do componente de erro é chamada com o AnimatePresence, ou seja, apenas será animado, se for chamado, então, por consequencia, existe.

https://github.com/devhatt/octopost/assets/30197026/d46d0e00-0a23-4cd1-9124-e77079b690ba

[JpBurgarelli]

No último commit, foram feitas alterações lógicas no componente FeedbackError, já que agora, seguindo o layout, temos uma mensagem de erro padrão e dentro do DropDown teremos a indicação dos respectivos erros. Para isso, alterações tiveram que ser feitas em todo o componente useError (que é um componente que utiliza o Zustand para criar um Hook personalizado responsável por receber os erros e atualizar a lista de erros).

[JpBurgarelli]

O ultimo commit foi responsável por adicionar o teste do componente feedbackError.