From 8917744c042ecac592b188d442db6aa9160c3156 Mon Sep 17 00:00:00 2001 From: Jenny <32821331+jenny-s51@users.noreply.github.com> Date: Wed, 6 Oct 2021 07:04:17 -0400 Subject: [PATCH] Identity providers(mappers): update form fields for all Social mapper types (#1304) Co-authored-by: Jon Koops --- .../integration/identity_providers.spec.ts | 16 +- .../identity_providers/AddMapperPage.ts | 32 +- src/identity-providers/add/AddMapper.tsx | 901 +++++++++--------- src/identity-providers/add/AddMapperForm.tsx | 11 +- src/identity-providers/help.ts | 3 + src/identity-providers/messages.ts | 1 + 6 files changed, 508 insertions(+), 456 deletions(-) diff --git a/cypress/integration/identity_providers.spec.ts b/cypress/integration/identity_providers.spec.ts index ad973a06ab..f2a66b7537 100644 --- a/cypress/integration/identity_providers.spec.ts +++ b/cypress/integration/identity_providers.spec.ts @@ -272,6 +272,20 @@ describe("Identity provider test", () => { masthead.checkNotificationMessage(createMapperSuccessMsg); }); + it("should add Social mapper of type Attribute Importer", () => { + sidebarPage.goToIdentityProviders(); + + listingPage.goToItemDetails("facebook"); + + addMapperPage.goToMappersTab(); + + addMapperPage.addMapper(); + + addMapperPage.fillSocialMapper("facebook attribute importer"); + + masthead.checkNotificationMessage(createMapperSuccessMsg); + }); + it("should edit Username Template Importer mapper", () => { sidebarPage.goToIdentityProviders(); @@ -293,7 +307,7 @@ describe("Identity provider test", () => { addMapperPage.goToMappersTab(); - listingPage.goToItemDetails("facebook mapper"); + listingPage.goToItemDetails("facebook attribute importer"); addMapperPage.editSocialMapper(); }); diff --git a/cypress/support/pages/admin_console/manage/identity_providers/AddMapperPage.ts b/cypress/support/pages/admin_console/manage/identity_providers/AddMapperPage.ts index fe991f7399..1e952ac398 100644 --- a/cypress/support/pages/admin_console/manage/identity_providers/AddMapperPage.ts +++ b/cypress/support/pages/admin_console/manage/identity_providers/AddMapperPage.ts @@ -9,7 +9,10 @@ export default class AddMapperPage { private mapperRoleInput = "mapper-role-input"; private attributeName = "attribute-name"; private attributeFriendlyName = "attribute-friendly-name"; + private attributeValue = "attribute-value"; private claimInput = "claim"; + private claimValueInput = "claim-value-input"; + private socialProfileJSONfieldPath = "social-profile-JSON-field-path"; private userAttribute = "user-attribute"; private userAttributeName = "user-attribute-name"; private userAttributeValue = "user-attribute-value"; @@ -73,14 +76,17 @@ export default class AddMapperPage { .contains("Attribute Importer") .click(); - cy.findByTestId(this.userSessionAttribute).clear(); - cy.findByTestId(this.userSessionAttribute).type("user session attribute"); - cy.findByTestId(this.userSessionAttributeValue).clear(); - - cy.findByTestId(this.userSessionAttributeValue).type( - "user session attribute value" + cy.findByTestId(this.socialProfileJSONfieldPath).clear(); + cy.findByTestId(this.socialProfileJSONfieldPath).type( + "social profile JSON field path" ); + cy.findByTestId(this.userAttributeName).clear(); + + cy.findByTestId(this.userAttributeName).type("user attribute name"); + + this.saveNewMapper(); + return this; } @@ -332,16 +338,16 @@ export default class AddMapperPage { cy.findByTestId("inherit").click(); - cy.findByTestId(this.userSessionAttribute).clear(); - cy.findByTestId(this.userSessionAttribute).type( - "user session attribute_edited" - ); - cy.findByTestId(this.userSessionAttributeValue).clear(); + cy.findByTestId(this.socialProfileJSONfieldPath).clear(); - cy.findByTestId(this.userSessionAttributeValue).type( - "user session attribute value_edited" + cy.findByTestId(this.socialProfileJSONfieldPath).type( + "social profile JSON field path edited" ); + cy.findByTestId(this.userAttributeName).clear(); + + cy.findByTestId(this.userAttributeName).type("user attribute name edited"); + this.saveNewMapper(); return this; diff --git a/src/identity-providers/add/AddMapper.tsx b/src/identity-providers/add/AddMapper.tsx index 53b937de7f..4d16899148 100644 --- a/src/identity-providers/add/AddMapper.tsx +++ b/src/identity-providers/add/AddMapper.tsx @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useMemo, useState } from "react"; import { Link, useParams } from "react-router-dom"; import { useTranslation } from "react-i18next"; import { Controller, useFieldArray, useForm } from "react-hook-form"; @@ -35,6 +35,8 @@ import { convertToFormValues } from "../../util"; import { toIdentityProvider } from "../routes/IdentityProvider"; import type IdentityProviderMapperRepresentation from "@keycloak/keycloak-admin-client/lib/defs/identityProviderMapperRepresentation"; import { AddMapperForm } from "./AddMapperForm"; +import { useServerInfo } from "../../context/server-info/ServerInfoProvider"; +import { groupBy } from "lodash"; export type IdPMapperRepresentationWithAttributes = IdentityProviderMapperRepresentation & { @@ -54,11 +56,26 @@ export const AddMapper = () => { const { providerId, alias } = useParams(); const { id } = useParams(); - const isSAMLorOIDC = providerId === "saml" || providerId === "oidc"; + const serverInfo = useServerInfo(); + const identityProviders = useMemo( + () => groupBy(serverInfo.identityProviders, "groupName"), + [serverInfo] + ); + + const isSocialIdP = useMemo( + () => + identityProviders["Social"] + .map((item) => item.id) + .includes(providerId.toLowerCase()), + [identityProviders, providerId] + ); const [mapperTypes, setMapperTypes] = useState>(); - const [mapperType, setMapperType] = useState("advancedAttributeToRole"); + const [mapperType, setMapperType] = useState( + isSocialIdP ? "attributeImporter" : "hardcodedRole" + ); + const [currentMapper, setCurrentMapper] = useState(); const [roles, setRoles] = useState([]); @@ -207,6 +224,11 @@ export const AddMapper = () => { const isOIDCUsernameTemplateImporter = formValues.identityProviderMapper === "oidc-username-idp-mapper"; + const isSocialAttributeImporter = useMemo( + () => formValues.identityProviderMapper?.includes("user-attribute-mapper"), + [formValues.identityProviderMapper] + ); + const toggleModal = () => { setRolesModalOpen(!rolesModalOpen); }; @@ -218,10 +240,12 @@ export const AddMapper = () => { titleKey={ id ? t("editIdPMapper", { - providerId: providerId.toUpperCase(), + providerId: + providerId[0].toUpperCase() + providerId.substring(1), }) : t("addIdPMapper", { - providerId: providerId.toUpperCase(), + providerId: + providerId[0].toUpperCase() + providerId.substring(1), }) } divider @@ -267,362 +291,321 @@ export const AddMapper = () => { - {isSAMLorOIDC ? ( - <> - {(isSAMLAdvancedAttrToRole || isOIDCAdvancedClaimToRole) && ( - <> - - } - fieldId="kc-gui-order" - > - - - - } - fieldId="regexAttributeValues" - > - ( - onChange("" + value)} - /> - )} - /> - - - )} - {(isSAMLUsernameTemplateImporter || - isOIDCUsernameTemplateImporter) && ( - <> - - } - fieldId="kc-user-session-attribute" - validated={ - errors.name - ? ValidatedOptions.error - : ValidatedOptions.default - } - helperTextInvalid={t("common:required")} - > - + {(isSAMLAdvancedAttrToRole || isOIDCAdvancedClaimToRole) && ( + <> + - - + + + + } + fieldId="regexAttributeValues" + > + ( + onChange("" + value)} /> - } - fieldId="kc-target" + )} + /> + + + )} + {(isSAMLUsernameTemplateImporter || + isOIDCUsernameTemplateImporter) && ( + <> + + } + fieldId="kc-user-session-attribute" + validated={ + errors.name + ? ValidatedOptions.error + : ValidatedOptions.default + } + helperTextInvalid={t("common:required")} + > + - ( - - )} + /> + + - - - )} + } + fieldId="kc-target" + validated={ + errors.name + ? ValidatedOptions.error + : ValidatedOptions.default + } + helperTextInvalid={t("common:required")} + > + ( + + )} + /> + + + )} - {(isHardcodedAttribute || isHardcodedUserSessionAttribute) && ( - <> - + + } + fieldId="kc-user-session-attribute" + validated={ + errors.name + ? ValidatedOptions.error + : ValidatedOptions.default + } + helperTextInvalid={t("common:required")} + > + - } - fieldId="kc-user-session-attribute" + name="config.attribute" validated={ errors.name ? ValidatedOptions.error : ValidatedOptions.default } - helperTextInvalid={t("common:required")} - > - + + - - + - } - fieldId="kc-user-session-attribute-value" + id="kc-user-session-attribute-value" + name="config.attribute-value" validated={ errors.name ? ValidatedOptions.error : ValidatedOptions.default } - helperTextInvalid={t("common:required")} - > - - - - )} - {(isSAMLAttributeImporter || - isOIDCAttributeImporter || - isOIDCclaimToRole) && ( - <> - {isSAMLAttributeImporter ? ( - <> - - } - fieldId="kc-attribute-name" - validated={ - errors.name - ? ValidatedOptions.error - : ValidatedOptions.default - } - helperTextInvalid={t("common:required")} - > - - - - } - fieldId="kc-friendly-name" - validated={ - errors.name - ? ValidatedOptions.error - : ValidatedOptions.default - } - helperTextInvalid={t("common:required")} - > - - - - ) : ( + /> + + + )} + {(isSAMLAttributeImporter || + isOIDCAttributeImporter || + isOIDCclaimToRole) && ( + <> + {isSAMLAttributeImporter ? ( + <> + } + fieldId="kc-attribute-name" + validated={ + errors.name + ? ValidatedOptions.error + : ValidatedOptions.default + } + helperTextInvalid={t("common:required")} + > + + + } @@ -637,10 +620,12 @@ export const AddMapper = () => { { } /> - )} + + ) : ( } - fieldId="kc-user-attribute-name" + fieldId="kc-friendly-name" validated={ errors.name ? ValidatedOptions.error @@ -684,24 +658,10 @@ export const AddMapper = () => { { } /> - - )} - {(isSAMLAdvancedAttrToRole || - isHardcodedRole || - isSAMLAttributeToRole || - isOIDCAdvancedClaimToRole || - isOIDCclaimToRole) && ( + )} } - fieldId="kc-role" + fieldId="kc-user-attribute-name" validated={ - errors.config?.role + errors.name ? ValidatedOptions.error : ValidatedOptions.default } @@ -739,94 +705,151 @@ export const AddMapper = () => { + + + )} + + {isSocialAttributeImporter && ( + <> + + } + fieldId="kc-social-profile-JSON-field-path" + validated={ + errors.name + ? ValidatedOptions.error + : ValidatedOptions.default + } + helperTextInvalid={t("common:required")} + > + - - )} - - ) : ( - <> - - } - fieldId="kc-user-session-attribute" - isRequired - validated={ - errors.name ? ValidatedOptions.error : ValidatedOptions.default - } - helperTextInvalid={t("common:required")} - > - + } + fieldId="kc-user-session-attribute-value" validated={ errors.name ? ValidatedOptions.error : ValidatedOptions.default } - /> - + helperTextInvalid={t("common:required")} + > + + + + )} + {(isSAMLAdvancedAttrToRole || + isHardcodedRole || + isSAMLAttributeToRole || + isOIDCAdvancedClaimToRole || + isOIDCclaimToRole) && ( } - fieldId="kc-user-session-attribute-value" - isRequired + fieldId="kc-role" validated={ - errors.name ? ValidatedOptions.error : ValidatedOptions.default + errors.config?.role + ? ValidatedOptions.error + : ValidatedOptions.default } helperTextInvalid={t("common:required")} > + - - )} - + )} +