import { observeOnce } from "./_global--observer.js";
import { pluginUrl } from "./_global-plugin-and-uploads-url.js";
import { neo__ } from "./_global--translation.js";
import { Dialog } from "./neo-draw--editor-react-dialog.js";

const img = new Image(); img.src = pluginUrl() + "/img/neo-draw--editor-dialog-save-icon.svg";
img.style.display = "none"; (await observeOnce("body")).appendChild(img);

export const SaveDialog = ({ onAnswer }) => {
    React.useEffect(() => {
        document.activeElement?.blur();
        const saveOnEnter = (event) => {
            if (event.key === "Enter")  { event.preventDefault(); event.stopImmediatePropagation(); onAnswer("save"); }
            if (event.key === "Escape") { event.preventDefault(); event.stopImmediatePropagation(); onAnswer("cancel"); }
        };
        window.addEventListener("keydown", saveOnEnter, true);
        return () => window.removeEventListener("keydown", saveOnEnter, true);
    }, [onAnswer]);

    return React.createElement(
        Dialog,
        { onClose: () => onAnswer("cancel") },
        React.createElement(
            "img",
            {
                className: "neo-draw--dialog-icon",
                src: pluginUrl() + "/img/neo-draw--editor-dialog-save-icon.svg",
                alt: "",
            }
        ),
        React.createElement(
            "div",
            null,
            neo__("Save changes?", "Änderungen speichern?"),
        ),
        React.createElement(
            "div",
            {
                className: "excalidraw neo-draw--dialog-button-container"
            },
            React.createElement(
                "button",
                {
                    className: "excalidraw-button neo-draw--dialog-button",
                    onClick: () => onAnswer("discard"),
                    tabIndex: 0
                },
                neo__("Discard", "Verwerfen")
            ),
            React.createElement(
                "button",
                {
                    className: "excalidraw-button neo-draw--dialog-button neo-draw--dialog-primary-button",
                    onClick: () => onAnswer("save"),
                    tabIndex: 0
                },
                neo__("Save", "Speichern")
            ),
        )
    );
};
