From 2581da0765e3523a33ee740cd7dc8058d9e709b7 Mon Sep 17 00:00:00 2001
From: Erik Jan de Wit <erikjan.dewit@gmail.com>
Date: Tue, 17 Aug 2021 14:58:07 +0200
Subject: [PATCH] change to TextInput when editing  (#991)

* change to TextInput when editing
as keycloak doesn't store the password as clear text

fixes: #971

* now part of the password field
---
 .../password-input/PasswordInput.tsx          | 28 +++++++++++++------
 .../UserFederationLdapSettings.tsx            |  2 +-
 .../ldap/LdapSettingsConnection.tsx           |  3 ++
 3 files changed, 23 insertions(+), 10 deletions(-)

diff --git a/src/components/password-input/PasswordInput.tsx b/src/components/password-input/PasswordInput.tsx
index a1f77bb401..beab92dd19 100644
--- a/src/components/password-input/PasswordInput.tsx
+++ b/src/components/password-input/PasswordInput.tsx
@@ -8,7 +8,15 @@ import {
 } from "@patternfly/react-core";
 import { EyeIcon, EyeSlashIcon } from "@patternfly/react-icons";
 
-const PasswordInputBase = ({ innerRef, ...rest }: TextInputProps) => {
+type PasswordInputProps = TextInputProps & {
+  hasReveal?: boolean;
+};
+
+const PasswordInputBase = ({
+  hasReveal = true,
+  innerRef,
+  ...rest
+}: PasswordInputProps) => {
   const { t } = useTranslation("common-help");
   const [hidePassword, setHidePassword] = useState(true);
   return (
@@ -18,19 +26,21 @@ const PasswordInputBase = ({ innerRef, ...rest }: TextInputProps) => {
         type={hidePassword ? "password" : "text"}
         ref={innerRef}
       />
-      <Button
-        variant="control"
-        aria-label={t("showPassword")}
-        onClick={() => setHidePassword(!hidePassword)}
-      >
-        {hidePassword ? <EyeIcon /> : <EyeSlashIcon />}
-      </Button>
+      {hasReveal && (
+        <Button
+          variant="control"
+          aria-label={t("showPassword")}
+          onClick={() => setHidePassword(!hidePassword)}
+        >
+          {hidePassword ? <EyeIcon /> : <EyeSlashIcon />}
+        </Button>
+      )}
     </InputGroup>
   );
 };
 
 export const PasswordInput = React.forwardRef(
-  (props: TextInputProps, ref: React.Ref<HTMLInputElement>) => (
+  (props: PasswordInputProps, ref: React.Ref<HTMLInputElement>) => (
     <PasswordInputBase
       {...props}
       innerRef={ref as React.MutableRefObject<any>}
diff --git a/src/user-federation/UserFederationLdapSettings.tsx b/src/user-federation/UserFederationLdapSettings.tsx
index b4a975e0e9..0bb31e6e45 100644
--- a/src/user-federation/UserFederationLdapSettings.tsx
+++ b/src/user-federation/UserFederationLdapSettings.tsx
@@ -298,7 +298,7 @@ export const UserFederationLdapSettings = () => {
           ]}
         >
           <LdapSettingsGeneral form={form} />
-          <LdapSettingsConnection form={form} />
+          <LdapSettingsConnection form={form} edit={!!id} />
           <LdapSettingsSearching form={form} />
           <LdapSettingsSynchronization form={form} />
           <LdapSettingsKerberosIntegration form={form} />
diff --git a/src/user-federation/ldap/LdapSettingsConnection.tsx b/src/user-federation/ldap/LdapSettingsConnection.tsx
index 29a2fc20b2..0c99ca15c3 100644
--- a/src/user-federation/ldap/LdapSettingsConnection.tsx
+++ b/src/user-federation/ldap/LdapSettingsConnection.tsx
@@ -27,6 +27,7 @@ export type LdapSettingsConnectionProps = {
   form: UseFormMethods;
   showSectionHeading?: boolean;
   showSectionDescription?: boolean;
+  edit?: boolean;
 };
 
 const testLdapProperties: Array<keyof TestLdapConnectionRepresentation> = [
@@ -43,6 +44,7 @@ export const LdapSettingsConnection = ({
   form,
   showSectionHeading = false,
   showSectionDescription = false,
+  edit = false,
 }: LdapSettingsConnectionProps) => {
   const { t } = useTranslation("user-federation");
   const { t: helpText } = useTranslation("user-federation-help");
@@ -319,6 +321,7 @@ export const LdapSettingsConnection = ({
               isRequired
             >
               <PasswordInput
+                hasReveal={!edit}
                 isRequired
                 id="kc-console-bind-credentials"
                 data-testid="ldap-bind-credentials"