import { getComponentByControlType } from "../../utils/utils";
export async function processChatData(chatData, data, el, hideSpinnerCallback, updateMessagesCallback, customJS, customStyle, isExpanded, inputType = "bot") {
    // Step 1: Hide the spinner
    var _a, _b, _c, _d, _e, _f, _g;
    await hideSpinnerCallback(chatData);
    if ((_b = (_a = data.controlData) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.source) {
        data.controlData.data.source.customCss = customStyle || "";
        data.controlData.data.source.customJs = customJS || "";
    }
    data.isExpanded = isExpanded;
    // Step 2: Get the control element based on control type
    const controlElement = getComponentByControlType(data, inputType);
    const tmpControlType = (_f = (_e = (_d = (_c = data.controlData) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.source) === null || _e === void 0 ? void 0 : _e.carousel) === null || _f === void 0 ? void 0 : _f.type;
    // Step 3: Append the control element if both it and the target container exist
    let targetContainer = (_g = el.shadowRoot) === null || _g === void 0 ? void 0 : _g.querySelector(`#${chatData.id}`);
    if (inputType === "kb") {
        targetContainer = el.shadowRoot.querySelector(`#${chatData.id}`).shadowRoot.querySelector(`#${chatData.controlDomId}`);
    }
    if (targetContainer && controlElement) {
        targetContainer.appendChild(controlElement);
        targetContainer["style"].width = "98%";
        if (tmpControlType === "custom" || tmpControlType === "list" || tmpControlType === "slider") {
            targetContainer.classList.remove("p-2.5");
            targetContainer.classList.add("p-0");
            targetContainer.classList.add("md:p-2.5");
        }
        // Step 4: Wait until the control element is rendered
        await waitForComponentFullyLoaded(controlElement);
        // console.log("targetContainer", controlElement)
        // Step 5: Retrieve the content and emit the updated data
        // chatData.text = targetContainer.innerHTML
        chatData.itemComponent = data;
        chatData.controlType = data.controlType;
        chatData.isLoading = false;
        updateMessagesCallback(chatData);
    }
}
export function waitForComponentFullyLoaded(element) {
    return new Promise(resolve => {
        // Check if component emits ready event
        const handleReady = () => {
            element.removeEventListener("componentReady", handleReady);
            resolve();
        };
        element.addEventListener("componentReady", handleReady);
        // Fallback check for data attribute
        const checkAttribute = () => {
            // console.log("getattr",element.getAttribute('data-component-ready'))
            if (element.getAttribute("data-component-ready") === "true") {
                element.removeEventListener("componentReady", handleReady);
                resolve();
                return;
            }
            setTimeout(checkAttribute, 100);
        };
        // Start both checks
        setTimeout(checkAttribute, 100);
        // Ultimate fallback
        setTimeout(() => {
            element.removeEventListener("componentReady", handleReady);
            resolve();
        }, 15000);
    });
}
