application/static/js/components/initialize.js

// application/static/js/components/initialize.js
import requests from "./request.js";

class Initialize {
    constructor(uiManager) {
        this.convId = null;
        this.convTitle = null;
        this.uiManager = uiManager;
        this.systemPrompt = `your response syntax should be: ###for heading### \n ** for sub heading ** \n *** for text highlight/bold text ***`;
        this.model = null;
        console.log("Initialize constructor called"); // Initial log
    }

    async initialize(model = null) {
        console.log("initialize called with model:", model);
        this.convTitle = null;
        this.convId = null;
        this.uiManager.messagesDiv.innerHTML = '';
        this.uiManager.prevChatsCont.innerHTML = '';
        console.log("initialize: UI reset");

        await this.fetchModels(model);
        console.log("initialize: fetchModels completed");

        await this.fetchConvs();
        console.log("initialize: fetchConvs completed");
    }

    async reInitialize(id) {
        console.log("reInitialize called with id:", id);
        this.convTitle = null;
        this.convId = id;
        this.uiManager.messagesDiv.innerHTML = '';
        console.log("reInitialize: UI reset");

        await this.fetchConv(id);
        console.log("reInitialize: fetchConv completed");
    }

    async fetchConv(id) {
        console.log("fetchConv called with id:", id);
        try {
            const response = await requests.request('POST', '/fetch', { "Content-Type": "application/json" }, JSON.stringify({ "convId": id }), false);
            if (!response.ok) {
                const errorText = await response.text();
                console.error(`Error fetching conversation: ${response.status} - ${errorText}`);
                return; // Early return on error
            }
            const data = await response.json();
            console.log("fetchConv: data received:", data);
            this.convTitle = data['title'];
            const arr = data['messages'];
            for (let i = 0; i < arr.length; i++) {
                const dict = arr[i];
                if (dict['role'] == 'user') {
                    this.uiManager.appendUserMsg(dict['content'])
                }
                else if (dict['role'] == 'assistant') {
                    this.uiManager.appendAiMsg(dict['content']);
                    this.uiManager.renderSymbols.renderAll(this.uiManager.aiP);
                }
            }
        } catch (error) {
            console.error("fetchConv: Error:", error);
        }
    }

    async fetchConvs() {
        console.log("fetchConvs called");
        try {
            const response = await requests.request('GET', '/convs', { "Content-Type": "application/json" }, null, false);
            if (!response.ok) {
                const errorText = await response.text();
                console.error(`Error fetching conversations: ${response.status} - ${errorText}`);
                return; // Early return on error

            }
            const data = await response.json();
            console.log("fetchConvs: data received:", data);
            this.uiManager.prevChatsCont.innerHTML = '';

            for (let i = 0; i < data.length; i++) {
                const prevChat = document.createElement('div');
                const dict = data[i];
                prevChat.id = dict['convId'];
                prevChat.className = 'prevChat';
                prevChat.innerText = dict['title'];
                this.uiManager.prevChatsCont.appendChild(prevChat);

                prevChat.addEventListener('click', () => {
                    console.log("prevChat clicked, id:", prevChat.id); // Log click
                    this.reInitialize(prevChat.id);
                });
            }
        } catch (error) {
            console.error("fetchConvs: Error:", error);
        }
    }

    async fetchModels(initialModel) {
        console.log("fetchModels called with initialModel:", initialModel);
        try {
            const response = await requests.request('GET', '/models', { "Content-Type": "application/json" }, null, false);
            if (!response.ok) {
                const errorText = await response.text();
                console.error(`Error fetching models: ${response.status} - ${errorText}`);
                return; // Early return on error
            }
            const data = await response.json();
            console.log("fetchModels: data received:", data);
            this.uiManager.models.innerHTML = '';

            for (let i = 0; i < data.length; i++) {
                const opt = document.createElement('option');
                opt.innerText = data[i];
                opt.value = data[i];
                this.uiManager.models.appendChild(opt);
            }

            this.model = initialModel || data[0];
            this.uiManager.models.value = this.model;
            console.log("fetchModels: model set to:", this.model);

            this.uiManager.models.addEventListener('change', (e) => {
                console.log("Model changed to:", e.target.value);
                this.model = e.target.value;
            });

        } catch (error) {
            console.error("fetchModels: Error:", error);
        }
    }
}
export default Initialize