From 265901f1b8f68ee37f55da248b6bd09da4bbb3bb Mon Sep 17 00:00:00 2001
From: Charles Zhao <charleszhao@silverhand.io>
Date: Mon, 5 Feb 2024 10:46:58 +0800
Subject: [PATCH] fix(console): protected app form field background should
 exclude error message (#5379)

---
 packages/console/src/ds-components/TextInput/index.tsx       | 5 ++++-
 .../pages/Applications/components/ProtectedAppForm/index.tsx | 2 +-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/console/src/ds-components/TextInput/index.tsx b/packages/console/src/ds-components/TextInput/index.tsx
index 6603b697b..c90e29978 100644
--- a/packages/console/src/ds-components/TextInput/index.tsx
+++ b/packages/console/src/ds-components/TextInput/index.tsx
@@ -30,6 +30,7 @@ type Props = Omit<HTMLProps<HTMLInputElement>, 'size'> & {
   // eslint-disable-next-line react/boolean-prop-naming
   alwaysShowSuffix?: boolean;
   isConfidential?: boolean;
+  inputContainerClassName?: string;
 };
 
 function TextInput(
@@ -43,6 +44,7 @@ function TextInput(
     readOnly,
     type = 'text',
     isConfidential = false,
+    inputContainerClassName,
     ...rest
   }: Props,
   reference: Ref<Nullable<HTMLInputElement>>
@@ -96,7 +98,8 @@ function TextInput(
           isConfidential && isContentHidden && type === 'text' && styles.hideTextContainerContent,
           icon && styles.withIcon,
           disabled && styles.disabled,
-          readOnly && styles.readOnly
+          readOnly && styles.readOnly,
+          inputContainerClassName
         )}
       >
         {icon && <span className={styles.icon}>{icon}</span>}
diff --git a/packages/console/src/pages/Applications/components/ProtectedAppForm/index.tsx b/packages/console/src/pages/Applications/components/ProtectedAppForm/index.tsx
index f5ad0ebe5..1ab69dea6 100644
--- a/packages/console/src/pages/Applications/components/ProtectedAppForm/index.tsx
+++ b/packages/console/src/pages/Applications/components/ProtectedAppForm/index.tsx
@@ -120,7 +120,7 @@ function ProtectedAppForm({
           tip={conditional(!hasDetailedInstructions && t('protected_app.form.url_field_tooltip'))}
         >
           <TextInput
-            className={styles.input}
+            inputContainerClassName={styles.input}
             {...register('origin', {
               required: true,
               validate: (value) =>