searxng/searx/templates/kvanDark/elements/chat_box.html

<aside class="chat_box" aria-label="{{ chat_box.chat_box }}">
    <h2 class="title"><bdi>{{ chat_box.chat_box }}</bdi></h2>
    <p><bdi>{{ chat_box.content | safe }}</bdi></p>
</aside>
<script>
    window.onload = function () {
        // Extract the 'q' parameter from the search URL in the sidebar
        const searchUrl = document.querySelector('#search_url pre').textContent;
        const url = new URL(searchUrl);
        const query = url.searchParams.get('q');

        const httpStatusCodes = {
            200: 'OK',
            400: 'Bad Request',
            401: 'Unauthorized',
            403: 'Forbidden',
            404: 'Not Found',
            500: 'Internal Server Error',
            // ... add other status codes as needed
        };

        fetch('/generate-chat-content', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({ query: query }),
        })
            .then(response => response.json())
            .then(data => {
                const chatBox = document.querySelector('.chat_box');
                switch (data.code) {
                    case 200:
                        chatBox.querySelector('h2 bdi').style.display = 'none';
                        break;
                    default:
                        let statusMessage = httpStatusCodes[data.code] || 'Unknown Status';
                        chatBox.querySelector('h2 bdi').innerHTML = `<a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/${data.code}">${data.code} ${statusMessage}</a>`;
                        break;
                }
                chatBox.querySelector('p bdi').innerHTML = data.content;
            });
    };
</script>