"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TreeContent = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const utils_1 = require("../../utils/index.js");
const DragContext_1 = require("./DragContext.js");
const TreeItem_1 = require("./TreeItem.js");
const cn_1 = require("../../utils/cn.js");
const b = (0, cn_1.editorCn)('tree-content');
const TreeContent = ({ blockTree, selectedBlockPath, reorderBlock, onCopy, onDelete, onSelect, }) => {
    const { draggedItem, setDraggedItem, hidePreview, showPreview } = React.useContext(DragContext_1.DragContext);
    const handleFirstPositionDrop = React.useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        try {
            const data = e.dataTransfer.getData('application/json');
            if (data) {
                const dragItem = JSON.parse(data);
                // Reorder to the first position by using [0] as destination
                // and 'prepend' as position
                reorderBlock(dragItem.path, [0], 'prepend');
                // Reset drag context
                setDraggedItem(null);
                hidePreview();
            }
        }
        catch (error) {
            // eslint-disable-next-line no-console
            console.error('Error parsing drag data:', error);
        }
    }, [reorderBlock, hidePreview, setDraggedItem]);
    const handleDragOver = React.useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign, no-param-reassign
        e.dataTransfer.dropEffect = 'move';
        // Show preview element at this position
        const rect = e.currentTarget.getBoundingClientRect();
        if (draggedItem) {
            showPreview(rect, draggedItem);
        }
    }, [draggedItem, showPreview]);
    const renderTree = (items, parentPathArray) => {
        return items.map(({ type, treeTitle, children }, index) => {
            let blockPathArray;
            if (parentPathArray) {
                blockPathArray = [...parentPathArray, index];
            }
            else {
                blockPathArray = [index];
            }
            const blockPath = (0, utils_1.generateChildrenPathFromArray)(blockPathArray);
            return ((0, jsx_runtime_1.jsx)(TreeItem_1.Item, { type: type, treeTitle: treeTitle, onCopy: onCopy, onDelete: onDelete, onSelect: onSelect, onReorder: reorderBlock, path: blockPathArray, selected: selectedBlockPath === blockPath, children: children && ((0, jsx_runtime_1.jsx)("div", { className: b('children'), children: renderTree(children, blockPathArray) })) }, index));
        });
    };
    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [(0, jsx_runtime_1.jsx)("div", { className: b('drop-zone'), onDragOver: handleDragOver, onDragLeave: hidePreview, onDrop: handleFirstPositionDrop }), (0, jsx_runtime_1.jsx)("div", { children: renderTree(blockTree) })] }));
};
exports.TreeContent = TreeContent;
//# sourceMappingURL=TreeContent.js.map
