Token 管理：估算、警告與自動壓縮

// 常數設定
const TOKEN_LIMIT = 200000;       // Claude 的 context window
const WARNING_THRESHOLD = 0.75;   // 75% 時開始警告

/**
 * 估算文字的 token 數量
 * 簡化公式：約 2 字元 = 1 token
 * @param {string} text
 * @returns {number}
 */
function estimateTokens(text) {
    if (!text) return 0;
    return Math.ceil(text.length / 2);
}

/**
 * 計算整個對話的 token 總數
 * @param {Array} messages - [{role, content}, ...]
 * @returns {number}
 */
function getChatTokens(messages) {
    if (!messages || !Array.isArray(messages)) return 0;

    return messages.reduce((sum, msg) => {
        return sum + estimateTokens(msg.content || '');
    }, 0);
}

/**
 * 更新 Token 顯示和警告狀態
 * @param {Array} messages - 當前對話的訊息列表
 */
function updateTokenDisplay(messages) {
    const tokens = getChatTokens(messages);
    const percentage = tokens / TOKEN_LIMIT;

    // 1. 更新數字顯示
    const tokenCount = document.querySelector('.ai-token-count');
    if (tokenCount) {
        tokenCount.textContent = tokens.toLocaleString();

        // 超過閾值變成警告色
        if (percentage > WARNING_THRESHOLD) {
            tokenCount.classList.add('warning');
        } else {
            tokenCount.classList.remove('warning');
        }
    }

    // 2. 更新警告條
    const warningBar = document.querySelector('.ai-token-warning');
    const warningText = document.querySelector('.ai-warning-text');

    if (warningBar && warningText) {
        if (percentage > WARNING_THRESHOLD) {
            const pct = Math.round(percentage * 100);
            warningText.textContent = `對話過長 (${pct}%)，建議壓縮以維持 AI 回應品質`;
            warningBar.style.display = 'flex';
        } else {
            warningBar.style.display = 'none';
        }
    }
}

// 在渲染訊息後呼叫
function renderMessages() {
    // ... 渲染訊息的程式碼 ...

    // 更新 token 顯示
    updateTokenDisplay(currentChat.messages);
}

// 壓縮狀態
let isCompressing = false;

// 綁定壓縮按鈕事件
const compressBtn = document.querySelector('.ai-compress-btn');
if (compressBtn) {
    compressBtn.addEventListener('click', () => {
        if (isCompressing) return;

        // 透過 Socket.IO 發送壓縮請求
        if (currentChatId && SocketClient.isConnected()) {
            SocketClient.compressChat(currentChatId);
        }
    });
}

// Socket.IO 事件：壓縮開始
SocketClient.on('compress_started', (data) => {
    if (data.chatId === currentChatId) {
        isCompressing = true;
        compressBtn.textContent = '壓縮中...';
        compressBtn.disabled = true;
    }
});

// Socket.IO 事件：壓縮完成
SocketClient.on('compress_complete', (data) => {
    if (data.chatId === currentChatId) {
        isCompressing = false;
        compressBtn.textContent = '壓縮對話';
        compressBtn.disabled = false;

        // 更新本地訊息列表
        currentChat.messages = data.messages;
        renderMessages();

        console.log(`壓縮完成，減少了 ${data.compressed_count} 則訊息`);
    }
});

// Socket.IO 事件：壓縮失敗
SocketClient.on('compress_error', (data) => {
    if (data.chatId === currentChatId) {
        isCompressing = false;
        compressBtn.textContent = '壓縮對話';
        compressBtn.disabled = false;

        alert(`壓縮失敗：${data.error}`);
    }
});

function renderMessages() {
    container.innerHTML = messages.map(msg => {
        // 摘要訊息特殊樣式
        if (msg.is_summary) {
            return `
                <div class="ai-message ai-message-summary">
                    <div class="ai-message-content">
                        <div class="ai-message-role">對話摘要</div>
                        <div class="ai-message-text">${renderMarkdown(msg.content)}</div>
                    </div>
                </div>
            `;
        }

        // 一般訊息
        return `
            <div class="ai-message ai-message-${msg.role}">
                ...
            </div>
        `;
    }).join('');
}

// 使用 GPT Tokenizer（適用於大部分 LLM）
// npm install gpt-tokenizer

import { encode } from 'gpt-tokenizer';

function estimateTokensPrecise(text) {
    return encode(text).length;
}

// 壓縮失敗時的 fallback
SocketClient.on('compress_error', (data) => {
    // 提供手動選項
    const shouldTruncate = confirm(
        `壓縮失敗：${data.error}\n\n` +
        `是否要直接刪除較舊的訊息？（會遺失部分對話紀錄）`
    );

    if (shouldTruncate) {
        SocketClient.emit('truncate_chat', {
            chatId: data.chatId,
            keepRecent: 20
        });
    }
});

/**
 * Token 管理模組
 */
const TokenManager = (function() {
    const TOKEN_LIMIT = 200000;
    const WARNING_THRESHOLD = 0.75;

    /**
     * 估算 token 數量
     */
    function estimateTokens(text) {
        if (!text) return 0;
        return Math.ceil(text.length / 2);
    }

    /**
     * 計算對話總 token
     */
    function getChatTokens(messages) {
        if (!messages || !Array.isArray(messages)) return 0;
        return messages.reduce((sum, msg) =>
            sum + estimateTokens(msg.content || ''), 0);
    }

    /**
     * 更新顯示
     */
    function updateDisplay(messages) {
        const tokens = getChatTokens(messages);
        const percentage = tokens / TOKEN_LIMIT;

        // 更新數字
        const countEl = document.querySelector('.ai-token-count');
        if (countEl) {
            countEl.textContent = tokens.toLocaleString();
            countEl.classList.toggle('warning', percentage > WARNING_THRESHOLD);
        }

        // 更新警告條
        const warningBar = document.querySelector('.ai-token-warning');
        const warningText = document.querySelector('.ai-warning-text');
        if (warningBar && warningText) {
            if (percentage > WARNING_THRESHOLD) {
                const pct = Math.round(percentage * 100);
                warningText.textContent = `對話過長 (${pct}%)，建議壓縮`;
                warningBar.style.display = 'flex';
            } else {
                warningBar.style.display = 'none';
            }
        }
    }

    /**
     * 檢查是否需要警告
     */
    function shouldWarn(messages) {
        const tokens = getChatTokens(messages);
        return tokens / TOKEN_LIMIT > WARNING_THRESHOLD;
    }

    return {
        estimateTokens,
        getChatTokens,
        updateDisplay,
        shouldWarn,
        TOKEN_LIMIT,
        WARNING_THRESHOLD
    };
})();