change text based on the context (#25664)

fixes: #25302

Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>

js/apps/admin-ui/maven-resources/theme/keycloak.v2/admin/messages/messages_en.properties

@@ -945,7 +945,7 @@ homeURL=Home URL
 eventTypes.REVOKE_GRANT_ERROR.name=Revoke grant error
 contentSecurityPolicyReportOnly=Content-Security-Policy-Report-Only
 firstBrokerLoginFlowAlias=First login flow
-missingAttributes=No {{name}} have been defined yet. Click the below button to add {{name}}, key and value are required for a key pair.
+missingAttributes=No {{label}} have been defined yet. Click the below button to add {{label}}, key and value are required for a key pair.
 testConnectionError=Error\! {{error}}
 authenticatedAccessPoliciesHelp=Those Policies are used when Client Registration Service is invoked by authenticated request. This means that the request contains Initial Access Token or Bearer Token.
 deleteClientPolicyProfileSuccess=Profile successfully removed from the policy.
@@ -2667,7 +2667,7 @@ permissionDecisionStrategyHelp=The decision strategy dictates how the policies a
 userManagedAccessHelp=If enabled, users are allowed to manage their resources and permissions using the Account Management UI.
 confirm=Confirm
 policyType.totp=Time based
-addAttribute=Add an attribute
+addAttribute=Add {{label}}
 clientScopeSearch.protocol=Protocol
 initialAccessTokenDetails=Initial access token details
 noMessageBundles=No message bundles

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

@@ -277,6 +277,7 @@ export const AdvancedSettings = ({
             }
           >
             <KeyValueInput
+              label={t("acrToLoAMapping")}
               name={convertAttributeNameToForm("attributes.acr.loa.map")}
             />
           </FormGroup>

js/apps/admin-ui/src/components/dynamic/MapComponent.tsx

@@ -142,7 +142,7 @@ export const MapComponent = ({
             icon={<PlusCircleIcon />}
             onClick={() => appendNew()}
           >
-            {t("addAttribute")}
+            {t("addAttribute", { label })}
           </Button>
         </ActionListItem>
       </ActionList>
@@ -153,7 +153,7 @@ export const MapComponent = ({
       className="pf-u-p-0"
       variant="xs"
     >
-      <EmptyStateBody>{t("missingAttributes", { name })}</EmptyStateBody>
+      <EmptyStateBody>{t("missingAttributes", { label })}</EmptyStateBody>
       <Button
         data-testid={`${name}-add-row`}
         variant="link"
@@ -162,7 +162,7 @@ export const MapComponent = ({
         onClick={appendNew}
         isDisabled={isDisabled}
       >
-        {t("addAttribute")}
+        {t("addAttribute", { label })}
       </Button>
     </EmptyState>
   );

js/apps/admin-ui/src/components/key-value-form/KeyValueInput.tsx

@@ -31,12 +31,14 @@ export type DefaultValue = {
 
 type KeyValueInputProps = {
   name: string;
+  label?: string;
   defaultKeyValue?: DefaultValue[];
   isDisabled?: boolean;
 };
 
 export const KeyValueInput = ({
   name,
+  label = "attributes",
   defaultKeyValue,
   isDisabled = false,
 }: KeyValueInputProps) => {
@@ -154,7 +156,7 @@ export const KeyValueInput = ({
             onClick={appendNew}
             isDisabled={isDisabled}
           >
-            {t("addAttribute")}
+            {t("addAttribute", { label })}
           </Button>
         </ActionListItem>
       </ActionList>
@@ -165,9 +167,7 @@ export const KeyValueInput = ({
       className="pf-u-p-0"
       variant="xs"
     >
-      <EmptyStateBody>
-        {t("missingAttributes", { name: "attributes" })}
-      </EmptyStateBody>
+      <EmptyStateBody>{t("missingAttributes", { label })}</EmptyStateBody>
       <Button
         data-testid={`${name}-add-row`}
         variant="link"
@@ -176,7 +176,7 @@ export const KeyValueInput = ({
         onClick={appendNew}
         isDisabled={isDisabled}
       >
-        {t("addAttribute")}
+        {t("addAttribute", { label })}
       </Button>
     </EmptyState>
   );

js/apps/admin-ui/src/realm-settings/GeneralTab.tsx

@@ -218,6 +218,7 @@ export const RealmSettingsGeneralTab = ({
         >
           <FormProvider {...form}>
             <KeyValueInput
+              label={t("acrToLoAMapping")}
               name={convertAttributeNameToForm("attributes.acr.loa.map")}
             />
           </FormProvider>

js/apps/admin-ui/src/realm-settings/user-profile/AttributesGroupForm.tsx

@@ -166,7 +166,7 @@ export default function AttributesGroupForm() {
           </TextContent>
           <FormGroup label={t("annotationsText")} fieldId="kc-annotations">
             <FormProvider {...form}>
-              <KeyValueInput name="annotations" />
+              <KeyValueInput label={t("annotationsText")} name="annotations" />
             </FormProvider>
           </FormGroup>
           <ActionGroup>

js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributeAnnotations.tsx

@@ -21,6 +21,7 @@ export const AttributeAnnotations = () => {
           <GridItem>
             <KeyValueInput
               name="annotations"
+              label={t("annotations")}
               defaultKeyValue={[
                 {
                   key: "inputType",