show hide dn and pw
This commit is contained in:
parent
8e1a1c57bd
commit
ac664a2f54
1 changed files with 87 additions and 74 deletions
|
@ -9,8 +9,9 @@ import {
|
|||
} from "@patternfly/react-core";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import React, { useState } from "react";
|
||||
import _ from "lodash";
|
||||
import { HelpItem } from "../../components/help-enabler/HelpItem";
|
||||
import { Controller, UseFormMethods } from "react-hook-form";
|
||||
import { Controller, UseFormMethods, useWatch } from "react-hook-form";
|
||||
import { FormAccess } from "../../components/form-access/FormAccess";
|
||||
import { WizardSectionHeader } from "../../components/wizard-section-header/WizardSectionHeader";
|
||||
import { PasswordInput } from "../../components/password-input/PasswordInput";
|
||||
|
@ -36,6 +37,11 @@ export const LdapSettingsConnection = ({
|
|||
|
||||
const [isBindTypeDropdownOpen, setIsBindTypeDropdownOpen] = useState(false);
|
||||
|
||||
const ldapBindType = useWatch({
|
||||
control: form.control,
|
||||
name: "config.authType",
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
{showSectionHeading && (
|
||||
|
@ -231,83 +237,90 @@ export const LdapSettingsConnection = ({
|
|||
variant={SelectVariant.single}
|
||||
data-testid="ldap-bind-type"
|
||||
>
|
||||
<SelectOption key={3} value="simple" />
|
||||
<SelectOption key={4} value="none" />
|
||||
<SelectOption key={0} value="simple" />
|
||||
<SelectOption key={1} value="none" isPlaceholder />
|
||||
</Select>
|
||||
)}
|
||||
></Controller>
|
||||
</FormGroup>
|
||||
<FormGroup
|
||||
label={t("bindDn")}
|
||||
labelIcon={
|
||||
<HelpItem
|
||||
helpText={helpText("bindDnHelp")}
|
||||
forLabel={t("bindDn")}
|
||||
forID="kc-console-bind-dn"
|
||||
/>
|
||||
}
|
||||
fieldId="kc-console-bind-dn"
|
||||
isRequired
|
||||
>
|
||||
<TextInput
|
||||
type="text"
|
||||
id="kc-console-bind-dn"
|
||||
data-testid="ldap-bind-dn"
|
||||
name="config.bindDn[0]"
|
||||
ref={form.register({
|
||||
required: {
|
||||
value: true,
|
||||
message: `${t("validateBindDn")}`,
|
||||
},
|
||||
})}
|
||||
/>
|
||||
{form.errors.config &&
|
||||
form.errors.config.bindDn &&
|
||||
form.errors.config.bindDn[0] && (
|
||||
<div className="error">
|
||||
{form.errors.config.bindDn[0].message}
|
||||
</div>
|
||||
)}
|
||||
</FormGroup>
|
||||
<FormGroup
|
||||
label={t("bindCredentials")}
|
||||
labelIcon={
|
||||
<HelpItem
|
||||
helpText={helpText("bindCredentialsHelp")}
|
||||
forLabel={t("bindCredentials")}
|
||||
forID="kc-console-bind-credentials"
|
||||
/>
|
||||
}
|
||||
fieldId="kc-console-bind-credentials"
|
||||
isRequired
|
||||
>
|
||||
<PasswordInput
|
||||
isRequired
|
||||
id="kc-console-bind-credentials"
|
||||
data-testid="ldap-bind-credentials"
|
||||
name="config.bindCredential[0]"
|
||||
ref={form.register({
|
||||
required: {
|
||||
value: true,
|
||||
message: `${t("validateBindCredentials")}`,
|
||||
},
|
||||
})}
|
||||
/>
|
||||
{form.errors.config &&
|
||||
form.errors.config.bindCredential &&
|
||||
form.errors.config.bindCredential[0] && (
|
||||
<div className="error">
|
||||
{form.errors.config.bindCredential[0].message}
|
||||
</div>
|
||||
)}
|
||||
</FormGroup>
|
||||
<FormGroup fieldId="kc-test-button">
|
||||
{" "}
|
||||
{/* TODO: whatever this button is supposed to do */}
|
||||
<Button variant="secondary" id="kc-test-button">
|
||||
{t("common:test")}
|
||||
</Button>
|
||||
</FormGroup>
|
||||
|
||||
{_.isEqual(ldapBindType, ["simple"]) ? (
|
||||
<>
|
||||
<FormGroup
|
||||
label={t("bindDn")}
|
||||
labelIcon={
|
||||
<HelpItem
|
||||
helpText={helpText("bindDnHelp")}
|
||||
forLabel={t("bindDn")}
|
||||
forID="kc-console-bind-dn"
|
||||
/>
|
||||
}
|
||||
fieldId="kc-console-bind-dn"
|
||||
isRequired
|
||||
>
|
||||
<TextInput
|
||||
type="text"
|
||||
id="kc-console-bind-dn"
|
||||
data-testid="ldap-bind-dn"
|
||||
name="config.bindDn[0]"
|
||||
ref={form.register({
|
||||
required: {
|
||||
value: true,
|
||||
message: `${t("validateBindDn")}`,
|
||||
},
|
||||
})}
|
||||
/>
|
||||
{form.errors.config &&
|
||||
form.errors.config.bindDn &&
|
||||
form.errors.config.bindDn[0] && (
|
||||
<div className="error">
|
||||
{form.errors.config.bindDn[0].message}
|
||||
</div>
|
||||
)}
|
||||
</FormGroup>
|
||||
<FormGroup
|
||||
label={t("bindCredentials")}
|
||||
labelIcon={
|
||||
<HelpItem
|
||||
helpText={helpText("bindCredentialsHelp")}
|
||||
forLabel={t("bindCredentials")}
|
||||
forID="kc-console-bind-credentials"
|
||||
/>
|
||||
}
|
||||
fieldId="kc-console-bind-credentials"
|
||||
isRequired
|
||||
>
|
||||
<PasswordInput
|
||||
isRequired
|
||||
id="kc-console-bind-credentials"
|
||||
data-testid="ldap-bind-credentials"
|
||||
name="config.bindCredential[0]"
|
||||
ref={form.register({
|
||||
required: {
|
||||
value: true,
|
||||
message: `${t("validateBindCredentials")}`,
|
||||
},
|
||||
})}
|
||||
/>
|
||||
{form.errors.config &&
|
||||
form.errors.config.bindCredential &&
|
||||
form.errors.config.bindCredential[0] && (
|
||||
<div className="error">
|
||||
{form.errors.config.bindCredential[0].message}
|
||||
</div>
|
||||
)}
|
||||
</FormGroup>
|
||||
<FormGroup fieldId="kc-test-button">
|
||||
{" "}
|
||||
{/* TODO: whatever this button is supposed to do */}
|
||||
<Button variant="secondary" id="kc-test-button">
|
||||
{t("common:test")}
|
||||
</Button>
|
||||
</FormGroup>
|
||||
</>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</FormAccess>
|
||||
</>
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue