don't add empty key values (#25472)

* don't add empty key values

fixes: #24678

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

* fixed test

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

---------

Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>
This commit is contained in:
Erik Jan de Wit 2023-12-15 13:30:16 +01:00 committed by GitHub
parent c6ce859493
commit 8263c538d8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 41 additions and 13 deletions

View file

@ -115,6 +115,7 @@ export default class AddMapperPage {
.contains("Advanced Attribute to Role")
.click();
cy.findByTestId("attributes-add-row").click();
cy.get(this.#attributesKeyInput).clear();
cy.get(this.#attributesKeyInput).type("key");
@ -394,6 +395,7 @@ export default class AddMapperPage {
cy.findByTestId(this.#idpMapperSelect).contains("Claim to Role").click();
cy.findByTestId("claims-add-row").click();
const keyValue = new LegacyKeyValueInput("config.claims");
keyValue.fillKeyValue({ key: "key", value: "value" });

View file

@ -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 attributes have been defined yet. Click the below button to add attributes, key and value are required for a key pair.
missingAttributes=No {{name}} have been defined yet. Click the below button to add {{name}}, 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.

View file

@ -2,6 +2,8 @@ import {
ActionList,
ActionListItem,
Button,
EmptyState,
EmptyStateBody,
Flex,
FlexItem,
FormGroup,
@ -27,6 +29,7 @@ export const MapComponent = ({
label,
helpText,
required,
isDisabled,
}: ComponentProps) => {
const { t } = useTranslation();
@ -37,15 +40,20 @@ export const MapComponent = ({
useEffect(() => {
register(fieldName);
const values: KeyValueType[] = JSON.parse(getValues(fieldName) || "[]");
if (!values.length) {
values.push({ key: "", value: "" });
}
setMap(values.map((value) => ({ ...value, id: generateId() })));
}, [register, getValues]);
}, []);
const appendNew = () =>
setMap([...map, { key: "", value: "", id: generateId() }]);
const update = (val = map) => {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
setValue(fieldName, JSON.stringify(val.map(({ id, ...entry }) => entry)));
setValue(
fieldName,
JSON.stringify(
// eslint-disable-next-line @typescript-eslint/no-unused-vars
val.filter((e) => e.key !== "").map(({ id, ...entry }) => entry),
),
);
};
const updateKey = (index: number, key: string) => {
@ -65,7 +73,7 @@ export const MapComponent = ({
update(value);
};
return (
return map.length !== 0 ? (
<FormGroup
label={t(label!)}
labelIcon={<HelpItem helpText={t(helpText!)} fieldLabelId={`${label}`} />}
@ -115,7 +123,7 @@ export const MapComponent = ({
<Button
variant="link"
title={t("removeAttribute")}
isDisabled={map.length === 1}
isDisabled={isDisabled}
onClick={() => remove(index)}
data-testid={`${fieldName}.${index}.remove`}
>
@ -132,14 +140,30 @@ export const MapComponent = ({
className="pf-u-px-0 pf-u-mt-sm"
variant="link"
icon={<PlusCircleIcon />}
onClick={() =>
setMap([...map, { key: "", value: "", id: generateId() }])
}
onClick={() => appendNew()}
>
{t("addAttribute")}
</Button>
</ActionListItem>
</ActionList>
</FormGroup>
) : (
<EmptyState
data-testid={`${name}-empty-state`}
className="pf-u-p-0"
variant="xs"
>
<EmptyStateBody>{t("missingAttributes", { name })}</EmptyStateBody>
<Button
data-testid={`${name}-add-row`}
variant="link"
icon={<PlusCircleIcon />}
isSmall
onClick={appendNew}
isDisabled={isDisabled}
>
{t("addAttribute")}
</Button>
</EmptyState>
);
};

View file

@ -165,7 +165,9 @@ export const KeyValueInput = ({
className="pf-u-p-0"
variant="xs"
>
<EmptyStateBody>{t("missingAttributes")}</EmptyStateBody>
<EmptyStateBody>
{t("missingAttributes", { name: "attributes" })}
</EmptyStateBody>
<Button
data-testid={`${name}-add-row`}
variant="link"