notificando erros com alerts de acordo com o errorCode do firebase

src/pages/cadastro/cadastro.js

@@ -14,8 +14,8 @@ export default () => {
 <img src="imagens/fightback-logo.png" alt="logo do app">
 </picture>
 </header>
-<input type="text" id="input-name" name="name" placeholder="Nome">
-<input type="email" id="input-email-cadastro" name="email" placeholder="Email">
+<input type="text" id="input-name" name="name" placeholder="Nome" autocomplete="off">
+<input type="email" id="input-email-cadastro" name="email" placeholder="Email" autocomplete="off">
 <div class="cadastro-check">
   <input type="checkbox" id="check-cadastro" class="onoff">
   <label for="check-cadastro" class="check-btncadastro"></label>
@@ -30,11 +30,25 @@ export default () => {
   const botaoCadastrar = container.querySelector('#btn-vermelho');
   const inputEmail = container.querySelector("#input-email-cadastro");
   const inputSenha = container.querySelector("#input-senha-cadastro");
+  const inputNome = container.querySelector('#input-name');
+
+  const checkBtn = container.querySelector("#check-cadastro");
+
+   function mostrarSenha() {
+     if (checkBtn.checked) {
+       inputSenha.type = "text";
+     } else {
+       inputSenha.type = "password";
+     }
+   }
+
+   checkBtn.addEventListener("change", mostrarSenha);
 
   botaoCadastrar.addEventListener('click', (event) => {
     event.preventDefault();
     const emailDoUsuario = inputEmail.value;
     const senhaDoUsuario = inputSenha.value;
+    const nomeDoUsuario = inputNome.value;
 
     cadastrarUsuario(emailDoUsuario, senhaDoUsuario)
       .then((userCredential) => {
@@ -49,7 +63,15 @@ export default () => {
         const errorCode = error.code;
         const errorMessage = error.message;
         console.error(`${errorCode} - ${errorMessage}`)
+        if (nomeDoUsuario === '') {
+          alert("Por favor, insira seu nome.")
+        } else if (emailDoUsuario === '') {
+          alert("Por favor, insira um email.")
+        } else if (senhaDoUsuario === '') {
+          alert ("Por favor, insira uma senha.")
+        } else {
         alert("Usuário já cadastrado. Tente outro email.")
+        }
       });
   })
 

src/pages/feed/feed.css

@@ -56,16 +56,12 @@
     z-index: -1;
 }
 
-#check-perfil,
 #check-feed,
 #check-sos,
 #check-sair {
     display: none;
 }
 
-
-
-.icon-perfil,
 .icon-feed,
 .icon-sos,
 .icon-sair {

src/pages/feed/feed.js

@@ -8,10 +8,6 @@ export default () => {
      <h1>FIGHT BACK</h1>
      <ul class="lista-menu">
       <li><picture> 
-      <input type="checkbox" id="check-perfil">
-      <label for="check">
-       <img src="imagens/icon-perfil.png" class="icon-perfil" alt="imagem para acessar o perfil"></label></picture></li>
-      <li><picture> 
       <input type="checkbox" id="check-feed">
       <label for="check">
        <img src="imagens/icon-feed.png" class="icon-feed" alt="imagem para acessar o feed"></picture></li>
@@ -28,7 +24,6 @@ export default () => {
     </nav>
 
     <ul class="lista-menu-mobile">
-      <li><a href="/#perfil"><img src="imagens/icon-perfil.png" class="icon-perfil" alt="imagem para acessar o perfil"><p>Perfil</p></a></li>
       <li><a href="/#feed"><img src="imagens/icon-feed.png" class="icon-feed" alt="imagem para acessar o feed"><p>Feed</p></a></li>
       <li><a href="/#sos"><img src="imagens/icon-sos.png" class="icon-sos" alt="imagem para solicitar suporte"><p>Suporte</p></a></li>
       <li><a href="/#"><img src="imagens/icon-sair.png" class="icon-sair" alt="imagem para sair "><p>Sair</p></a></li>

src/pages/login/login.js

@@ -15,7 +15,7 @@ export default () => {
 <img src="imagens/fightback-logo.png" alt="logo do app">
 </picture>
 </header>
-<input type="email" id="input-email-login" name="email" placeholder="Email">
+<input type="email" id="input-email-login" name="email" placeholder="Email" autocomplete="off">
 <div class="senha-check">
 <input type="checkbox" id="check" class="on-off">
  <label for="check" class="check-btn"></label>
@@ -32,25 +32,50 @@ export default () => {
   const inputEmail = container.querySelector("#input-email-login");
   const inputSenha = container.querySelector("#input-senha-login");
 
+  const checkBtn = container.querySelector("#check");
+
+  function mostrarSenha() {
+    if (checkBtn.checked) {
+      inputSenha.type = "text";
+    } else {
+      inputSenha.type = "password";
+    }
+  }
+
+  checkBtn.addEventListener("change", mostrarSenha);
+
   botaoEntrar.addEventListener('click', (event) => {
+
     event.preventDefault();
     const emailDoUsuario = inputEmail.value;
     const senhaDoUsuario = inputSenha.value;
+
     loginUsuario(emailDoUsuario, senhaDoUsuario)
-    .then((userCredential) => {
-      // Signed in 
-      const user = userCredential.user;
-      console.log('usuário logado com sucesso')
-      console.log(user)
-      window.location.hash = '#feed'
-  })
-
-  .catch((error) => {
-      const errorCode = error.code;
-      const errorMessage = error.message;
-      console.error(`${errorCode} - ${errorMessage}`)
-      alert("Você ainda não tem uma conta. Cadastre-se.")
-  });
+      .then((userCredential) => {
+        // Signed in 
+        const user = userCredential.user;
+        console.log('usuário logado com sucesso')
+        console.log(user)
+        window.location.hash = '#feed'
+      })
+
+      .catch((error) => {
+        const errorCode = error.code;
+        const errorMessage = error.message;
+        console.error(`${errorCode} - ${errorMessage}`)
+        if (errorCode === "auth/invalid-email") {
+          alert("Email inválido.")
+        }
+        else if (errorCode === "auth/missing-password") {
+          alert("Por favor, insira sua senha.")
+        }
+        else if (errorCode === "auth/wrong-password") {
+          alert("Senha incorreta. Tente novamente.")
+        }
+        else {
+          alert("Você ainda não tem uma conta. Cadastre-se.")
+        }
+      });
   })
 
   return container;