Create Auto Hide Feature

Wishlist AI Chatbot
1

Hi Max, it will be nice if the AI chat has an autohide feature to make the chat window disapear after specific time if the user did not engage in a conversation with the chat bot

3 Likes
2

Cool idea, thanks for sharing @backhome84 :+1:

3

Hi there, @backhome84 :wave:

Here is a solution from our dev team that should be added to the Custom JS field on the General tab of your widget’s settings:

const TIMEOUT = 30;

function waitForElement(selector, root = document) {
    return new Promise((res) => {
        let i = 0;

        function check() {
            const component = root.querySelector(selector);

            if (component) {
                res(component);
            } else if (i !== 50) {
                setTimeout(check, 100);
                i++;
            }
        }

        check();
    });
}

waitForElement("[class*='eapps-ai-chatbot'] button").then((bubble) => {
    const portal = bubble.parentNode.parentNode;
    const closeChat = () => {
        const window = portal.querySelector("[class*='window-transition__Container-sc']");
        if (window) {
            bubble?.click();
        }
    };

    let closeChatInterval = setInterval(closeChat, TIMEOUT * 1000);
    const resetInterval = () => {
        clearInterval(closeChatInterval);
        closeChatInterval = setInterval(closeChat, TIMEOUT * 1000);
    };

    document.addEventListener("visibilitychange", resetInterval);
    document.addEventListener("click", ({ target }) => {
        if (target.closest("[class*='window-transition__Container-sc']")) {
            resetInterval();
        }
    });
    document.addEventListener("keydown", ({ target }) => {
        if (target.closest("#interactionInput")) {
            resetInterval();
        }
    });
});

In the 1st line you should set the period of inactivity (in secs), after which the chat will be closed :slightly_smiling_face:

1 Like