static/js/dashboard.js

// script.js
const API_KEY = 'your_secret_api_key';

// Tab Switching
document.querySelectorAll('.sidebar-item[data-tab]').forEach(item => {
    item.addEventListener('click', () => {
        document.querySelectorAll('.sidebar-item').forEach(i => i.classList.remove('active'));
        item.classList.add('active');
        document.querySelectorAll('.tab-content').forEach(content => content.style.display = 'none');
        const tabId = item.getAttribute('data-tab') + '-content';
        document.getElementById(tabId).style.display = 'block';
        loadTabContent(tabId);
    });
});

// Profile Photo Click Event
document.getElementById('profilePhoto').addEventListener('click', function() {
    const menu = document.getElementById('profileMenu');
    if (menu.style.display === 'block') {
        menu.style.display = 'none';
    } else {
        menu.style.display = 'block';
    }
});

// Close Profile Menu when clicking outside
window.onclick = function(event) {
    if (!event.target.matches('#profilePhoto')) {
        const menu = document.getElementById('profileMenu');
        if (menu.style.display === 'block') {
            menu.style.display = 'none';
        }
    }
};

// Toggle Sidebar
document.getElementById('toggleSidebar').addEventListener('click', function() {
    document.getElementById('sidebar').classList.toggle('active');
});

// Fetch System Info
async function fetchSystemInfo() {
    try {
        const response = await fetch('/api/system-info', {
            headers: {
                'Authorization': API_KEY
            }
        });
        const data = await response.json();
        document.getElementById('osName').textContent = data.os.name;
        document.getElementById('osVersion').textContent = data.os.version;
        document.getElementById('uptime').textContent = data.uptime;
        document.getElementById('storage').textContent = `${(data.storage.total / (1024 ** 3)).toFixed(2)} GB / ${(data.storage.free / (1024 ** 3)).toFixed(2)} GB`;
    } catch (error) {
        console.error('Failed to fetch system info:', error);
    }
}

// Fetch Bot Stats
async function fetchBotStats() {
    try {
        const response = await fetch('/api/bot-stats', {
            headers: {
                'Authorization': API_KEY
            }
        });
        const data = await response.json();
        document.getElementById('totalFiles').textContent = data.total_files;
        document.getElementById('totalUsers').textContent = data.total_users;
        document.getElementById('totalChats').textContent = data.total_chats;
        document.getElementById('storageUsed').textContent = data.storage_used;
        document.getElementById('storageFree').textContent = data.storage_free;
    } catch (error) {
        console.error('Failed to fetch bot stats:', error);
    }
}

// Fetch Bot Status
async function fetchBotStatus() {
    try {
        const response = await fetch('/api/bot-status', {
            headers: {
                'Authorization': API_KEY
            }
        });
        const data = await response.json();
        document.getElementById('cpuUsage').textContent = `${data.cpu_usage}%`;
        document.getElementById('ramUsage').textContent = `${data.ram_usage}%`;
        document.getElementById('storageUsed').textContent = data.used_storage;
        document.getElementById('storageFree').textContent = data.free_storage;
    } catch (error) {
        console.error('Failed to fetch bot status:', error);
    }
}

// Load Tab Content
async function loadTabContent(tabId) {
    if (tabId === 'filters-content') {
        loadFilters();
    } else if (tabId === 'global-filters-content') {
        loadGlobalFilters();
    } else if (tabId === 'users-content') {
        loadUsers();
    } else if (tabId === 'chats-content') {
        loadChats();
    } else if (tabId === 'files-content') {
        loadFiles();
    } else if (tabId === 'connections-content') {
        loadConnections();
    } else if (tabId === 'stats-content') {
        fetchBotStatus();
    }
}

// Load Filters
async function loadFilters() {
    try {
        const response = await fetch('/api/filters?chat_id=123456789', { // Replace with actual chat ID
            headers: {
                'Authorization': API_KEY
            }
        });
        const data = await response.json();
        const filtersList = document.getElementById('filtersList');
        filtersList.innerHTML = '';
        data.filters.forEach(filter => {
            const filterItem = document.createElement('div');
            filterItem.className = 'stat-card';
            filterItem.innerHTML = `
                <div class="stat-header">
                    <div>
                        <h3>${filter}</h3>
                    </div>
                    <div class="stat-icon">
                        <i class="fas fa-filter"></i>
                    </div>
                </div>
                <button onclick="deleteFilter('${filter}')">Delete</button>
            `;
            filtersList.appendChild(filterItem);
        });
    } catch (error) {
        console.error('Failed to load filters:', error);
    }
}

// Load Global Filters
async function loadGlobalFilters() {
    try {
        const response = await fetch('/api/gfilters', {
            headers: {
                'Authorization': API_KEY
            }
        });
        const data = await response.json();
        const gfiltersList = document.getElementById('gfiltersList');
        gfiltersList.innerHTML = '';
        data.filters.forEach(filter => {
            const filterItem = document.createElement('div');
            filterItem.className = 'stat-card';
            filterItem.innerHTML = `
                <div class="stat-header">
                    <div>
                        <h3>${filter}</h3>
                    </div>
                    <div class="stat-icon">
                        <i class="fas fa-globe"></i>
                    </div>
                </div>
                <button onclick="deleteGFilter('${filter}')">Delete</button>
            `;
            gfiltersList.appendChild(filterItem);
        });
    } catch (error) {
        console.error('Failed to load global filters:', error);
    }
}

// Load Users
async function loadUsers() {
    try {
        const response = await fetch('/api/users', {
            headers: {
                'Authorization': API_KEY
            }
        });
        const data = await response.json();
        const usersList = document.getElementById('usersList');
        usersList.innerHTML = '';
        data.users.forEach(user => {
            const userItem = document.createElement('div');
            userItem.className = 'stat-card';
            userItem.innerHTML = `
                <div class="stat-header">
                    <div>
                        <h3>${user.name}</h3>
                        <p>ID: ${user.id}</p>
                    </div>
                    <div class="stat-icon">
                        <i class="fas fa-user"></i>
                    </div>
                </div>
                <button onclick="banUser('${user.id}', '${user.ban_status.ban_reason}')">${user.ban_status.is_banned ? 'Unban' : 'Ban'}</button>
            `;
            usersList.appendChild(userItem);
        });
    } catch (error) {
        console.error('Failed to load users:', error);
    }
}

// Load Chats
async function loadChats() {
    try {
        const response = await fetch('/api/chats', {
            headers: {
                'Authorization': API_KEY
            }
        });
        const data = await response.json();
        const chatsList = document.getElementById('chatsList');
        chatsList.innerHTML = '';
        data.chats.forEach(chat => {
            const chatItem = document.createElement('div');
            chatItem.className = 'stat-card';
            chatItem.innerHTML = `
                <div class="stat-header">
                    <div>
                        <h3>${chat.title}</h3>
                        <p>ID: ${chat.id}</p>
                    </div>
                    <div class="stat-icon">
                        <i class="fas fa-comment-dots"></i>
                    </div>
                </div>
                <button onclick="disableChat('${chat.id}', '${chat.chat_status.reason}')">${chat.chat_status.is_disabled ? 'Enable' : 'Disable'}</button>
            `;
            chatsList.appendChild(chatItem);
        });
    } catch (error) {
        console.error('Failed to load chats:', error);
    }
}

// Load Files
async function loadFiles() {
    try {
        const response = await fetch('/api/files', {
            headers: {
                'Authorization': API_KEY
            }
        });
        const data = await response.json();
        const filesList = document.getElementById('filesList');
        filesList.innerHTML = '';
        data.files.forEach(file => {
            const fileItem = document.createElement('div');
            fileItem.className = 'stat-card';
            fileItem.innerHTML = `
                <div class="stat-header">
                    <div>
                        <h3>${file.file_name}</h3>
                        <p>Size: ${get_size(file.file_size)}</p>
                    </div>
                    <div class="stat-icon">
                        <i class="fas fa-file"></i>
                    </div>
                </div>
                <button onclick="deleteFile('${file.file_id}')">Delete</button>
            `;
            filesList.appendChild(fileItem);
        });
    } catch (error) {
        console.error('Failed to load files:', error);
    }
}

// Load Connections
async function loadConnections() {
    try {
        const response = await fetch('/api/connections', {
            headers: {
                'Authorization': API_KEY
            }
        });
        const data = await response.json();
        const connectionsList = document.getElementById('connectionsList');
        connectionsList.innerHTML = '';
        data.connections.forEach(connection => {
            const connectionItem = document.createElement('div');
            connectionItem.className = 'stat-card';
            connectionItem.innerHTML = `
                <div class="stat-header">
                    <div>
                        <h3>${connection.title}</h3>
                        <p>ID: ${connection.id}</p>
                    </div>
                    <div class="stat-icon">
                        <i class="fas fa-link"></i>
                    </div>
                </div>
                <button onclick="deleteConnection('${connection.id}', '${connection.user_id}')">Delete</button>
            `;
            connectionsList.appendChild(connectionItem);
        });
    } catch (error) {
        console.error('Failed to load connections:', error);
    }
}

// Add Filter
document.getElementById('addFilterForm').addEventListener('submit', async function(event) {
    event.preventDefault();
    const chatId = document.getElementById('chatId').value;
    const text = document.getElementById('filterText').value;
    const replyText = document.getElementById('replyText').value;
    const btn = document.getElementById('btn').value;
    const file = document.getElementById('file').value;
    const alert = document.getElementById('alert').value;
    try {
        const response = await fetch('/api/add-filter', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `chat_id=${encodeURIComponent(chatId)}&text=${encodeURIComponent(text)}&reply_text=${encodeURIComponent(replyText)}&btn=${encodeURIComponent(btn)}&file=${encodeURIComponent(file)}&alert=${encodeURIComponent(alert)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadFilters();
    } catch (error) {
        console.error('Failed to add filter:', error);
        alert('Failed to add filter');
    }
});

// Delete Filter
async function deleteFilter(text) {
    try {
        const response = await fetch('/api/delete-filter', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `chat_id=123456789&text=${encodeURIComponent(text)}`, // Replace with actual chat ID
        });
        const data = await response.json();
        alert(data.message);
        loadFilters();
    } catch (error) {
        console.error('Failed to delete filter:', error);
        alert('Failed to delete filter');
    }
}

// Add Global Filter
document.getElementById('addGFilterForm').addEventListener('submit', async function(event) {
    event.preventDefault();
    const text = document.getElementById('gfilterText').value;
    const replyText = document.getElementById('greplyText').value;
    const btn = document.getElementById('gbtn').value;
    const file = document.getElementById('gfile').value;
    const alert = document.getElementById('galert').value;
    try {
        const response = await fetch('/api/add-gfilter', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `text=${encodeURIComponent(text)}&reply_text=${encodeURIComponent(replyText)}&btn=${encodeURIComponent(btn)}&file=${encodeURIComponent(file)}&alert=${encodeURIComponent(alert)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadGlobalFilters();
    } catch (error) {
        console.error('Failed to add global filter:', error);
        alert('Failed to add global filter');
    }
});

// Delete Global Filter
async function deleteGFilter(text) {
    try {
        const response = await fetch('/api/delete-gfilter', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `text=${encodeURIComponent(text)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadGlobalFilters();
    } catch (error) {
        console.error('Failed to delete global filter:', error);
        alert('Failed to delete global filter');
    }
}

// Ban User
async function banUser(userId, banReason) {
    try {
        const response = await fetch('/api/ban-user', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `user_id=${encodeURIComponent(userId)}&ban_reason=${encodeURIComponent(banReason)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadUsers();
    } catch (error) {
        console.error('Failed to ban user:', error);
        alert('Failed to ban user');
    }
}

// Unban User
async function unbanUser(userId) {
    try {
        const response = await fetch('/api/unban-user', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `user_id=${encodeURIComponent(userId)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadUsers();
    } catch (error) {
        console.error('Failed to unban user:', error);
        alert('Failed to unban user');
    }
}

// Disable Chat
async function disableChat(chatId, reason) {
    try {
        const response = await fetch('/api/disable-chat', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `chat_id=${encodeURIComponent(chatId)}&reason=${encodeURIComponent(reason)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadChats();
    } catch (error) {
        console.error('Failed to disable chat:', error);
        alert('Failed to disable chat');
    }
}

// Enable Chat
async function enableChat(chatId) {
    try {
        const response = await fetch('/api/enable-chat', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `chat_id=${encodeURIComponent(chatId)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadChats();
    } catch (error) {
        console.error('Failed to enable chat:', error);
        alert('Failed to enable chat');
    }
}

// Upload File
document.getElementById('uploadFileForm').addEventListener('submit', async function(event) {
    event.preventDefault();
    const formData = new FormData(this);
    try {
        const response = await fetch('/api/upload-file', {
            method: 'POST',
            headers: {
                'Authorization': API_KEY
            },
            body: formData,
        });
        const data = await response.json();
        alert(data.message);
        loadFiles();
    } catch (error) {
        console.error('Failed to upload file:', error);
        alert('Failed to upload file');
    }
});

// Delete File
async function deleteFile(fileId) {
    try {
        const response = await fetch('/api/delete-file', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `file_id=${encodeURIComponent(fileId)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadFiles();
    } catch (error) {
        console.error('Failed to delete file:', error);
        alert('Failed to delete file');
    }
}

// Broadcast Message
document.getElementById('broadcastForm').addEventListener('submit', async function(event) {
    event.preventDefault();
    const messageText = document.getElementById('broadcastText').value;
    try {
        const response = await fetch('/api/broadcast', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `message_text=${encodeURIComponent(messageText)}`,
        });
        const data = await response.json();
        alert(`Broadcast completed. Success: ${data.success}, Blocked: ${data.blocked}, Deleted: ${data.deleted}`);
    } catch (error) {
        console.error('Failed to broadcast message:', error);
        alert('Failed to broadcast message');
    }
});

// Add Connection
document.getElementById('addConnectionForm').addEventListener('submit', async function(event) {
    event.preventDefault();
    const groupId = document.getElementById('groupId').value;
    const userId = document.getElementById('userId').value;
    try {
        const response = await fetch('/api/add-connection', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `group_id=${encodeURIComponent(groupId)}&user_id=${encodeURIComponent(userId)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadConnections();
    } catch (error) {
        console.error('Failed to add connection:', error);
        alert('Failed to add connection');
    }
});

// Delete Connection
async function deleteConnection(groupId, userId) {
    try {
        const response = await fetch('/api/delete-connection', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `group_id=${encodeURIComponent(groupId)}&user_id=${encodeURIComponent(userId)}`,
        });
        const data = await response.json();
        alert(data.message);
        loadConnections();
    } catch (error) {
        console.error('Failed to delete connection:', error);
        alert('Failed to delete connection');
    }
}

// Save Settings
document.getElementById('saveSettingsForm').addEventListener('submit', async function(event) {
    event.preventDefault();
    const chatId = document.getElementById('settingsChatId').value;
    const settingKey = document.getElementById('settingKey').value;
    const settingValue = document.getElementById('settingValue').value;
    try {
        const response = await fetch('/api/save-settings', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `chat_id=${encodeURIComponent(chatId)}&setting_key=${encodeURIComponent(settingKey)}&setting_value=${encodeURIComponent(settingValue)}`,
        });
        const data = await response.json();
        alert(data.message);
    } catch (error) {
        console.error('Failed to save settings:', error);
        alert('Failed to save settings');
    }
});

// Restart Bot
document.getElementById('restartBotForm').addEventListener('submit', async function(event) {
    event.preventDefault();
    try {
        const response = await fetch('/api/restart-bot', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'Authorization': API_KEY
            },
            body: `admin_id=${encodeURIComponent(${ADMINS[0]})}`, // Replace with actual admin ID
        });
        const data = await response.json();
        alert(data.message);
    } catch (error) {
        console.error('Failed to restart bot:', error);
        alert('Failed to restart bot');
    }
});

// Performance Chart
const performanceCtx = document.getElementById('performanceChart').getContext('2d');
new Chart(performanceCtx, {
    type: 'line',
    data: {
        labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
        datasets: [{
            label: 'Uploads',
            data: [65, 59, 80, 81, 56, 55],
            borderColor: '#3b82f6',
            tension: 0.4
        }]
    },
    options: {
        responsive: true,
        maintainAspectRatio: false,
        scales: {
            y: {
                beginAtZero: true
            }
        }
    }
});

// Platform Distribution Chart
const platformCtx = document.getElementById('platformChart').getContext('2d');
new Chart(platformCtx, {
    type: 'doughnut',
    data: {
        labels: ['YouTube', 'Instagram', 'Facebook', 'WhatsApp', 'Pinterest', 'LinkedIn', 'TikTok', 'Twitter', 'Reddit', 'Telegram'],
        datasets: [{
            data: [45, 30, 25, 15, 10, 8, 7, 6, 5, 4],
            backgroundColor: ['#ff0000', '#e4405f', '#1877F2', '#25D366', '#BD081C', '#0077B5', '#000000', '#1DA1F2', '#FF4500', '#0088CC']
        }]
    },
    options: {
        responsive: true,
        maintainAspectRatio: false
    }
});

// Fetch System Info on Page Load
document.addEventListener('DOMContentLoaded', function() {
    fetchSystemInfo();
    fetchBotStats();
    fetchBotStatus();
    loadFilters();
    loadGlobalFilters();
    loadUsers();
    loadChats();
    loadFiles();
    loadConnections();
});

// Utility Function to Format Size
function get_size(size) {
    const units = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB"];
    size = parseFloat(size);
    let i = 0;
    while (size >= 1024.0 && i < units.length) {
        i += 1;
        size /= 1024.0;
    }
    return `${size.toFixed(2)} ${units[i]}`;
}