Add error message for failed login attempts

src/pages/AdminLoginPage/AdminLoginPage.tsx

@@ -13,6 +13,7 @@ export interface AdminLoginPageState {
   username: string;
   password: string;
   existingToken: string;
+  error: string;
 }
 
 class AdminLoginPage extends React.Component<AdminLoginPageProps, AdminLoginPageState> {
@@ -22,6 +23,7 @@ class AdminLoginPage extends React.Component<AdminLoginPageProps, AdminLoginPage
       username: "",
       password: "",
       existingToken: getTokenCookie(),
+      error: "",
     };
   }
 
@@ -37,6 +39,9 @@ class AdminLoginPage extends React.Component<AdminLoginPageProps, AdminLoginPage
 
       history.push("/admin");
     } catch (err) {
+      this.setState({
+        error: "Failed to log in!",
+      });
       console.error("Failed to log in!");
     }
   }
@@ -53,6 +58,17 @@ class AdminLoginPage extends React.Component<AdminLoginPageProps, AdminLoginPage
     });
   }
 
+  renderError = () => {
+    const { error } = this.state;
+    if (!error) return null;
+
+    return (
+      <div className="error">
+        { error }
+      </div>
+    );
+  }
+
   render() {
     const { username, password, existingToken } = this.state;
     if (existingToken) {
@@ -73,6 +89,7 @@ class AdminLoginPage extends React.Component<AdminLoginPageProps, AdminLoginPage
           </label>
           <input type="submit" />
         </form>
+        { this.renderError() }
       </div>
     );
   }