"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.CustomManifestsArray = void 0;
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const react_redux_1 = require("react-redux");
const react_core_1 = require("@patternfly/react-core");
const plus_circle_icon_1 = require("@patternfly/react-icons/dist/js/icons/plus-circle-icon");
const formik_1 = require("formik");
const cloneDeep_js_1 = tslib_1.__importDefault(require("lodash-es/cloneDeep.js"));
const common_1 = require("../../../../../common");
const ConfirmationModal_1 = tslib_1.__importDefault(require("../../../../../common/components/ui/ConfirmationModal"));
const apis_1 = require("../../../../services/apis");
const api_1 = require("../../../../../common/api");
const CustomManifest_1 = require("./CustomManifest");
const utils_1 = require("./utils");
const selectors_1 = require("../../../../store/slices/current-cluster/selectors");
const ClusterWizardContext_1 = require("../../../clusterWizard/ClusterWizardContext");
const fieldName = 'manifests';
const getExpandedManifestsInitialValue = (numManifests) => {
    const ret = {};
    for (let i = 0; i < numManifests; ++i) {
        ret[i] = false;
    }
    return ret;
};
const getExpandedManifestsDefaultValue = (numManifests) => {
    const ret = getExpandedManifestsInitialValue(numManifests);
    if (numManifests === 1) {
        ret[0] = true;
    }
    return ret;
};
const CustomManifestsArray = (_a) => {
    var { push, remove, clusterId } = _a, props = tslib_1.__rest(_a, ["push", "remove", "clusterId"]);
    const { updateUISettings } = (0, ClusterWizardContext_1.useClusterWizardContext)();
    const [field, { error }] = (0, formik_1.useField)({
        name: fieldName,
    });
    const { isViewerMode } = (0, react_redux_1.useSelector)(selectors_1.selectCurrentClusterPermissionsState);
    const [expandedManifests, setExpandedManifests] = react_1.default.useState(getExpandedManifestsDefaultValue(field.value.length));
    const [manifestIdxToRemove, setManifestIdxToRemove] = react_1.default.useState(null);
    const { addAlert } = (0, common_1.useAlerts)();
    const onAddManifest = react_1.default.useCallback(() => {
        const newExpandedManifests = getExpandedManifestsInitialValue(field.value.length + 1);
        newExpandedManifests[field.value.length] = true;
        setExpandedManifests(newExpandedManifests);
        push((0, utils_1.getEmptyManifest)());
    }, [field.value.length, push]);
    const removeManifest = react_1.default.useCallback((clusterId, manifestIdx) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
        const manifestToRemove = field.value[manifestIdx];
        if (manifestToRemove['folder'] !== '' && manifestToRemove['filename'] !== '') {
            try {
                yield apis_1.ClustersAPI.removeCustomManifest(clusterId, manifestToRemove['folder'], manifestToRemove['filename']);
                yield updateUISettings({ customManifestsUpdated: true });
            }
            catch (e) {
                (0, api_1.handleApiError)(e, () => addAlert({
                    title: 'Manifest could not be deleted',
                    message: (0, api_1.getApiErrorMessage)(e),
                }));
            }
        }
    }), [addAlert, field.value, updateUISettings]);
    const onConfirm = react_1.default.useCallback(() => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
        if (manifestIdxToRemove !== null) {
            yield removeManifest(clusterId, manifestIdxToRemove);
            remove(manifestIdxToRemove);
            setManifestIdxToRemove(null);
        }
    }), [removeManifest, clusterId, remove, manifestIdxToRemove, setManifestIdxToRemove]);
    if (field.value === undefined) {
        return react_1.default.createElement(common_1.LoadingState, null);
    }
    return (react_1.default.createElement(react_1.default.Fragment, null,
        field.value.map((_data, manifestIdx) => {
            const onToggleExpand = (isExpanded) => {
                const newExpandedManifests = (0, cloneDeep_js_1.default)(expandedManifests);
                newExpandedManifests[manifestIdx] = isExpanded;
                setExpandedManifests(newExpandedManifests);
            };
            return (react_1.default.createElement(react_1.default.Fragment, { key: manifestIdx },
                react_1.default.createElement(CustomManifest_1.CustomManifest, Object.assign({ manifestIdx: manifestIdx, onToggleExpand: onToggleExpand, isExpanded: expandedManifests[manifestIdx], isDisabled: isViewerMode, onRemove: () => setManifestIdxToRemove(manifestIdx), fieldName: fieldName, enableRemoveManifest: field.value.length > 1 }, props)),
                react_1.default.createElement(react_core_1.Divider, null)));
        }),
        react_1.default.createElement(react_core_1.Flex, null,
            react_1.default.createElement(react_core_1.FlexItem, null,
                react_1.default.createElement(react_core_1.Button, { icon: react_1.default.createElement(plus_circle_icon_1.PlusCircleIcon, null), variant: "link", isInline: true, onClick: onAddManifest, "data-testid": "add-manifest", isDisabled: !!error }, "Add another manifest"))),
        manifestIdxToRemove !== null && (react_1.default.createElement(ConfirmationModal_1.default, { title: `Delete ${(0, utils_1.getManifestName)(manifestIdxToRemove)}?`, titleIconVariant: "warning", confirmationButtonText: "Delete", confirmationButtonVariant: react_core_1.ButtonVariant.danger, content: react_1.default.createElement(react_1.default.Fragment, null,
                react_1.default.createElement("p", null, `All the data entered for ${(0, utils_1.getManifestName)(manifestIdxToRemove)} will be lost`)), onClose: () => setManifestIdxToRemove(null), onConfirm: () => void onConfirm() }))));
};
exports.CustomManifestsArray = CustomManifestsArray;
//# sourceMappingURL=CustomManifestsArray.js.map