@keycloakify/keycloak-admin-ui
Version:
Repackaged Keycloak Admin UI
56 lines • 4.74 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { FormErrorText, HelpItem, useFetch, } from "../../../ui-shared";
import { Button, Checkbox, FormGroup } from "@patternfly/react-core";
import { MinusCircleIcon } from "@patternfly/react-icons";
import { Table, Tbody, Td, Th, Thead, Tr } from "@patternfly/react-table";
import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { useAdminClient } from "../../../admin-client";
import { DefaultSwitchControl } from "../../../components/SwitchControl";
import { AddRoleMappingModal } from "../../../components/role-mapping/AddRoleMappingModal";
import { ServiceRole } from "../../../components/role-mapping/RoleMapping";
export const Role = () => {
const { adminClient } = useAdminClient();
const { t } = useTranslation();
const { control, getValues, setValue, formState: { errors }, } = useFormContext();
const values = getValues("roles");
const [open, setOpen] = useState(false);
const [selectedRoles, setSelectedRoles] = useState([]);
useFetch(async () => {
if (values && values.length > 0) {
const roles = await Promise.all(values.map((r) => adminClient.roles.findOneById({ id: r.id })));
return Promise.all(roles.map(async (role) => ({
role: role,
client: role.clientRole
? await adminClient.clients.findOne({
id: role === null || role === void 0 ? void 0 : role.containerId,
})
: undefined,
})));
}
return Promise.resolve([]);
}, setSelectedRoles, []);
return (_jsxs(_Fragment, { children: [_jsxs(FormGroup, { label: t("roles"), labelIcon: _jsx(HelpItem, { helpText: t("policyRolesHelp"), fieldLabelId: "roles" }), fieldId: "roles", isRequired: true, children: [_jsx(Controller, { name: "roles", control: control, defaultValue: [], rules: {
validate: (value) => value && value.filter((c) => c.id).length > 0,
}, render: ({ field }) => (_jsxs(_Fragment, { children: [open && (_jsx(AddRoleMappingModal, { id: "role", type: "roles", onAssign: (rows) => {
field.onChange([
...(field.value || []),
...rows.map((row) => ({ id: row.role.id })),
]);
setSelectedRoles([...selectedRoles, ...rows]);
setOpen(false);
}, onClose: () => {
setOpen(false);
}, isLDAPmapper: true })), _jsx(Button, { "data-testid": "select-role-button", variant: "secondary", onClick: () => {
setOpen(true);
}, children: t("addRoles") })] })) }), selectedRoles.length > 0 && (_jsxs(Table, { variant: "compact", children: [_jsx(Thead, { children: _jsxs(Tr, { children: [_jsx(Th, { children: t("roles") }), _jsx(Th, { children: t("required") }), _jsx(Th, { "aria-hidden": "true" })] }) }), _jsx(Tbody, { children: selectedRoles.map((row, index) => (_jsxs(Tr, { children: [_jsx(Td, { children: _jsx(ServiceRole, { role: row.role, client: row.client }) }), _jsx(Td, { children: _jsx(Controller, { name: `roles.${index}.required`, defaultValue: false, control: control, render: ({ field }) => (_jsx(Checkbox, { id: "required", "data-testid": "standard", name: "required", isChecked: field.value, onChange: field.onChange })) }) }), _jsx(Td, { children: _jsx(Button, { variant: "link", className: "keycloak__client-authorization__policy-row-remove", icon: _jsx(MinusCircleIcon, {}), onClick: () => {
setValue("roles", [
...(values || []).filter((s) => s.id !== row.role.id),
]);
setSelectedRoles([
...selectedRoles.filter((s) => s.role.id !== row.role.id),
]);
} }) })] }, row.role.id))) })] })), errors.roles && _jsx(FormErrorText, { message: t("requiredRoles") })] }), _jsx(DefaultSwitchControl, { name: "fetchRoles", label: t("fetchRoles"), labelIcon: t("fetchRolesHelp") })] }));
};
//# sourceMappingURL=Role.js.map