Display chat messages in modal

<%= turbo_stream_from @conversation %>

import {Controller} from "@hotwired/stimulus";
import {HSOverlay} from "preline/dist/preline";

export default class extends Controller {
    static targets = ["content"];

    async fetchData(event) {
        event.preventDefault(); // Prevent default behavior

        // Get the URL to fetch data from
        const url = event.currentTarget.href || event.currentTarget.dataset.url;

        // Get the offcanvas ID from the button's data attribute
        const offcanvasId = event.currentTarget.dataset.offcanvas;

        try {
            const response = await fetch(url);
            const data = await response.text(); // Assuming the response is HTML

            // Find the offcanvas content container
            const contentTarget = document.querySelector(`#${offcanvasId} [data-overlay-target="content"]`);

            // Update the offcanvas content
            if (contentTarget) {
                contentTarget.innerHTML = data;
            }

            // Reinitialize Preline components within the new content
            window.HSStaticMethods.autoInit();

            // Initialize and open the offcanvas
            const offcanvasElement = document.getElementById(offcanvasId);
            if (offcanvasElement) {
                const offcanvasInstance = new HSOverlay(offcanvasElement);
                offcanvasInstance.open();
            }
        } catch (error) {
            console.error("Error fetching data:", error);
        }
    }
}