diff --git a/src/clients/ClientDescription.tsx b/src/clients/ClientDescription.tsx index acda755a53..3f5afb30f5 100644 --- a/src/clients/ClientDescription.tsx +++ b/src/clients/ClientDescription.tsx @@ -1,7 +1,14 @@ import React from "react"; -import { FormGroup, TextInput, ValidatedOptions } from "@patternfly/react-core"; import { useFormContext } from "react-hook-form"; import { useTranslation } from "react-i18next"; +import { + FormGroup, + TextArea, + TextInput, + ValidatedOptions, +} from "@patternfly/react-core"; + +import { HelpItem } from "../components/help-enabler/HelpItem"; import { FormAccess } from "../components/form-access/FormAccess"; import { ClientForm } from "./ClientDetails"; @@ -12,6 +19,13 @@ export const ClientDescription = () => { return ( + } label={t("clientID")} fieldId="kc-client-id" helperTextInvalid={t("common:required")} @@ -30,10 +44,27 @@ export const ClientDescription = () => { } /> - + + } + label={t("common:name")} + fieldId="kc-name" + > + } label={t("common:description")} fieldId="kc-description" validated={ @@ -41,7 +72,7 @@ export const ClientDescription = () => { } helperTextInvalid={errors.description?.message} > - { {client.clientId} {!client.enabled && ( - + Disabled )} diff --git a/src/clients/add/CapabilityConfig.tsx b/src/clients/add/CapabilityConfig.tsx index c52178ce47..b8101ea729 100644 --- a/src/clients/add/CapabilityConfig.tsx +++ b/src/clients/add/CapabilityConfig.tsx @@ -8,129 +8,203 @@ import { GridItem, } from "@patternfly/react-core"; import { Controller, useFormContext } from "react-hook-form"; - import { FormAccess } from "../../components/form-access/FormAccess"; import { ClientForm } from "../ClientDetails"; +import { HelpItem } from "../../components/help-enabler/HelpItem"; -export const CapabilityConfig = () => { +type CapabilityConfigProps = { + unWrap?: boolean; + protocol?: string; +}; + +export const CapabilityConfig = ({ + unWrap, + protocol: type, +}: CapabilityConfigProps) => { const { t } = useTranslation("clients"); - const { control } = useFormContext(); + const { control, watch } = useFormContext(); + const protocol = type || watch("protocol"); + return ( - - - ( - - )} - /> - - - ( - - )} - /> - - - - - ( - + <> + {protocol === "openid-connect" && ( + <> + + ( + + )} + /> + + + ( + + )} + /> + + + + + ( + + )} + /> + + + ( + + )} + /> + + + ( + + )} + /> + + + ( + + )} + /> + + + + + )} + + <> + {protocol === "saml" && ( + <> + - )} - /> - - - ( - + ( + onChange("" + value)} + /> + )} + /> + + - )} - /> - - - ( - - )} - /> - - - ( - - )} - /> - - - + } + label={t("clientSignature")} + fieldId="kc-client-signature" + > + ( + onChange("" + value)} + /> + )} + /> + + + )} + ); }; diff --git a/src/clients/add/NewClientForm.tsx b/src/clients/add/NewClientForm.tsx index 49d51c8d41..55364e7f04 100644 --- a/src/clients/add/NewClientForm.tsx +++ b/src/clients/add/NewClientForm.tsx @@ -111,11 +111,11 @@ export const NewClientForm = () => { }, { name: t("capabilityConfig"), - component: , + component: , }, ]} footer={