From 0e5231db5dae942fa6911e40b1235a50fadb255d Mon Sep 17 00:00:00 2001
From: Sergio Padrino <sergio.padrino@gmail.com>
Date: Thu, 20 Apr 2023 12:52:34 +0200
Subject: [PATCH] Don't display invalid state in GHE login form

---
 app/src/ui/lib/authentication-form.tsx |  2 ++
 app/src/ui/lib/text-box.tsx            | 12 +++++++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/app/src/ui/lib/authentication-form.tsx b/app/src/ui/lib/authentication-form.tsx
index fa122ed47f..81f307fb96 100644
--- a/app/src/ui/lib/authentication-form.tsx
+++ b/app/src/ui/lib/authentication-form.tsx
@@ -105,6 +105,7 @@ export class AuthenticationForm extends React.Component<
           label="Username or email address"
           disabled={disabled}
           required={true}
+          displayInvalidState={false}
           // eslint-disable-next-line jsx-a11y/no-autofocus
           autoFocus={true}
           onValueChanged={this.onUsernameChange}
@@ -115,6 +116,7 @@ export class AuthenticationForm extends React.Component<
           type="password"
           disabled={disabled}
           required={true}
+          displayInvalidState={false}
           onValueChanged={this.onPasswordChange}
         />
 
diff --git a/app/src/ui/lib/text-box.tsx b/app/src/ui/lib/text-box.tsx
index 1864d12d45..7a24a30bd6 100644
--- a/app/src/ui/lib/text-box.tsx
+++ b/app/src/ui/lib/text-box.tsx
@@ -28,6 +28,12 @@ export interface ITextBoxProps {
   /** Indicates if input field should be required */
   readonly required?: boolean
 
+  /**
+   * Indicates whether or not the control displays an invalid state.
+   * Default: true
+   */
+  readonly displayInvalidState?: boolean
+
   /**
    * Called when the user changes the value in the input field.
    *
@@ -244,7 +250,11 @@ export class TextBox extends React.Component<ITextBoxProps, ITextBoxState> {
     const inputId = label ? this.state.inputId : undefined
 
     return (
-      <div className={classNames('text-box-component', className)}>
+      <div
+        className={classNames('text-box-component', className, {
+          'no-invalid-state': this.props.displayInvalidState === false,
+        })}
+      >
         {label && <label htmlFor={inputId}>{label}</label>}
 
         <input