diff --git a/src/components/keycloak-card/KeycloakCard.tsx b/src/components/keycloak-card/KeycloakCard.tsx index 8c36a538f0..163869b592 100644 --- a/src/components/keycloak-card/KeycloakCard.tsx +++ b/src/components/keycloak-card/KeycloakCard.tsx @@ -58,6 +58,7 @@ export const KeycloakCard = ({ {dropdownItems && ( } @@ -67,7 +68,7 @@ export const KeycloakCard = ({ /> )} - {title} + {title} diff --git a/src/components/view-header/ViewHeader.tsx b/src/components/view-header/ViewHeader.tsx index c8645bbe14..cccb36ddad 100644 --- a/src/components/view-header/ViewHeader.tsx +++ b/src/components/view-header/ViewHeader.tsx @@ -118,6 +118,7 @@ export const ViewHeader = ({ } isOpen={isDropdownOpen} dropdownItems={dropdownItems} + data-cy="action-dropdown" /> )} diff --git a/src/route-config.ts b/src/route-config.ts index 2c72f8b288..54c58c2f11 100644 --- a/src/route-config.ts +++ b/src/route-config.ts @@ -220,12 +220,24 @@ export const routes: RoutesFn = (t: TFunction) => [ breadcrumb: t("common:settings"), access: "view-realm", }, + { + path: "/:realm/user-federation/kerberos/new", + component: UserFederationKerberosSettings, + breadcrumb: t("common:settings"), + access: "view-realm", + }, { path: "/:realm/user-federation/ldap/:id", component: UserFederationLdapSettings, breadcrumb: t("common:settings"), access: "view-realm", }, + { + path: "/:realm/user-federation/ldap/new", + component: UserFederationLdapSettings, + breadcrumb: t("common:settings"), + access: "view-realm", + }, { path: "/:realm/", component: DashboardSection, diff --git a/src/user-federation/UserFederationKerberosSettings.tsx b/src/user-federation/UserFederationKerberosSettings.tsx index ffa9a6e197..2ea8b81e8e 100644 --- a/src/user-federation/UserFederationKerberosSettings.tsx +++ b/src/user-federation/UserFederationKerberosSettings.tsx @@ -37,6 +37,7 @@ const KerberosSettingsHeader = ({ toggleDeleteDialog, }: KerberosSettingsHeaderProps) => { const { t } = useTranslation("user-federation"); + const { id } = useParams<{ id: string }>(); const [toggleDisableDialog, DisableConfirm] = useConfirmDialog({ titleKey: "user-federation:userFedDisableConfirmTitle", messageKey: "user-federation:userFedDisableConfirm", @@ -49,24 +50,32 @@ const KerberosSettingsHeader = ({ return ( <> - toggleDeleteDialog()}> - {t("deleteProvider")} - , - ]} - isEnabled={value === "true"} - onToggle={(value) => { - if (!value) { - toggleDisableDialog(); - } else { - onChange("" + value); - save(); - } - }} - /> + {id === "new" ? ( + + ) : ( + toggleDeleteDialog()} + data-cy="delete-provider-cmd" + > + {t("deleteProvider")} + , + ]} + isEnabled={value === "true"} + onToggle={(value) => { + if (!value) { + toggleDisableDialog(); + } else { + onChange("" + value); + save(); + } + }} + /> + )} ); }; @@ -106,11 +115,23 @@ export const UserFederationKerberosSettings = () => { const save = async (component: ComponentRepresentation) => { try { - await adminClient.components.update({ id }, component); + if (id) { + if (id === "new") { + await adminClient.components.create(component); + } else { + await adminClient.components.update({ id }, component); + } + } setupForm(component as ComponentRepresentation); - addAlert(t("saveSuccess"), AlertVariant.success); + addAlert( + t(id === "new" ? "createSuccess" : "saveSuccess"), + AlertVariant.success + ); } catch (error) { - addAlert(`${t("saveError")} '${error}'`, AlertVariant.danger); + addAlert( + `${t(id === "new" ? "createError" : "saveError")} '${error}'`, + AlertVariant.danger + ); } }; @@ -135,7 +156,7 @@ export const UserFederationKerberosSettings = () => { ( {
- diff --git a/src/user-federation/UserFederationSection.tsx b/src/user-federation/UserFederationSection.tsx index fe316dbb18..b7cd3ce9d6 100644 --- a/src/user-federation/UserFederationSection.tsx +++ b/src/user-federation/UserFederationSection.tsx @@ -26,6 +26,8 @@ import { useAdminClient, asyncStateFetch } from "../context/auth/AdminClient"; import { useConfirmDialog } from "../components/confirm-dialog/ConfirmDialog"; import "./user-federation.css"; +import { useHistory, useRouteMatch } from "react-router-dom"; + export const UserFederationSection = () => { const [userFederations, setUserFederations] = useState< ComponentRepresentation[] @@ -37,12 +39,15 @@ export const UserFederationSection = () => { const [key, setKey] = useState(0); const refresh = () => setKey(new Date().getTime()); + const { url } = useRouteMatch(); + const history = useHistory(); + useEffect(() => { return asyncStateFetch( () => { const testParams: { [name: string]: string | number } = { parentId: realm, - type: "org.keycloak.storage.UserStorageProvider", // MF note that this is providerType in the output, but API call is still type + type: "org.keycloak.storage.UserStorageProvider", }; return adminClient.components.find(testParams); }, @@ -53,8 +58,18 @@ export const UserFederationSection = () => { }, [key]); const ufAddProviderDropdownItems = [ - LDAP, - Kerberos, + history.push(`${url}/ldap/new`)} + > + LDAP + , + history.push(`${url}/kerberos/new`)} + > + Kerberos + , ]; const learnMoreLinkProps = { @@ -95,6 +110,7 @@ export const UserFederationSection = () => { onClick={() => { toggleDeleteForCard(userFederation.id!); }} + data-cy="card-delete" > {t("common:delete")} , @@ -157,7 +173,11 @@ export const UserFederationSection = () => {
- + history.push(`${url}/kerberos/new`)} + data-cy="kerberos-card" + > diff --git a/src/user-federation/kerberos/KerberosSettingsRequired.tsx b/src/user-federation/kerberos/KerberosSettingsRequired.tsx index 9b8eb579e9..e53e6c0259 100644 --- a/src/user-federation/kerberos/KerberosSettingsRequired.tsx +++ b/src/user-federation/kerberos/KerberosSettingsRequired.tsx @@ -11,6 +11,7 @@ import { useTranslation } from "react-i18next"; import { UseFormMethods, Controller, useWatch } from "react-hook-form"; import { FormAccess } from "../../components/form-access/FormAccess"; +import { useRealm } from "../../context/realm-context/RealmContext"; import { HelpItem } from "../../components/help-enabler/HelpItem"; import _ from "lodash"; @@ -29,6 +30,7 @@ export const KerberosSettingsRequired = ({ }: KerberosSettingsRequiredProps) => { const { t } = useTranslation("user-federation"); const helpText = useTranslation("user-federation-help").t; + const { realm } = useRealm(); const [isEditModeDropdownOpen, setIsEditModeDropdownOpen] = useState(false); @@ -62,18 +64,19 @@ export const KerberosSettingsRequired = ({ isRequired > {/* These hidden fields are required so data object written back matches data retrieved */} -