From e6fe246682f8ccebb1ad285481cf48d3e5a15979 Mon Sep 17 00:00:00 2001
From: "Laurie T. Malau" <laurie@gitpod.io>
Date: Wed, 18 May 2022 07:20:27 +0000
Subject: [PATCH] replace login error with component

---
 components/dashboard/src/Login.tsx | 13 ++-----------
 1 file changed, 2 insertions(+), 11 deletions(-)

diff --git a/components/dashboard/src/Login.tsx b/components/dashboard/src/Login.tsx
index 7c6fa230fcbfe4..d14c5781752c80 100644
--- a/components/dashboard/src/Login.tsx
+++ b/components/dashboard/src/Login.tsx
@@ -23,6 +23,7 @@ import prebuild from "./images/welcome/prebuild.svg";
 import exclamation from "./images/exclamation.svg";
 import { getURLHash } from "./App";
 import FeedbackComponent from "./feedback-form/FeedbackComponent";
+import ErrorMessage from "./components/ErrorMessage";
 
 function Item(props: { icon: string; iconSize?: string; text: string }) {
     const iconSize = props.iconSize || 28;
@@ -226,17 +227,7 @@ export function Login() {
                                     ))
                                 )}
                             </div>
-
-                            {errorMessage && (
-                                <div className="mt-16 mb-10 flex space-x-2 py-6 px-6 w-96 justify-between bg-gitpod-kumquat-light rounded-xl">
-                                    <div className="pr-3 self-center w-6">
-                                        <img src={exclamation} />
-                                    </div>
-                                    <div className="flex-1 flex flex-col">
-                                        <p className="text-gitpod-red text-sm">{errorMessage}</p>
-                                    </div>
-                                </div>
-                            )}
+                            {errorMessage && <ErrorMessage imgSrc={exclamation} message={errorMessage} />}
                         </div>
                     </div>
                     {errorMessage && <FeedbackComponent message={"Was this error message helpful?"} initialSize={24} />}