Filtro de categorias

Adicionado recurso de filtro na página de categorias para selecionar livros por categorias como front-end, back-end ou dados.

app/main.js

@@ -5,7 +5,6 @@ getBuscarLivrosDaApi();
 async function getBuscarLivrosDaApi() {
     const res = await fetch(endpointDaApi);
     livros = await res.json();
-    console.table(livros);
-    let livrosComDesconto = aplicarDesconto(livros)
+    let livrosComDesconto = aplicarDesconto(livros);
     exibirOsLivrosNaTela(livrosComDesconto);
-}
+};

app/metodoFilter.js

@@ -0,0 +1,10 @@
+const botoes = document.querySelectorAll('.btn');
+
+botoes.forEach(btn => btn.addEventListener('click', filtrarLivros));
+
+function filtrarLivros() {
+    const elementoBtn = document.getElementById(this.id);
+    const categoria = elementoBtn.value;
+    let livrosFiltrados = livros.filter(livro => livro.categoria == categoria);
+    exibirOsLivrosNaTela(livrosFiltrados);
+};

app/metodoForEach.js

@@ -1,7 +1,7 @@
 const elementoParaInserirLivros = document.getElementById('livros');
 
-
 function exibirOsLivrosNaTela(listaDeLivros){
+    elementoParaInserirLivros.innerHTML = '';
     listaDeLivros.forEach(livro => {
         elementoParaInserirLivros.innerHTML += `
         <div class="livro">
@@ -17,4 +17,4 @@ function exibirOsLivrosNaTela(listaDeLivros){
       </div>
         `;
     })
-};
+};

categorias.html

@@ -192,5 +192,6 @@ <h2 class="rodape__titulo">Grupo Alura</h2>
 <script src="app/main.js"></script>
 <script src="app/metodoForEach.js"></script>
 <script src="app/metodoMap.js"></script>
+<script src="app/metodoFilter.js"></script>
 </body>
 </html>