@keycloakify/keycloak-admin-ui
Version:
Repackaged Keycloak Admin UI
65 lines • 4.86 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useMemo, useState } from "react";
import { useTranslation } from "react-i18next";
import { Button, ButtonVariant, DataList, DataListCell, DataListItem, DataListItemCells, DataListItemRow, Modal, ModalVariant, Text, TextContent, TextVariants, } from "@patternfly/react-core";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
import { ListEmptyState } from "../../ui-shared";
import { KeycloakDataTable } from "../../ui-shared";
import useLocaleSort, { mapByKey } from "../../utils/useLocaleSort";
export const AddMapperDialog = (props) => {
const { t } = useTranslation();
const serverInfo = useServerInfo();
const protocol = props.protocol;
const protocolMappers = serverInfo.protocolMapperTypes[protocol];
const builtInMappers = serverInfo.builtinProtocolMappers[protocol];
const [filter, setFilter] = useState([]);
const [selectedRows, setSelectedRows] = useState([]);
const localeSort = useLocaleSort();
const allRows = useMemo(() => localeSort(builtInMappers, mapByKey("name")).map((mapper) => {
const mapperType = protocolMappers.find((type) => type.id === mapper.protocolMapper);
return {
item: mapper,
id: mapper.name,
description: mapperType.helpText,
};
}), [builtInMappers, protocolMappers]);
const [rows, setRows] = useState(allRows);
if (props.filter && props.filter.length !== filter.length) {
setFilter(props.filter);
const nameFilter = props.filter.map((f) => f.name);
setRows([...allRows.filter((row) => !nameFilter.includes(row.item.name))]);
}
const sortedProtocolMappers = useMemo(() => localeSort(protocolMappers, mapByKey("name")), [protocolMappers]);
const isBuiltIn = !!props.filter;
const header = [t("name"), t("description")];
return (_jsxs(Modal, { "aria-label": isBuiltIn ? t("addPredefinedMappers") : t("emptySecondaryAction"), variant: ModalVariant.medium, header: _jsxs(TextContent, { role: "dialog", "aria-label": isBuiltIn ? t("addPredefinedMappers") : t("emptySecondaryAction"), children: [_jsx(Text, { component: TextVariants.h1, children: isBuiltIn ? t("addPredefinedMappers") : t("emptySecondaryAction") }), _jsx(Text, { children: isBuiltIn
? t("predefinedMappingDescription")
: t("configureMappingDescription") })] }), isOpen: props.open, onClose: props.toggleDialog, actions: isBuiltIn
? [
_jsx(Button, { id: "modal-confirm", "data-testid": "confirm", isDisabled: rows.length === 0 || selectedRows.length === 0, onClick: () => {
props.onConfirm(selectedRows.map(({ item }) => item));
props.toggleDialog();
}, children: t("add") }, "confirm"),
_jsx(Button, { id: "modal-cancel", "data-testid": "cancel", variant: ButtonVariant.link, onClick: () => {
props.toggleDialog();
}, children: t("cancel") }, "cancel"),
]
: [], children: [!isBuiltIn && (_jsxs(DataList, { onSelectDataListItem: (_event, id) => {
const mapper = protocolMappers.find((mapper) => mapper.id === id);
props.onConfirm(mapper);
props.toggleDialog();
}, "aria-label": t("addPredefinedMappers"), isCompact: true, children: [_jsx(DataListItem, { "aria-label": t("headerName"), id: "header", children: _jsx(DataListItemRow, { children: _jsx(DataListItemCells, { dataListCells: header.map((name) => (_jsx(DataListCell, { style: { fontWeight: 700 }, children: name }, name))) }) }) }), sortedProtocolMappers.map((mapper) => (_jsx(DataListItem, { "aria-label": mapper.name, id: mapper.id, children: _jsx(DataListItemRow, { children: _jsx(DataListItemCells, { dataListCells: [
_jsx(DataListCell, { children: mapper.name }, `name-${mapper.id}`),
_jsx(DataListCell, { children: mapper.helpText }, `helpText-${mapper.id}`),
] }) }) }, mapper.id)))] })), isBuiltIn && (_jsx(KeycloakDataTable, { loader: rows, onSelect: setSelectedRows, canSelectAll: true, ariaLabelKey: "addPredefinedMappers", searchPlaceholderKey: "searchForMapper", columns: [
{
name: "id",
displayKey: "name",
},
{
name: "description",
displayKey: "description",
},
], emptyState: _jsx(ListEmptyState, { message: t("emptyMappers"), instructions: t("emptyBuiltInMappersInstructions") }) }))] }));
};
//# sourceMappingURL=MapperDialog.js.map