@keycloakify/keycloak-admin-ui
Version:
Repackaged Keycloak Admin UI
129 lines • 8.69 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { HelpItem, KeycloakSelect, SelectVariant, useAlerts, useFetch, } from "../ui-shared";
import { ActionGroup, AlertVariant, Button, FormGroup, PageSection, SelectOption, } from "@patternfly/react-core";
import { camelCase } from "lodash-es";
import { useState } from "react";
import { Controller, FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate, useParams } from "react-router-dom";
import { useAdminClient } from "../admin-client";
import { DynamicComponents } from "../components/dynamic/DynamicComponents";
import { FormAccess } from "../components/form/FormAccess";
import { ViewHeader } from "../components/view-header/ViewHeader";
import { useRealm } from "../context/realm-context/RealmContext";
import { useServerInfo } from "../context/server-info/ServerInfoProvider";
import { toEditClientPolicy } from "../realm-settings/routes/EditClientPolicy";
export default function NewClientPolicyCondition() {
var _a;
const { adminClient } = useAdminClient();
const { t } = useTranslation();
const { addAlert, addError } = useAlerts();
const navigate = useNavigate();
const { realm } = useRealm();
const [openConditionType, setOpenConditionType] = useState(false);
const [isGlobalPolicy, setIsGlobalPolicy] = useState(false);
const [policies, setPolicies] = useState([]);
const [condition, setCondition] = useState([]);
const [conditionData, setConditionData] = useState();
const [conditionType, setConditionType] = useState("");
const [conditionProperties, setConditionProperties] = useState([]);
const { policyName, conditionName } = useParams();
const serverInfo = useServerInfo();
const form = useForm();
const conditionTypes = (_a = serverInfo.componentTypes) === null || _a === void 0 ? void 0 : _a["org.keycloak.services.clientpolicy.condition.ClientPolicyConditionProvider"];
const setupForm = (condition) => {
form.reset({ config: condition.configuration || {} });
};
useFetch(() => adminClient.clientPolicies.listPolicies({
includeGlobalPolicies: true,
}), (policies) => {
var _a, _b, _c, _d;
setPolicies((_a = policies.policies) !== null && _a !== void 0 ? _a : []);
if (conditionName) {
let currentPolicy = (_b = policies.policies) === null || _b === void 0 ? void 0 : _b.find((item) => item.name === policyName);
if (currentPolicy === undefined) {
currentPolicy = (_c = policies.globalPolicies) === null || _c === void 0 ? void 0 : _c.find((item) => item.name === policyName);
setIsGlobalPolicy(currentPolicy !== undefined);
}
const typeAndConfigData = (_d = currentPolicy === null || currentPolicy === void 0 ? void 0 : currentPolicy.conditions) === null || _d === void 0 ? void 0 : _d.find((item) => item.condition === conditionName);
const currentCondition = conditionTypes === null || conditionTypes === void 0 ? void 0 : conditionTypes.find((condition) => condition.id === conditionName);
setConditionData(typeAndConfigData);
setConditionProperties(currentCondition === null || currentCondition === void 0 ? void 0 : currentCondition.properties);
setupForm(typeAndConfigData);
}
}, []);
const save = async (configPolicy) => {
const configValues = configPolicy.config;
const writeConfig = () => {
return conditionProperties.reduce((r, p) => {
r[p.name] = configValues[p.name];
return r;
}, {});
};
const updatedPolicies = policies.map((policy) => {
var _a;
if (policy.name !== policyName) {
return policy;
}
let conditions = (_a = policy.conditions) !== null && _a !== void 0 ? _a : [];
if (conditionName) {
const createdCondition = {
condition: conditionData === null || conditionData === void 0 ? void 0 : conditionData.condition,
configuration: writeConfig(),
};
const index = conditions.findIndex((condition) => conditionName === condition.condition);
if (index === -1) {
return;
}
const newConditions = [
...conditions.slice(0, index),
createdCondition,
...conditions.slice(index + 1),
];
return {
...policy,
conditions: newConditions,
};
}
conditions = conditions.concat({
condition: condition[0].condition,
configuration: writeConfig(),
});
return {
...policy,
conditions,
};
});
try {
await adminClient.clientPolicies.updatePolicy({
policies: updatedPolicies,
});
setPolicies(updatedPolicies);
navigate(toEditClientPolicy({ realm, policyName: policyName }));
addAlert(conditionName
? t("updateClientConditionSuccess")
: t("createClientConditionSuccess"), AlertVariant.success);
}
catch (error) {
addError("createClientConditionError", error);
}
};
return (_jsxs(_Fragment, { children: [_jsx(ViewHeader, { titleKey: conditionName
? isGlobalPolicy
? t("viewCondition")
: t("editCondition")
: t("addCondition"), divider: true }), _jsxs(PageSection, { variant: "light", children: [_jsxs(FormAccess, { isHorizontal: true, role: "manage-realm", isReadOnly: isGlobalPolicy, className: "pf-v5-u-mt-lg", onSubmit: form.handleSubmit(save), children: [_jsx(FormGroup, { label: t("conditionType"), fieldId: "conditionType", labelIcon: _jsx(HelpItem, { helpText: conditionType
? `${camelCase(conditionType.replace(/-/g, " "))}Help`
: "conditionsHelp", fieldLabelId: "conditionType" }), children: _jsx(Controller, { name: "conditions", defaultValue: "any-client", control: form.control, render: ({ field }) => (_jsx(KeycloakSelect, { placeholderText: t("selectACondition"), className: "kc-conditionType-select", "data-testid": "conditionType-select", toggleId: "provider", isDisabled: !!conditionName, onToggle: (toggle) => setOpenConditionType(toggle), onSelect: (value) => {
field.onChange(value);
setConditionProperties(value.properties);
setConditionType(value.id);
setCondition([
{
condition: value.id,
},
]);
setOpenConditionType(false);
}, selections: conditionName ? conditionName : conditionType, variant: SelectVariant.single, "aria-label": t("conditionType"), isOpen: openConditionType, children: conditionTypes === null || conditionTypes === void 0 ? void 0 : conditionTypes.map((condition) => (_jsx(SelectOption, { selected: condition.id === field.value, description: t(camelCase(condition.id.replace(/-/g, " "))), value: condition, children: condition.id }, condition.id))) })) }) }), _jsx(FormProvider, { ...form, children: _jsx(DynamicComponents, { properties: conditionProperties }) }), !isGlobalPolicy && (_jsxs(ActionGroup, { children: [_jsx(Button, { variant: "primary", type: "submit", "data-testid": "addCondition-saveBtn", isDisabled: conditionType === "" && !conditionName && isGlobalPolicy, children: conditionName ? t("save") : t("add") }), _jsx(Button, { variant: "link", "data-testid": "addCondition-cancelBtn", onClick: () => navigate(toEditClientPolicy({ realm, policyName: policyName })), children: t("cancel") })] }))] }), isGlobalPolicy && (_jsx("div", { className: "kc-backToProfile", children: _jsx(Button, { component: (props) => (_jsx(Link, { ...props, to: toEditClientPolicy({ realm, policyName: policyName }) })), variant: "primary", children: t("back") }) }))] })] }));
}
//# sourceMappingURL=NewClientPolicyCondition.js.map