@keycloakify/keycloak-admin-ui
Version:
Repackaged Keycloak Admin UI
92 lines • 5.2 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { TextControl, useAlerts, useFetch } from "../../ui-shared";
import { ActionGroup, Button, ButtonVariant, DropdownItem, PageSection, } from "@patternfly/react-core";
import { useState } from "react";
import { FormProvider, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
import { useAdminClient } from "../../admin-client";
import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog";
import { DynamicComponents } from "../../components/dynamic/DynamicComponents";
import { FormAccess } from "../../components/form/FormAccess";
import { KeycloakSpinner } from "../../ui-shared";
import { ViewHeader } from "../../components/view-header/ViewHeader";
import { useRealm } from "../../context/realm-context/RealmContext";
import { useParams } from "../../utils/useParams";
import { toRegistrationProvider, } from "../../clients/routes/AddRegistrationProvider";
import { toClientRegistration } from "../../clients/routes/ClientRegistration";
export default function DetailProvider() {
const { adminClient } = useAdminClient();
const { t } = useTranslation();
const { id, providerId, subTab } = useParams();
const navigate = useNavigate();
const form = useForm({
defaultValues: { providerId },
});
const { control, handleSubmit, reset } = form;
const { realm, realmRepresentation } = useRealm();
const { addAlert, addError } = useAlerts();
const [provider, setProvider] = useState();
useFetch(async () => await Promise.all([
adminClient.realms.getClientRegistrationPolicyProviders({ realm }),
id ? adminClient.components.findOne({ id }) : Promise.resolve(),
]), ([providers, data]) => {
setProvider(providers.find((p) => p.id === providerId));
reset(data || { providerId });
}, []);
const providerName = useWatch({ control, defaultValue: "", name: "name" });
const onSubmit = async (component) => {
if (component.config)
Object.entries(component.config).forEach(([key, value]) => (component.config[key] = Array.isArray(value) ? value : [value]));
try {
const updatedComponent = {
...component,
subType: subTab,
parentId: realmRepresentation === null || realmRepresentation === void 0 ? void 0 : realmRepresentation.id,
providerType: "org.keycloak.services.clientregistration.policy.ClientRegistrationPolicy",
providerId,
};
if (id) {
await adminClient.components.update({ id }, updatedComponent);
}
else {
const { id } = await adminClient.components.create(updatedComponent);
navigate(toRegistrationProvider({ id, realm, subTab, providerId }));
}
addAlert(t(`provider${id ? "Updated" : "Create"}Success`));
}
catch (error) {
addError(`provider${id ? "Updated" : "Create"}Error`, error);
}
};
const [toggleDeleteDialog, DeleteConfirm] = useConfirmDialog({
titleKey: "clientRegisterPolicyDeleteConfirmTitle",
messageKey: t("clientRegisterPolicyDeleteConfirm", {
name: providerName,
}),
continueButtonLabel: "delete",
continueButtonVariant: ButtonVariant.danger,
onConfirm: async () => {
try {
await adminClient.components.del({
realm,
id: id,
});
addAlert(t("clientRegisterPolicyDeleteSuccess"));
navigate(toClientRegistration({ realm, subTab }));
}
catch (error) {
addError("clientRegisterPolicyDeleteError", error);
}
},
});
if (!provider) {
return _jsx(KeycloakSpinner, {});
}
return (_jsxs(_Fragment, { children: [_jsx(ViewHeader, { titleKey: id ? providerName : "createPolicy", subKey: id, dropdownItems: id
? [
_jsx(DropdownItem, { "data-testid": "delete", onClick: toggleDeleteDialog, children: t("delete") }, "delete"),
]
: undefined }), _jsx(DeleteConfirm, {}), _jsx(PageSection, { variant: "light", children: _jsx(FormProvider, { ...form, children: _jsxs(FormAccess, { role: "manage-clients", isHorizontal: true, onSubmit: handleSubmit(onSubmit), children: [_jsx(TextControl, { name: "providerId", label: t("provider"), readOnly: true }), _jsx(TextControl, { name: "name", label: t("name"), labelIcon: t("clientPolicyNameHelp"), rules: { required: t("required") } }), _jsx(DynamicComponents, { properties: provider.properties }), _jsxs(ActionGroup, { children: [_jsx(Button, { "data-testid": "save", type: "submit", children: t("save") }), _jsx(Button, { variant: "link", component: (props) => (_jsx(Link, { ...props, to: toClientRegistration({ realm, subTab }) })), children: t("cancel") })] })] }) }) })] }));
}
//# sourceMappingURL=DetailProvider.js.map