@keycloakify/keycloak-admin-ui/user-federation/custom/CustomProviderSettings.js

Repackaged Keycloak Admin UI

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { TextControl, useAlerts, useFetch } from "../../ui-shared";
import { ActionGroup, AlertVariant, Button, PageSection, } from "@patternfly/react-core";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
import { useAdminClient } from "../../admin-client";
import { DynamicComponents } from "../../components/dynamic/DynamicComponents";
import { FormAccess } from "../../components/form/FormAccess";
import { useRealm } from "../../context/realm-context/RealmContext";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
import { convertFormValuesToObject, convertToFormValues } from "../../util";
import { useParams } from "../../utils/useParams";
import { toUserFederation } from "../../user-federation/routes/UserFederation";
import { ExtendedHeader } from "../../user-federation/shared/ExtendedHeader";
import { SettingsCache } from "../../user-federation/shared/SettingsCache";
import { SyncSettings } from "../../user-federation/custom/SyncSettings";
import "./custom-provider-settings.css";
export default function CustomProviderSettings() {
    var _a;
    const { adminClient } = useAdminClient();
    const { t } = useTranslation();
    const { id, providerId } = useParams();
    const navigate = useNavigate();
    const form = useForm({
        mode: "onChange",
    });
    const { reset, setValue, handleSubmit, formState: { isDirty }, } = form;
    const { addAlert, addError } = useAlerts();
    const { realm: realmName, realmRepresentation: realm } = useRealm();
    const provider = (((_a = useServerInfo().componentTypes) === null || _a === void 0 ? void 0 : _a["org.keycloak.storage.UserStorageProvider"]) || []).find((p) => p.id === providerId);
    useFetch(async () => {
        if (id) {
            return await adminClient.components.findOne({ id });
        }
        return undefined;
    }, (fetchedComponent) => {
        if (fetchedComponent) {
            convertToFormValues(fetchedComponent, setValue);
        }
        else if (id) {
            throw new Error(t("notFound"));
        }
    }, []);
    const save = async (component) => {
        const saveComponent = convertFormValuesToObject({
            ...component,
            config: Object.fromEntries(Object.entries(component.config || {}).map(([key, value]) => [
                key,
                Array.isArray(value) ? value : [value],
            ])),
            providerId,
            providerType: "org.keycloak.storage.UserStorageProvider",
            parentId: realm === null || realm === void 0 ? void 0 : realm.id,
        });
        try {
            if (!id) {
                await adminClient.components.create(saveComponent);
                navigate(toUserFederation({ realm: realmName }));
            }
            else {
                await adminClient.components.update({ id }, saveComponent);
            }
            reset({ ...component });
            addAlert(t(!id ? "createUserProviderSuccess" : "userProviderSaveSuccess"), AlertVariant.success);
        }
        catch (error) {
            addError(!id ? "createUserProviderError" : "userProviderSaveError", error);
        }
    };
    return (_jsxs(FormProvider, { ...form, children: [_jsx(ExtendedHeader, { provider: providerId, save: () => handleSubmit(save)() }), _jsx(PageSection, { variant: "light", children: _jsxs(FormAccess, { role: "manage-realm", isHorizontal: true, className: "keycloak__user-federation__custom-form", onSubmit: handleSubmit(save), children: [_jsx(TextControl, { name: "name", label: t("uiDisplayName"), labelIcon: t("uiDisplayNameHelp"), rules: {
                                required: t("validateName"),
                            } }), _jsx(DynamicComponents, { properties: (provider === null || provider === void 0 ? void 0 : provider.properties) || [] }), (provider === null || provider === void 0 ? void 0 : provider.metadata.synchronizable) && _jsx(SyncSettings, {}), _jsx(SettingsCache, { form: form, unWrap: true }), _jsxs(ActionGroup, { children: [_jsx(Button, { isDisabled: !isDirty, variant: "primary", type: "submit", "data-testid": "custom-save", children: t("save") }), _jsx(Button, { variant: "link", component: (props) => (_jsx(Link, { ...props, to: toUserFederation({ realm: realmName }) })), "data-testid": "custom-cancel", children: t("cancel") })] })] }) })] }));
}
//# sourceMappingURL=CustomProviderSettings.js.map