// Income Management JavaScript

let incomeData = [];
let incomeSources = [];
let currentIncomeId = null;

// Helper function for notifications
function showNotification(message, type = 'success') {
    if (typeof showToast === 'function') {
        showToast(message, type);
    } else {
        console.log(`${type.toUpperCase()}: ${message}`);
    }
}

// Load user currency from profile
async function loadUserCurrency() {
    try {
        const profile = await apiCall('/api/settings/profile');
        window.userCurrency = profile.profile.currency || 'GBP';
    } catch (error) {
        console.error('Failed to load user currency:', error);
        // Fallback to GBP if API fails
        window.userCurrency = 'GBP';
    }
}

// Load income data
async function loadIncome() {
    try {
        console.log('Loading income data...');
        const response = await apiCall('/api/income/');
        console.log('Income API response:', response);
        console.log('Response has income?', response.income);
        console.log('Income array:', response.income);
        if (response.income) {
            incomeData = response.income;
            console.log('Income data loaded:', incomeData.length, 'entries');
            console.log('Full income data:', JSON.stringify(incomeData, null, 2));
            renderIncomeTable();
        } else {
            console.warn('No income data in response');
            incomeData = [];
            renderIncomeTable();
        }
    } catch (error) {
        console.error('Error loading income:', error);
        showNotification(window.getTranslation('common.error', 'An error occurred'), 'error');
    }
}

// Load income sources
async function loadIncomeSources() {
    try {
        const response = await apiCall('/api/income/sources');
        if (response.sources) {
            incomeSources = response.sources;
            renderIncomeSourceOptions();
        }
    } catch (error) {
        console.error('Error loading income sources:', error);
    }
}

// Render income source options in select
function renderIncomeSourceOptions() {
    const selects = document.querySelectorAll('.income-source-select');
    selects.forEach(select => {
        select.innerHTML = '<option value="">' + window.getTranslation('form.selectSource', 'Select source...') + '</option>';
        incomeSources.forEach(source => {
            select.innerHTML += `<option value="${source.value}">${source.label}</option>`;
        });
    });
}

// Render income table
function renderIncomeTable() {
    console.log('Rendering income table with', incomeData.length, 'entries');
    const tbody = document.getElementById('income-table-body');
    if (!tbody) {
        console.error('Income table body not found!');
        return;
    }
    
    if (incomeData.length === 0) {
        tbody.innerHTML = `
            <tr>
                <td colspan="5" class="px-6 py-12 text-center">
                    <span class="material-symbols-outlined text-6xl text-text-muted dark:text-[#92adc9] mb-4 block">payments</span>
                    <p class="text-text-muted dark:text-[#92adc9]" data-translate="income.noIncome">${window.getTranslation('income.noIncome', 'No income entries yet')}</p>
                    <p class="text-sm text-text-muted dark:text-[#92adc9] mt-2" data-translate="income.addFirst">${window.getTranslation('income.addFirst', 'Add your first income entry')}</p>
                </td>
            </tr>
        `;
        return;
    }
    
    tbody.innerHTML = incomeData.map(income => {
        const date = new Date(income.date);
        const formattedDate = formatDate(income.date);
        const source = incomeSources.find(s => s.value === income.source);
        const sourceLabel = source ? source.label : income.source;
        const sourceIcon = source ? source.icon : 'category';
        
        // Check if this is recurring income
        const isRecurring = income.is_recurring;
        const nextDueDate = income.next_due_date ? formatDate(income.next_due_date) : null;
        const isActive = income.is_active;
        const autoCreate = income.auto_create;
        
        // Build recurring info badge
        let recurringBadge = '';
        if (isRecurring && autoCreate) {
            const statusColor = isActive ? 'green' : 'gray';
            const statusIcon = isActive ? 'check_circle' : 'pause_circle';
            recurringBadge = `
                <div class="flex items-center gap-1 text-xs text-${statusColor}-600 dark:text-${statusColor}-400">
                    <span class="material-symbols-outlined text-[14px]">${statusIcon}</span>
                    <span>${income.frequency}</span>
                    ${nextDueDate ? `<span class="text-text-muted dark:text-[#92adc9]">• Next: ${nextDueDate}</span>` : ''}
                </div>
            `;
        }
        
        // Build action buttons
        let actionButtons = `
            <button onclick="editIncome(${income.id})" class="p-2 text-primary hover:bg-primary/10 rounded-lg transition-colors">
                <span class="material-symbols-outlined text-[20px]">edit</span>
            </button>
        `;
        
        if (isRecurring && autoCreate) {
            actionButtons += `
                <button onclick="toggleRecurringIncome(${income.id})" class="p-2 text-blue-500 hover:bg-blue-50 dark:hover:bg-blue-500/10 rounded-lg transition-colors" title="${isActive ? 'Pause' : 'Activate'}">
                    <span class="material-symbols-outlined text-[20px]">${isActive ? 'pause' : 'play_arrow'}</span>
                </button>
                <button onclick="createIncomeNow(${income.id})" class="p-2 text-green-500 hover:bg-green-50 dark:hover:bg-green-500/10 rounded-lg transition-colors" title="Create Now">
                    <span class="material-symbols-outlined text-[20px]">add_circle</span>
                </button>
            `;
        }
        
        actionButtons += `
            <button onclick="deleteIncome(${income.id})" class="p-2 text-red-500 hover:bg-red-50 dark:hover:bg-red-500/10 rounded-lg transition-colors">
                <span class="material-symbols-outlined text-[20px]">delete</span>
            </button>
        `;
        
        return `
            <tr class="border-b border-border-light dark:border-[#233648] hover:bg-slate-50 dark:hover:bg-[#111a22] transition-colors">
                <td class="px-6 py-4">
                    <div class="flex items-center gap-3">
                        <div class="w-10 h-10 rounded-lg bg-green-500/10 flex items-center justify-center">
                            <span class="material-symbols-outlined text-green-500 text-[20px]">${sourceIcon}</span>
                        </div>
                        <div>
                            <p class="font-medium text-text-main dark:text-white">${income.description}</p>
                            <p class="text-sm text-text-muted dark:text-[#92adc9]">${sourceLabel}</p>
                            ${recurringBadge}
                        </div>
                    </div>
                </td>
                <td class="px-6 py-4 text-text-main dark:text-white">${formattedDate}</td>
                <td class="px-6 py-4">
                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800 dark:bg-green-500/20 dark:text-green-400">
                        ${sourceLabel}
                    </span>
                </td>
                <td class="px-6 py-4 text-right">
                    <span class="font-semibold text-green-600 dark:text-green-400">
                        +${formatCurrency(income.amount, income.currency)}
                    </span>
                </td>
                <td class="px-6 py-4 text-right">
                    <div class="flex items-center justify-end gap-2">
                        ${actionButtons}
                    </div>
                </td>
            </tr>
        `;
    }).join('');
    console.log('Income table rendered successfully');
}

// Open income modal
function openIncomeModal() {
    const modal = document.getElementById('income-modal');
    const form = document.getElementById('income-form');
    const title = document.getElementById('income-modal-title');
    
    currentIncomeId = null;
    form.reset();
    title.textContent = window.getTranslation('income.add', 'Add Income');
    modal.classList.remove('hidden');
    
    // Set today's date as default
    const dateInput = document.getElementById('income-date');
    if (dateInput) {
        dateInput.valueAsDate = new Date();
    }
}

// Close income modal
function closeIncomeModal() {
    const modal = document.getElementById('income-modal');
    modal.classList.add('hidden');
    currentIncomeId = null;
}

// Edit income
function editIncome(id) {
    const income = incomeData.find(i => i.id === id);
    if (!income) return;
    
    currentIncomeId = id;
    
    const modal = document.getElementById('income-modal');
    const form = document.getElementById('income-form');
    const title = document.getElementById('income-modal-title');
    
    title.textContent = window.getTranslation('income.edit', 'Edit Income');
    
    document.getElementById('income-amount').value = income.amount;
    document.getElementById('income-source').value = income.source;
    document.getElementById('income-description').value = income.description;
    document.getElementById('income-date').value = income.date.split('T')[0];
    document.getElementById('income-tags').value = income.tags.join(', ');
    document.getElementById('income-frequency').value = income.frequency || 'once';
    
    // Show/hide custom frequency based on frequency value
    const customContainer = document.getElementById('custom-frequency-container');
    if (income.frequency === 'custom') {
        customContainer.classList.remove('hidden');
        document.getElementById('income-custom-days').value = income.custom_days || '';
    } else {
        customContainer.classList.add('hidden');
    }
    
    // Set auto_create checkbox
    const autoCreateCheckbox = document.getElementById('income-auto-create');
    if (autoCreateCheckbox) {
        autoCreateCheckbox.checked = income.auto_create || false;
    }
    
    modal.classList.remove('hidden');
}

// Save income
async function saveIncome(event) {
    event.preventDefault();
    console.log('Saving income...');
    
    const amount = document.getElementById('income-amount').value;
    const source = document.getElementById('income-source').value;
    const description = document.getElementById('income-description').value;
    const date = document.getElementById('income-date').value;
    const tagsInput = document.getElementById('income-tags').value;
    const frequency = document.getElementById('income-frequency').value;
    const customDays = document.getElementById('income-custom-days').value;
    const autoCreate = document.getElementById('income-auto-create')?.checked || false;
    
    if (!amount || !source || !description) {
        showNotification(window.getTranslation('common.missingFields', 'Missing required fields'), 'error');
        return;
    }
    
    // Validate custom frequency
    if (frequency === 'custom' && (!customDays || customDays < 1)) {
        showNotification(window.getTranslation('income.customDaysRequired', 'Please enter a valid number of days for custom frequency'), 'error');
        return;
    }
    
    const tags = tagsInput ? tagsInput.split(',').map(t => t.trim()).filter(t => t) : [];
    
    const data = {
        amount: parseFloat(amount),
        source: source,
        description: description,
        date: date,
        tags: tags,
        currency: window.userCurrency,
        frequency: frequency,
        custom_days: frequency === 'custom' ? parseInt(customDays) : null,
        auto_create: autoCreate
    };
    
    console.log('Income data to save:', data);
    
    try {
        let response;
        if (currentIncomeId) {
            console.log('Updating income:', currentIncomeId);
            response = await apiCall(`/api/income/${currentIncomeId}`, {
                method: 'PUT',
                body: JSON.stringify(data)
            });
            showNotification(window.getTranslation('income.updated', 'Income updated successfully'), 'success');
        } else {
            console.log('Creating new income');
            response = await apiCall('/api/income/', {
                method: 'POST',
                body: JSON.stringify(data)
            });
            console.log('Income created response:', response);
            showNotification(window.getTranslation('income.created', 'Income added successfully'), 'success');
        }
        
        closeIncomeModal();
        console.log('Reloading income list...');
        await loadIncome();
        
        // Reload dashboard if on dashboard page
        if (typeof loadDashboardData === 'function') {
            loadDashboardData();
        }
    } catch (error) {
        console.error('Error saving income:', error);
        showNotification(window.getTranslation('common.error', 'An error occurred'), 'error');
    }
}

// Delete income
async function deleteIncome(id) {
    if (!confirm(window.getTranslation('income.deleteConfirm', 'Are you sure you want to delete this income entry?'))) {
        return;
    }
    
    try {
        await apiCall(`/api/income/${id}`, {
            method: 'DELETE'
        });
        showNotification(window.getTranslation('income.deleted', 'Income deleted successfully'), 'success');
        loadIncome();
        
        // Reload dashboard if on dashboard page
        if (typeof loadDashboardData === 'function') {
            loadDashboardData();
        }
    } catch (error) {
        console.error('Error deleting income:', error);
        showNotification(window.getTranslation('common.error', 'An error occurred'), 'error');
    }
}

// Toggle recurring income active status
async function toggleRecurringIncome(id) {
    try {
        const response = await apiCall(`/api/income/${id}/toggle`, {
            method: 'PUT'
        });
        
        if (response.success) {
            showNotification(response.message, 'success');
            loadIncome();
        }
    } catch (error) {
        console.error('Error toggling recurring income:', error);
        showNotification(window.getTranslation('common.error', 'An error occurred'), 'error');
    }
}

// Create income now from recurring income
async function createIncomeNow(id) {
    if (!confirm(window.getTranslation('income.createNowConfirm', 'Create an income entry now from this recurring income?'))) {
        return;
    }
    
    try {
        const response = await apiCall(`/api/income/${id}/create-now`, {
            method: 'POST'
        });
        
        if (response.success) {
            showNotification(response.message, 'success');
            loadIncome();
            
            // Reload dashboard if on dashboard page
            if (typeof loadDashboardData === 'function') {
                loadDashboardData();
            }
        }
    } catch (error) {
        console.error('Error creating income:', error);
        showNotification(window.getTranslation('common.error', 'An error occurred'), 'error');
    }
}

// Initialize income page
document.addEventListener('DOMContentLoaded', () => {
    if (document.getElementById('income-table-body')) {
        loadUserCurrency(); // Load currency first
        loadIncome();
        loadIncomeSources();
        
        // Setup form submit
        const form = document.getElementById('income-form');
        if (form) {
            form.addEventListener('submit', saveIncome);
        }
        
        // Setup frequency change handler
        const frequencySelect = document.getElementById('income-frequency');
        if (frequencySelect) {
            frequencySelect.addEventListener('change', (e) => {
                const customContainer = document.getElementById('custom-frequency-container');
                if (customContainer) {
                    if (e.target.value === 'custom') {
                        customContainer.classList.remove('hidden');
                    } else {
                        customContainer.classList.add('hidden');
                    }
                }
            });
        }
    }
});

// Make functions global
window.openIncomeModal = openIncomeModal;
window.closeIncomeModal = closeIncomeModal;
window.editIncome = editIncome;
window.deleteIncome = deleteIncome;
window.saveIncome = saveIncome;
window.toggleRecurringIncome = toggleRecurringIncome;
window.createIncomeNow = createIncomeNow;