var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
// ============================================================================
// Code Modal - Chatbot Modal with Code Editor
// ============================================================================
import React from 'react';
import path from 'path-browserify';
// Import PatternFly components
import { CodeEditor } from '@patternfly/react-code-editor';
import { Button, ModalBody, ModalFooter, ModalHeader, Stack, StackItem } from '@patternfly/react-core';
import FileDetails, { extensionToLanguage } from '../FileDetails';
import { ChatbotDisplayMode } from '../Chatbot';
import ChatbotModal from '../ChatbotModal/ChatbotModal';
export const CodeModal = (_a) => {
    var { fileName, code, codeEditorControlClassName: codeEditorClassName, handleModalToggle, isCopyEnabled, isLineNumbersVisible, isModalOpen, isReadOnly, onPrimaryAction, onSecondaryAction, primaryActionBtn, secondaryActionBtn, title, displayMode = ChatbotDisplayMode.default } = _a, props = __rest(_a, ["fileName", "code", "codeEditorControlClassName", "handleModalToggle", "isCopyEnabled", "isLineNumbersVisible", "isModalOpen", "isReadOnly", "onPrimaryAction", "onSecondaryAction", "primaryActionBtn", "secondaryActionBtn", "title", "displayMode"]);
    const [newCode, setNewCode] = React.useState(code);
    const handlePrimaryAction = (_event) => {
        handleModalToggle(_event);
        if (!isReadOnly) {
            onPrimaryAction(_event, newCode);
        }
        else {
            onPrimaryAction(_event);
        }
    };
    const handleSecondaryAction = (_event) => {
        handleModalToggle(_event);
        onSecondaryAction(_event);
    };
    const onEditorDidMount = (editor, monaco) => {
        editor.layout();
        editor.focus();
        monaco.editor.getModels()[0].updateOptions({ tabSize: 5 });
    };
    const onCodeChange = (value) => {
        if (!isReadOnly) {
            setNewCode(value);
        }
    };
    const modal = (React.createElement(ChatbotModal, { isOpen: isModalOpen, onClose: handleModalToggle, ouiaId: "CodeModal", "aria-labelledby": "code-modal-title", "aria-describedby": "code-modal", className: `pf-chatbot__code-modal pf-chatbot__code-modal--${displayMode}`, displayMode: displayMode },
        React.createElement(ModalHeader, { title: title, labelId: "code-modal-title" }),
        React.createElement(ModalBody, { id: "code-modal-body" },
            React.createElement(Stack, { className: "pf-chatbot__code-modal-body" },
                React.createElement(StackItem, { className: "pf-chatbot__code-modal-file-details" },
                    React.createElement(FileDetails, { fileName: fileName })),
                React.createElement(StackItem, { className: "pf-chatbot__code-modal-body" },
                    React.createElement(CodeEditor, Object.assign({ isDarkTheme: true, isLineNumbersVisible: isLineNumbersVisible, isLanguageLabelVisible: true, isCopyEnabled: isCopyEnabled, isReadOnly: isReadOnly, code: newCode, language: extensionToLanguage[path.extname(fileName).slice(1)], onEditorDidMount: onEditorDidMount, onCodeChange: onCodeChange, className: codeEditorClassName, isFullHeight: true, options: {
                            glyphMargin: false,
                            folding: false
                        } }, props))))),
        React.createElement(ModalFooter, null,
            React.createElement(Button, { isBlock: true, key: "code-modal-primary", variant: "primary", onClick: handlePrimaryAction, form: "code-modal-form" }, primaryActionBtn),
            React.createElement(Button, { isBlock: true, key: "code-modal-secondary", variant: "link", onClick: handleSecondaryAction }, secondaryActionBtn))));
    return modal;
};
export default CodeModal;
