"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.FormViewNetworkWideFields = exports.ProtocolTypeSelect = void 0;
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const react_core_1 = require("@patternfly/react-core");
const formik_1 = require("formik");
const common_1 = require("../../../../../../common");
const protocolVersion_1 = require("../../data/protocolVersion");
const emptyData_1 = require("../../data/emptyData");
const dataTypes_1 = require("../../data/dataTypes");
const machineNetwork_1 = require("../../data/machineNetwork");
const useFieldErrorMsg_1 = tslib_1.__importDefault(require("../../../../../../common/hooks/useFieldErrorMsg"));
const formViewNetworkWideValidationSchema_1 = require("./formViewNetworkWideValidationSchema");
const OcmFormFields_1 = require("../../../../ui/OcmFormFields");
require("../staticIp.css");
const exclamation_circle_icon_1 = tslib_1.__importDefault(require("@patternfly/react-icons/dist/js/icons/exclamation-circle-icon"));
const hostsConfiguredAlert = (react_1.default.createElement(react_core_1.Alert, { variant: react_core_1.AlertVariant.warning, isInline: true, "data-testid": "hosts-configured-alert", title: "If you edit the values and click Next, the earlier configurations will be replaced with the new values for all of the hosts." }));
const MachineNetwork = ({ fieldName, protocolVersion, }) => {
    const [{ value }] = (0, formik_1.useField)(fieldName);
    const ipFieldName = `${fieldName}.ip`;
    const prefixLengthFieldName = `${fieldName}.prefixLength`;
    const ipErrorMessage = (0, useFieldErrorMsg_1.default)({ name: ipFieldName });
    const prefixLengthErrorMessage = (0, useFieldErrorMsg_1.default)({ name: prefixLengthFieldName });
    const errorMessage = ipErrorMessage || prefixLengthErrorMessage;
    const machineNetworkHelptext = react_1.default.useMemo(() => {
        if (errorMessage) {
            return '';
        }
        const cidr = (0, machineNetwork_1.getMachineNetworkCidr)(value);
        return (0, common_1.getHumanizedSubnetRange)((0, protocolVersion_1.getAddressObject)(cidr, protocolVersion));
    }, [value, protocolVersion, errorMessage]);
    const fieldId = (0, common_1.getFieldId)(`${fieldName}`, 'input');
    return (react_1.default.createElement(react_core_1.FormGroup, { labelHelp: react_1.default.createElement(common_1.PopoverIcon, { noVerticalAlign: true, bodyContent: "The range of IP addresses of the hosts." }), label: "Subnet", fieldId: fieldId, isRequired: true, className: "subnet" },
        react_1.default.createElement(react_core_1.Flex, null,
            react_1.default.createElement(react_core_1.FlexItem, { spacer: { default: 'spacerSm' } },
                react_1.default.createElement(OcmFormFields_1.OcmInputField, { name: `${fieldName}.ip`, isRequired: true, "data-testid": `${protocolVersion}-machine-network-ip`, showErrorMessage: false })),
            react_1.default.createElement(react_core_1.FlexItem, { spacer: { default: 'spacerSm' } }, '/'),
            react_1.default.createElement(react_core_1.FlexItem, null,
                react_1.default.createElement(OcmFormFields_1.OcmInputField, { name: `${fieldName}.prefixLength`, isRequired: true, "data-testid": `${protocolVersion}-machine-network-prefix-length`, type: react_core_1.TextInputTypes.number, showErrorMessage: false, min: formViewNetworkWideValidationSchema_1.MIN_PREFIX_LENGTH, max: protocolVersion === dataTypes_1.ProtocolVersion.ipv4
                        ? formViewNetworkWideValidationSchema_1.MAX_PREFIX_LENGTH.ipv4
                        : formViewNetworkWideValidationSchema_1.MAX_PREFIX_LENGTH.ipv6 }))),
        (errorMessage || machineNetworkHelptext) && (react_1.default.createElement(react_core_1.FormHelperText, null,
            react_1.default.createElement(react_core_1.HelperText, null,
                react_1.default.createElement(react_core_1.HelperTextItem, { icon: errorMessage ? react_1.default.createElement(exclamation_circle_icon_1.default, null) : null, variant: errorMessage ? 'error' : 'default', id: errorMessage ? `${fieldId}-helper-error` : `${fieldId}-helper`, "data-testid": `input-machine-network-${fieldId}-helper-text` }, errorMessage ? errorMessage : machineNetworkHelptext))))));
};
const IpConfigFields = ({ protocolVersion, fieldName }) => {
    return (react_1.default.createElement(react_core_1.Grid, { hasGutter: true },
        react_1.default.createElement(MachineNetwork, { fieldName: `${fieldName}.machineNetwork`, protocolVersion: protocolVersion }),
        react_1.default.createElement(OcmFormFields_1.OcmInputField, { isRequired: true, label: "Default gateway", labelIcon: react_1.default.createElement(common_1.PopoverIcon, { noVerticalAlign: true, bodyContent: "An IP address to where any IP packet should be forwarded in case there is no other routing rule configured for a destination IP." }), name: `${fieldName}.gateway`, "data-testid": `${protocolVersion}-gateway` })));
};
const ipv6ValuesEmpty = (values) => values.ipConfigs.ipv6.gateway === '' &&
    values.ipConfigs.ipv6.machineNetwork.ip === '' &&
    values.ipConfigs.ipv6.machineNetwork.prefixLength === '';
const ProtocolTypeSelect = () => {
    const selectFieldName = 'protocolType';
    const [{ value: protocolType }, , { setValue: setProtocolType }] = (0, formik_1.useField)(selectFieldName);
    const [, , { setValue: setIpv6 }] = (0, formik_1.useField)(`ipConfigs.ipv6`);
    const [openConfirmModal, setConfirmModal] = react_1.default.useState(false);
    const { values } = (0, formik_1.useFormikContext)();
    const onChange = (e) => {
        const newProtocolType = e.target.value;
        if (newProtocolType === protocolType) {
            return;
        }
        if (newProtocolType === 'ipv4' && !ipv6ValuesEmpty(values)) {
            setConfirmModal(true);
        }
        else {
            //no need to empty ipv4, when switching back dual stack ipv4 remains as is
            setIpv6((0, emptyData_1.getEmptyIpConfig)());
            setProtocolType(newProtocolType);
        }
    };
    const isIpv4Selected = protocolType === 'ipv4';
    return (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(react_core_1.FormGroup, { fieldId: (0, common_1.getFieldId)(selectFieldName, 'radio'), isInline: true, label: "Networking stack type", isRequired: true, onChange: onChange },
            react_1.default.createElement(OcmFormFields_1.OcmRadioField, { label: react_1.default.createElement(react_1.default.Fragment, null,
                    (0, protocolVersion_1.getProtocolVersionLabel)(dataTypes_1.ProtocolVersion.ipv4),
                    ' ',
                    react_1.default.createElement(common_1.PopoverIcon, { noVerticalAlign: true, bodyContent: "Select this when your hosts are using only IPv4." })), name: selectFieldName, "data-testid": "select-ipv4", id: "select-ipv4", value: "ipv4", isChecked: isIpv4Selected, callFormikOnChange: false }),
            react_1.default.createElement(OcmFormFields_1.OcmRadioField, { label: react_1.default.createElement(react_1.default.Fragment, null,
                    'Dual-stack',
                    ' ',
                    react_1.default.createElement(common_1.PopoverIcon, { noVerticalAlign: true, bodyContent: "Select dual-stack when your hosts are using IPV4 together with IPV6." })), name: selectFieldName, "data-testid": "select-dual-stack", id: "select-dual-stack", value: "dualStack", isChecked: !isIpv4Selected, callFormikOnChange: false })),
        openConfirmModal && (react_1.default.createElement(common_1.ConfirmationModal, { title: 'Change networking stack type?', titleIconVariant: 'warning', confirmationButtonText: 'Change', confirmationButtonVariant: react_core_1.ButtonVariant.primary, content: react_1.default.createElement(react_1.default.Fragment, null,
                react_1.default.createElement("p", null, "All data and configuration done for 'Dual Stack' will be lost.")), onClose: () => {
                setConfirmModal(false);
                setProtocolType('dualStack');
            }, onConfirm: () => {
                setConfirmModal(false);
                setProtocolType('ipv4');
            } }))));
};
exports.ProtocolTypeSelect = ProtocolTypeSelect;
const FormViewNetworkWideFields = ({ hosts }) => {
    const { values, setFieldValue } = (0, formik_1.useFormikContext)();
    return (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(react_core_1.Content, null,
            react_1.default.createElement(react_core_1.Content, { component: react_core_1.ContentVariants.h3 }, "Network-wide configurations"),
            react_1.default.createElement(react_core_1.Content, { component: react_core_1.ContentVariants.small }, "The following configurations are applicable to all the hosts.")),
        hosts.length > 0 && hostsConfiguredAlert,
        react_1.default.createElement(exports.ProtocolTypeSelect, null),
        react_1.default.createElement(OcmFormFields_1.OcmCheckboxField, { label: react_1.default.createElement(react_1.default.Fragment, null,
                'Use VLAN ',
                react_1.default.createElement(common_1.PopoverIcon, { noVerticalAlign: true, bodyContent: "If the hosts are in a sub network, enter the VLAN ID." })), name: "useVlan", "data-testid": "use-vlan", onChange: () => setFieldValue('vlanId', '') }),
        values.useVlan && (react_1.default.createElement("div", { className: "vlan-id" },
            react_1.default.createElement(OcmFormFields_1.OcmInputField, { label: "VLAN ID", name: "vlanId", isRequired: true, "data-testid": "vlan-id", min: formViewNetworkWideValidationSchema_1.MIN_VLAN_ID, max: formViewNetworkWideValidationSchema_1.MAX_VLAN_ID }))),
        react_1.default.createElement(OcmFormFields_1.OcmInputField, { isRequired: true, label: "DNS", name: `dns`, "data-testid": `dns`, helperText: 'List of your DNS server addresses, separated by commas.' }),
        (0, protocolVersion_1.getShownProtocolVersions)(values.protocolType).map((protocolVersion) => (react_1.default.createElement(react_core_1.FormGroup, { key: protocolVersion, label: (0, protocolVersion_1.getProtocolVersionLabel)(protocolVersion), fieldId: (0, common_1.getFieldId)(`ip-configs-${protocolVersion}`, 'input') },
            react_1.default.createElement(IpConfigFields, { fieldName: `ipConfigs.${protocolVersion}`, protocolVersion: protocolVersion }))))));
};
exports.FormViewNetworkWideFields = FormViewNetworkWideFields;
//# sourceMappingURL=FormViewNetworkWideFields.js.map