"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const react_code_editor_1 = require("@patternfly/react-code-editor");
const react_core_1 = require("@patternfly/react-core");
const formik_1 = require("formik");
const OcmFormFields_1 = require("../../../ui/OcmFormFields");
const FolderDropdown_1 = require("./FolderDropdown");
const common_1 = require("../../../../../common");
const configurations_1 = require("../../../../../common/configurations");
const utils_1 = require("../../../../../common/utils");
const getDownloadFileName = (manifestIdx, value) => {
    return value.folder && value.filename
        ? `${value.folder}/${value.filename.replace('.yaml', '')}`
        : `custom_manifest_${manifestIdx}`;
};
const ExpandedManifest = ({ fieldName, manifestIdx }) => {
    const [{ value }] = (0, formik_1.useField)({
        name: fieldName,
    });
    return (react_1.default.createElement(react_core_1.ExpandableSection, { isDetached: true, key: manifestIdx, isExpanded: true, "data-testid": `expanded-manifest-${manifestIdx}` },
        react_1.default.createElement(react_core_1.Grid, { hasGutter: true, span: 12 },
            react_1.default.createElement(react_core_1.GridItem, { span: 6 },
                react_1.default.createElement(FolderDropdown_1.FolderDropdown, { name: `${fieldName}.folder`, "data-testid": `folder-${manifestIdx}` })),
            react_1.default.createElement(react_core_1.GridItem, { span: 6 },
                react_1.default.createElement(OcmFormFields_1.OcmInputField, { name: `${fieldName}.filename`, isRequired: true, "data-testid": `filename-${manifestIdx}`, helperText: `Use yaml, yml or JSON file types. File size must not exceed ${(0, utils_1.fileSize)(configurations_1.MAX_FILE_SIZE_BYTES, 0, 'si')}.`, label: react_1.default.createElement(react_1.default.Fragment, null,
                        react_1.default.createElement("span", null, "File name"),
                        ' ',
                        react_1.default.createElement(common_1.PopoverIcon, { bodyContent: 'File name determines order of executing manifests during the installation. For example "manifest1.yaml" will be applied before "manifest2.yaml"' })) })),
            react_1.default.createElement(react_core_1.GridItem, { span: 12 },
                react_1.default.createElement(OcmFormFields_1.OcmCodeField, { language: react_code_editor_1.Language.yaml, name: `${fieldName}.manifestYaml`, dataTestid: `yamlContent-${manifestIdx}`, label: "Content", isRequired: true, downloadFileName: getDownloadFileName(manifestIdx, value), isReadOnly: true, showCustomControls: true })))));
};
exports.default = ExpandedManifest;
//# sourceMappingURL=ExpandedManifest.js.map