add isDisabled to components (#17508)

js/apps/admin-ui/src/clients/ClientDescription.tsx

@@ -26,7 +26,10 @@ export const ClientDescription = ({
     <FormAccess role="manage-clients" fineGrainedAccess={configure} unWrap>
       <FormGroup
         labelIcon={
-          <HelpItem helpText="clients-help:clientId" fieldLabelId="clientId" />
+          <HelpItem
+            helpText={t("clients-help:clientId")}
+            fieldLabelId="clientId"
+          />
         }
         label={t("common:clientId")}
         fieldId="kc-client-id"

js/apps/admin-ui/src/clients/add/LoginSettings.tsx

@@ -12,10 +12,12 @@ import { FormFields } from "../ClientDetails";
 
 type LoginSettingsProps = {
   protocol?: string;
+  isDisabled?: boolean;
 };
 
 export const LoginSettings = ({
   protocol = "openid-connect",
+  ...rest
 }: LoginSettingsProps) => {
   const { t } = useTranslation("clients");
   const { register, watch } = useFormContext<FormFields>();
@@ -40,6 +42,7 @@ export const LoginSettings = ({
           id="kc-root-url"
           type="url"
           {...register("rootUrl")}
+          {...rest}
         />
       </FormGroup>
       <FormGroup
@@ -56,6 +59,7 @@ export const LoginSettings = ({
           id="kc-home-url"
           type="url"
           {...register("baseUrl")}
+          {...rest}
         />
       </FormGroup>
       <FormGroup
@@ -73,6 +77,7 @@ export const LoginSettings = ({
           name="redirectUris"
           aria-label={t("validRedirectUri")}
           addButtonLabel="clients:addRedirectUri"
+          {...rest}
         />
       </FormGroup>
       <FormGroup
@@ -93,6 +98,7 @@ export const LoginSettings = ({
           aria-label={t("validPostLogoutRedirectUri")}
           addButtonLabel="clients:addPostLogoutRedirectUri"
           stringify
+          {...rest}
         />
       </FormGroup>
       {protocol === "saml" && (
@@ -117,6 +123,7 @@ export const LoginSettings = ({
               id="idpInitiatedSsoUrlName"
               data-testid="idpInitiatedSsoUrlName"
               {...register("attributes.saml_idp_initiated_sso_url_name")}
+              {...rest}
             />
           </FormGroup>
           <FormGroup
@@ -133,6 +140,7 @@ export const LoginSettings = ({
               id="idpInitiatedSsoRelayState"
               data-testid="idpInitiatedSsoRelayState"
               {...register("attributes.saml_idp_initiated_sso_relay_state")}
+              {...rest}
             />
           </FormGroup>
           <FormGroup
@@ -150,6 +158,7 @@ export const LoginSettings = ({
               type="url"
               data-testid="masterSamlProcessingUrl"
               {...register("adminUrl")}
+              {...rest}
             />
           </FormGroup>
         </>
@@ -170,6 +179,7 @@ export const LoginSettings = ({
             name="webOrigins"
             aria-label={t("webOrigins")}
             addButtonLabel="clients:addWebOrigins"
+            {...rest}
           />
         </FormGroup>
       )}

js/apps/admin-ui/src/clients/advanced/ApplicationUrls.tsx

@@ -7,7 +7,11 @@ import { KeycloakTextInput } from "../../components/keycloak-text-input/Keycloak
 import { convertAttributeNameToForm } from "../../util";
 import { FormFields } from "../ClientDetails";
 
-export const ApplicationUrls = () => {
+type ApplicationUrlsProps = {
+  isDisabled?: boolean;
+};
+
+export const ApplicationUrls = (props: ApplicationUrlsProps) => {
   const { t } = useTranslation("clients");
   const { register } = useFormContext();
 
@@ -30,6 +34,7 @@ export const ApplicationUrls = () => {
           {...register(
             convertAttributeNameToForm<FormFields>("attributes.logoUri")
           )}
+          {...props}
         />
       </FormGroup>
       <FormGroup
@@ -49,6 +54,7 @@ export const ApplicationUrls = () => {
           {...register(
             convertAttributeNameToForm<FormFields>("attributes.policyUri")
           )}
+          {...props}
         />
       </FormGroup>
       <FormGroup
@@ -68,6 +74,7 @@ export const ApplicationUrls = () => {
           {...register(
             convertAttributeNameToForm<FormFields>("attributes.tosUri")
           )}
+          {...props}
         />
       </FormGroup>
     </>

js/apps/admin-ui/src/components/multi-line-input/MultiLineInput.tsx

@@ -96,7 +96,7 @@ export const MultiLineInput = ({
               onClick={() => remove(index)}
               tabIndex={-1}
               aria-label={t("common:remove")}
-              isDisabled={fields.length === 1}
+              isDisabled={fields.length === 1 || isDisabled}
             >
               <MinusCircleIcon />
             </Button>
@@ -108,7 +108,7 @@ export const MultiLineInput = ({
               tabIndex={-1}
               aria-label={t("common:add")}
               data-testid="addValue"
-              isDisabled={!value}
+              isDisabled={!value || isDisabled}
             >
               <PlusCircleIcon /> {t(addButtonLabel || "common:add")}
             </Button>

js/libs/ui-shared/src/controls/TextControl.tsx

@@ -16,6 +16,7 @@ export type TextControlProps<
 > = UseControllerProps<T, P> & {
   label: string;
   labelIcon?: string;
+  isDisabled?: boolean;
 };
 
 export const TextControl = <
@@ -53,6 +54,7 @@ export const TextControl = <
         validated={
           fieldState.error ? ValidatedOptions.error : ValidatedOptions.default
         }
+        isDisabled={props.isDisabled}
         {...field}
       />
     </FormGroup>