console.log('App.js is loaded');

document.addEventListener('livewire:init', () => {
    Livewire.on('insert-editor-content', (data) => {
        console.log('Received insert-editor-content data:', data);
        // Handle if data is an array
        const payload = Array.isArray(data) ? data[0] : data;
        const statePath = payload.statePath;
        const html = payload.html;
        console.log('Extracted statePath:', statePath, 'html:', html);
        // 1. Find the editor by its statePath
        const container = document.querySelector(`[wire\\:model="${statePath}"]`) || document.querySelector(`[statepath="${statePath}"]`);
        console.log('Container found:', container);
        const editorElement = container ? container.querySelector('.tiptap') : null;
        console.log('Editor element found:', editorElement);
        
        if (editorElement && editorElement.editor) {
            console.log('Inserting content:', html);
            // 2. Insert the HTML (the <img> tag) into the editor
            setTimeout(() => {
                editorElement.editor.chain().focus().insertContent(html).run();
            }, 500);
        } else {
            console.log('Editor not found or not initialized');
            // Fallback: try to find any .tiptap on the page
            const anyTiptap = document.querySelector('.tiptap');
            console.log('Any tiptap found:', anyTiptap);
            if (anyTiptap && anyTiptap.editor) {
                console.log('Inserting to any tiptap');
                setTimeout(() => {
                    anyTiptap.editor.chain().focus().insertContent(html).run();
                }, 500);
            }
        }
    });
});

console.log('Testing if app.js is still running');