@keycloakify/keycloak-admin-ui/authentication/components/EditFlow.js

Repackaged Keycloak Admin UI

import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { Button, ButtonVariant, Form, Modal, ModalVariant, Tooltip, } from "@patternfly/react-core";
import { PencilAltIcon } from "@patternfly/react-icons";
import { useEffect } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { TextAreaControl, TextControl } from "../../ui-shared";
import useToggle from "../../utils/useToggle";
export const EditFlow = ({ execution, onRowChange }) => {
    const { t } = useTranslation();
    const form = useForm({
        mode: "onChange",
        defaultValues: execution,
    });
    const [show, toggle] = useToggle();
    useEffect(() => form.reset(execution), [execution]);
    const onSubmit = (formValues) => {
        onRowChange({ ...execution, ...formValues });
        toggle();
    };
    return (_jsxs(_Fragment, { children: [_jsx(Tooltip, { content: t("edit"), children: _jsx(Button, { variant: "plain", "data-testid": `${execution.id}-edit`, "aria-label": t("edit"), onClick: toggle, children: _jsx(PencilAltIcon, {}) }) }), show && (_jsx(Modal, { title: t("editFlow"), onClose: toggle, variant: ModalVariant.small, actions: [
                    _jsx(Button, { "data-testid": "confirm", type: "submit", form: "edit-flow-form", isDisabled: !form.formState.isValid, children: t("edit") }, "confirm"),
                    _jsx(Button, { "data-testid": "cancel", variant: ButtonVariant.link, onClick: toggle, children: t("cancel") }, "cancel"),
                ], isOpen: true, children: _jsx(Form, { id: "edit-flow-form", onSubmit: form.handleSubmit(onSubmit), isHorizontal: true, children: _jsxs(FormProvider, { ...form, children: [_jsx(TextControl, { name: "displayName", label: t("name"), labelIcon: t("flowNameHelp"), rules: { required: { value: true, message: t("required") } } }), _jsx(TextAreaControl, { name: "description", label: t("description"), labelIcon: t("flowDescriptionHelp"), rules: {
                                    maxLength: {
                                        value: 255,
                                        message: t("maxLength", { length: 255 }),
                                    },
                                } })] }) }) }))] }));
};
//# sourceMappingURL=EditFlow.js.map