adding state() to quill, after-request error handling to login

src/Home/AuthPage/Login.js

@@ -63,7 +63,22 @@ class Login extends Shadow {
                     .border("1px solid transparent")
 
                 p("")
-                    .dynamicText("errortype", "Please enter a valid {{}}.")
+                    .state("errortype", function (type) {
+                        const messages = {
+                            email:         "Please enter a valid email.",
+                            password:      "Please enter a valid password.",
+                            emailwrong:    "Could not find an account with this email.",
+                            passwordwrong: "Incorrect password.",
+                        };
+
+                        if(messages[type]) {
+                            this.display("")
+                            this.innerText = messages[type]
+                        } else {
+                            this.display("none")
+                            this.innerText = ""
+                        }
+                    })
                     .margin("auto")
                     .marginTop(1, em)
                     .color("var(--text)")
@@ -97,13 +112,10 @@ class Login extends Shadow {
             console.log("invalid", emailValid)
             const errorType = !emailValid ? 'email' : 'password';
             
-            this.$("p")
-            .display("")
-            .attr({ errorType });
-            
+            this.$("p").attr({ errorType });
             return;
         } else {
-            this.$("p").style.display = "none"
+            this.$("p").attr({ errorType: "" });
         }
 
         const res = await fetch(`${util.HOST}/login`, {
@@ -123,6 +135,11 @@ class Login extends Shadow {
             const { error } = await res.json();
             this.errorMessage = error;
             console.error(error)
+            if(error.includes("email")) {
+                this.$("p").attr({ errorType: "emailwrong" });
+            } else {
+                this.$("p").attr({ errorType: "passwordwrong" });
+            }
         }
     }
 }