{% extends "layouts/base.html" %}

{% block title %}Release Management - Admin{% endblock %}

{% block content %}
<div class="container mx-auto px-4 py-8">
    <div class="max-w-7xl mx-auto">
        <!-- Page Header -->
        <div class="mb-8">
            <div class="flex items-center justify-between">
                <div>
                    <h1 class="text-3xl font-bold text-gray-900 dark:text-white">Release Management</h1>
                    <p class="mt-2 text-gray-600 dark:text-gray-400">Manage release announcements and notifications</p>
                </div>
                <div class="flex space-x-3">
                    <button id="sync-releases-btn" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg flex items-center">
                        <i class="fas fa-sync-alt mr-2"></i>
                        Sync Releases
                    </button>
                    <button id="create-release-btn" class="bg-green-600 hover:bg-green-700 text-white px-4 py-2 rounded-lg flex items-center">
                        <i class="fas fa-plus mr-2"></i>
                        Create Release
                    </button>
                </div>
            </div>
        </div>

        <!-- Release Statistics -->
        <div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-8">
            <div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
                <div class="flex items-center">
                    <div class="p-3 rounded-full bg-blue-100 dark:bg-blue-900">
                        <i class="fas fa-tag text-blue-600 dark:text-blue-400"></i>
                    </div>
                    <div class="ml-4">
                        <p class="text-sm font-medium text-gray-600 dark:text-gray-400">Total Releases</p>
                        <p id="total-releases" class="text-2xl font-semibold text-gray-900 dark:text-white">-</p>
                    </div>
                </div>
            </div>

            <div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
                <div class="flex items-center">
                    <div class="p-3 rounded-full bg-green-100 dark:bg-green-900">
                        <i class="fas fa-star text-green-600 dark:text-green-400"></i>
                    </div>
                    <div class="ml-4">
                        <p class="text-sm font-medium text-gray-600 dark:text-gray-400">Major Releases</p>
                        <p id="major-releases" class="text-2xl font-semibold text-gray-900 dark:text-white">-</p>
                    </div>
                </div>
            </div>

            <div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
                <div class="flex items-center">
                    <div class="p-3 rounded-full bg-yellow-100 dark:bg-yellow-900">
                        <i class="fas fa-fire text-yellow-600 dark:text-yellow-400"></i>
                    </div>
                    <div class="ml-4">
                        <p class="text-sm font-medium text-gray-600 dark:text-gray-400">Featured</p>
                        <p id="featured-releases" class="text-2xl font-semibold text-gray-900 dark:text-white">-</p>
                    </div>
                </div>
            </div>

            <div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
                <div class="flex items-center">
                    <div class="p-3 rounded-full bg-purple-100 dark:bg-purple-900">
                        <i class="fas fa-code-branch text-purple-600 dark:text-purple-400"></i>
                    </div>
                    <div class="ml-4">
                        <p class="text-sm font-medium text-gray-600 dark:text-gray-400">Latest Version</p>
                        <p id="latest-version" class="text-lg font-semibold text-gray-900 dark:text-white">-</p>
                    </div>
                </div>
            </div>
        </div>

        <!-- Sync Configuration -->
        <div class="bg-white dark:bg-gray-800 rounded-lg shadow mb-8">
            <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700">
                <h2 class="text-lg font-semibold text-gray-900 dark:text-white">Sync Configuration</h2>
            </div>
            <div class="p-6">
                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                    <div>
                        <h3 class="text-md font-medium text-gray-900 dark:text-white mb-3">GitHub Integration</h3>
                        <div class="space-y-3">
                            <div class="flex items-center justify-between">
                                <span class="text-sm text-gray-600 dark:text-gray-400">Status</span>
                                <span id="github-status" class="px-2 py-1 text-xs rounded-full bg-gray-100 dark:bg-gray-700 text-gray-800 dark:text-gray-200">Unknown</span>
                            </div>
                            <button id="sync-github-btn" class="w-full bg-gray-800 hover:bg-gray-900 text-white px-4 py-2 rounded-lg flex items-center justify-center">
                                <i class="fab fa-github mr-2"></i>
                                Sync from GitHub
                            </button>
                        </div>
                    </div>
                    <div>
                        <h3 class="text-md font-medium text-gray-900 dark:text-white mb-3">Changelog Integration</h3>
                        <div class="space-y-3">
                            <div class="flex items-center justify-between">
                                <span class="text-sm text-gray-600 dark:text-gray-400">Status</span>
                                <span id="changelog-status" class="px-2 py-1 text-xs rounded-full bg-gray-100 dark:bg-gray-700 text-gray-800 dark:text-gray-200">Unknown</span>
                            </div>
                            <button id="sync-changelog-btn" class="w-full bg-orange-600 hover:bg-orange-700 text-white px-4 py-2 rounded-lg flex items-center justify-center">
                                <i class="fas fa-file-alt mr-2"></i>
                                Parse Changelog
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Releases Table -->
        <div class="bg-white dark:bg-gray-800 rounded-lg shadow">
            <div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700">
                <div class="flex items-center justify-between">
                    <h2 class="text-lg font-semibold text-gray-900 dark:text-white">Release Announcements</h2>
                    <div class="flex items-center space-x-3">
                        <select id="releases-per-page" class="border border-gray-300 dark:border-gray-600 rounded-lg px-3 py-2 text-sm bg-white dark:bg-gray-700 text-gray-900 dark:text-white">
                            <option value="10">10 per page</option>
                            <option value="25">25 per page</option>
                            <option value="50">50 per page</option>
                        </select>
                        <button id="refresh-releases-btn" class="text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200">
                            <i class="fas fa-refresh"></i>
                        </button>
                    </div>
                </div>
            </div>
            <div class="overflow-x-auto">
                <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
                    <thead class="bg-gray-50 dark:bg-gray-900">
                        <tr>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Version</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Title</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Release Date</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Type</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Status</th>
                            <th class="px-6 py-3 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Actions</th>
                        </tr>
                    </thead>
                    <tbody id="releases-table-body" class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
                        <!-- Releases will be loaded here -->
                    </tbody>
                </table>
            </div>
            <div id="releases-loading" class="text-center py-12">
                <i class="fas fa-spinner fa-spin text-2xl text-gray-400 mb-4"></i>
                <p class="text-gray-600 dark:text-gray-400">Loading releases...</p>
            </div>
            <div id="releases-empty" class="text-center py-12 hidden">
                <i class="fas fa-tag text-4xl text-gray-300 dark:text-gray-600 mb-4"></i>
                <p class="text-gray-600 dark:text-gray-400">No releases found</p>
                <button class="mt-4 bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg" onclick="syncReleases()">
                    Sync from GitHub
                </button>
            </div>
        </div>
    </div>
</div>

<!-- Create Release Modal -->
<div id="create-release-modal" class="fixed inset-0 bg-gray-600 bg-opacity-50 overflow-y-auto h-full w-full hidden">
    <div class="relative top-20 mx-auto p-5 border w-full max-w-2xl shadow-lg rounded-md bg-white dark:bg-gray-800">
        <div class="mt-3">
            <div class="flex items-center justify-between mb-4">
                <h3 class="text-lg font-medium text-gray-900 dark:text-white">Create Release Announcement</h3>
                <button id="close-create-modal" class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-200">
                    <i class="fas fa-times"></i>
                </button>
            </div>
            <form id="create-release-form">
                <div class="space-y-4">
                    <div>
                        <label for="release-version" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Version *</label>
                        <input type="text" id="release-version" name="version" required
                               class="mt-1 block w-full border border-gray-300 dark:border-gray-600 rounded-md shadow-sm px-3 py-2 bg-white dark:bg-gray-700 text-gray-900 dark:text-white"
                               placeholder="e.g., 1.2.3">
                    </div>
                    <div>
                        <label for="release-title" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Title *</label>
                        <input type="text" id="release-title" name="title" required
                               class="mt-1 block w-full border border-gray-300 dark:border-gray-600 rounded-md shadow-sm px-3 py-2 bg-white dark:bg-gray-700 text-gray-900 dark:text-white"
                               placeholder="e.g., Major Feature Update">
                    </div>
                    <div>
                        <label for="release-description" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Description</label>
                        <textarea id="release-description" name="description" rows="4"
                                  class="mt-1 block w-full border border-gray-300 dark:border-gray-600 rounded-md shadow-sm px-3 py-2 bg-white dark:bg-gray-700 text-gray-900 dark:text-white"
                                  placeholder="Describe the changes in this release..."></textarea>
                    </div>
                    <div class="grid grid-cols-2 gap-4">
                        <div>
                            <label for="changelog-url" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Changelog URL</label>
                            <input type="url" id="changelog-url" name="changelog_url"
                                   class="mt-1 block w-full border border-gray-300 dark:border-gray-600 rounded-md shadow-sm px-3 py-2 bg-white dark:bg-gray-700 text-gray-900 dark:text-white"
                                   placeholder="https://github.com/...">
                        </div>
                        <div>
                            <label for="download-url" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Download URL</label>
                            <input type="url" id="download-url" name="download_url"
                                   class="mt-1 block w-full border border-gray-300 dark:border-gray-600 rounded-md shadow-sm px-3 py-2 bg-white dark:bg-gray-700 text-gray-900 dark:text-white"
                                   placeholder="https://github.com/...">
                        </div>
                    </div>
                    <div class="flex items-center space-x-6">
                        <label class="flex items-center">
                            <input type="checkbox" id="is-major" name="is_major" class="rounded border-gray-300 dark:border-gray-600">
                            <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Major Release</span>
                        </label>
                        <label class="flex items-center">
                            <input type="checkbox" id="is-featured" name="is_featured" class="rounded border-gray-300 dark:border-gray-600">
                            <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Featured Release</span>
                        </label>
                    </div>
                </div>
                <div class="flex items-center justify-end space-x-3 mt-6">
                    <button type="button" id="cancel-create" class="px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 rounded-md">
                        Cancel
                    </button>
                    <button type="submit" class="px-4 py-2 text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 rounded-md">
                        Create Release
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Sync Releases Modal -->
<div id="sync-releases-modal" class="fixed inset-0 bg-gray-600 bg-opacity-50 overflow-y-auto h-full w-full hidden">
    <div class="relative top-20 mx-auto p-5 border w-full max-w-md shadow-lg rounded-md bg-white dark:bg-gray-800">
        <div class="mt-3">
            <div class="flex items-center justify-between mb-4">
                <h3 class="text-lg font-medium text-gray-900 dark:text-white">Sync Releases</h3>
                <button id="close-sync-modal" class="text-gray-400 hover:text-gray-600 dark:hover:text-gray-200">
                    <i class="fas fa-times"></i>
                </button>
            </div>
            <div class="space-y-4">
                <p class="text-sm text-gray-600 dark:text-gray-400">Choose sync options:</p>
                <div class="flex flex-col space-y-3">
                    <button id="sync-github-modal-btn" class="bg-gray-800 hover:bg-gray-900 text-white px-4 py-3 rounded-lg flex items-center">
                        <i class="fab fa-github mr-3"></i>
                        <div class="text-left">
                            <div class="font-medium">Sync from GitHub</div>
                            <div class="text-sm text-gray-300">Import releases from GitHub API</div>
                        </div>
                    </button>
                    <button id="sync-changelog-modal-btn" class="bg-orange-600 hover:bg-orange-700 text-white px-4 py-3 rounded-lg flex items-center">
                        <i class="fas fa-file-alt mr-3"></i>
                        <div class="text-left">
                            <div class="font-medium">Parse Changelog</div>
                            <div class="text-sm text-orange-200">Parse local CHANGELOG.md file</div>
                        </div>
                    </button>
                    <button id="sync-both-modal-btn" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-3 rounded-lg flex items-center">
                        <i class="fas fa-sync-alt mr-3"></i>
                        <div class="text-left">
                            <div class="font-medium">Sync All Sources</div>
                            <div class="text-sm text-blue-200">Sync from both GitHub and changelog</div>
                        </div>
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
// Release Management JavaScript
let currentReleases = [];

// Initialize page
document.addEventListener('DOMContentLoaded', function() {
    loadReleaseStats();
    loadReleases();
    setupEventListeners();
    checkSyncStatus();
});

function setupEventListeners() {
    // Modal controls
    document.getElementById('create-release-btn').addEventListener('click', () => {
        document.getElementById('create-release-modal').classList.remove('hidden');
    });
    
    document.getElementById('close-create-modal').addEventListener('click', () => {
        document.getElementById('create-release-modal').classList.add('hidden');
    });
    
    document.getElementById('cancel-create').addEventListener('click', () => {
        document.getElementById('create-release-modal').classList.add('hidden');
    });
    
    document.getElementById('sync-releases-btn').addEventListener('click', () => {
        document.getElementById('sync-releases-modal').classList.remove('hidden');
    });
    
    document.getElementById('close-sync-modal').addEventListener('click', () => {
        document.getElementById('sync-releases-modal').classList.add('hidden');
    });
    
    // Form submission
    document.getElementById('create-release-form').addEventListener('submit', handleCreateRelease);
    
    // Sync buttons
    document.getElementById('sync-github-btn').addEventListener('click', () => syncReleases('github'));
    document.getElementById('sync-changelog-btn').addEventListener('click', () => syncReleases('changelog'));
    document.getElementById('sync-github-modal-btn').addEventListener('click', () => {
        document.getElementById('sync-releases-modal').classList.add('hidden');
        syncReleases('github');
    });
    document.getElementById('sync-changelog-modal-btn').addEventListener('click', () => {
        document.getElementById('sync-releases-modal').classList.add('hidden');
        syncReleases('changelog');
    });
    document.getElementById('sync-both-modal-btn').addEventListener('click', () => {
        document.getElementById('sync-releases-modal').classList.add('hidden');
        syncAllSources();
    });
    
    // Refresh
    document.getElementById('refresh-releases-btn').addEventListener('click', loadReleases);
    
    // Per page change
    document.getElementById('releases-per-page').addEventListener('change', loadReleases);
}

async function loadReleaseStats() {
    try {
        const response = await fetch('/api/releases/stats', {
            headers: {
                'Authorization': `Bearer ${getApiToken()}`
            }
        });
        
        if (response.ok) {
            const data = await response.json();
            document.getElementById('total-releases').textContent = data.total_releases || 0;
            document.getElementById('major-releases').textContent = data.major_releases || 0;
            document.getElementById('featured-releases').textContent = data.featured_releases || 0;
            document.getElementById('latest-version').textContent = data.latest_version || 'None';
        }
    } catch (error) {
        console.error('Error loading release stats:', error);
    }
}

async function loadReleases() {
    const loading = document.getElementById('releases-loading');
    const empty = document.getElementById('releases-empty');
    const tbody = document.getElementById('releases-table-body');
    
    loading.classList.remove('hidden');
    empty.classList.add('hidden');
    tbody.innerHTML = '';
    
    try {
        const limit = document.getElementById('releases-per-page').value;
        const response = await fetch(`/api/admin/releases/all?limit=${limit}`, {
            headers: {
                'Authorization': `Bearer ${getApiToken()}`
            }
        });
        
        if (response.ok) {
            const releases = await response.json();
            currentReleases = releases;
            
            if (releases.length === 0) {
                loading.classList.add('hidden');
                empty.classList.remove('hidden');
            } else {
                loading.classList.add('hidden');
                renderReleasesTable(releases);
            }
        } else {
            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
        }
    } catch (error) {
        console.error('Error loading releases:', error);
        loading.classList.add('hidden');
        showNotification('Error loading releases: ' + error.message, 'error');
    }
}

function renderReleasesTable(releases) {
    const tbody = document.getElementById('releases-table-body');
    tbody.innerHTML = '';
    
    releases.forEach(release => {
        const row = document.createElement('tr');
        row.className = 'hover:bg-gray-50 dark:hover:bg-gray-700';
        
        const releaseDate = new Date(release.release_date).toLocaleDateString();
        const typeBadges = [];
        
        if (release.is_major) {
            typeBadges.push('<span class="px-2 py-1 text-xs rounded-full bg-red-100 dark:bg-red-900 text-red-800 dark:text-red-200">Major</span>');
        }
        if (release.is_featured) {
            typeBadges.push('<span class="px-2 py-1 text-xs rounded-full bg-yellow-100 dark:bg-yellow-900 text-yellow-800 dark:text-yellow-200">Featured</span>');
        }
        
        const statusBadge = release.github_release_id 
            ? '<span class="px-2 py-1 text-xs rounded-full bg-green-100 dark:bg-green-900 text-green-800 dark:text-green-200">GitHub</span>'
            : '<span class="px-2 py-1 text-xs rounded-full bg-blue-100 dark:bg-blue-900 text-blue-800 dark:text-blue-200">Manual</span>';
        
        row.innerHTML = `
            <td class="px-6 py-4 whitespace-nowrap">
                <div class="text-sm font-medium text-gray-900 dark:text-white">${release.version}</div>
            </td>
            <td class="px-6 py-4">
                <div class="text-sm text-gray-900 dark:text-white">${release.title}</div>
                <div class="text-sm text-gray-500 dark:text-gray-400 truncate max-w-xs">${release.description || ''}</div>
            </td>
            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 dark:text-gray-400">
                ${releaseDate}
            </td>
            <td class="px-6 py-4 whitespace-nowrap">
                <div class="flex flex-wrap gap-1">
                    ${typeBadges.join('')}
                </div>
            </td>
            <td class="px-6 py-4 whitespace-nowrap">
                ${statusBadge}
            </td>
            <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
                <div class="flex items-center justify-end space-x-2">
                    <button class="text-blue-600 hover:text-blue-900 dark:text-blue-400 dark:hover:text-blue-300" 
                            onclick="editRelease('${release.id}')">
                        <i class="fas fa-edit"></i>
                    </button>
                    <button class="text-red-600 hover:text-red-900 dark:text-red-400 dark:hover:text-red-300" 
                            onclick="deleteRelease('${release.id}', '${release.version}')">
                        <i class="fas fa-trash"></i>
                    </button>
                </div>
            </td>
        `;
        
        tbody.appendChild(row);
    });
}

async function handleCreateRelease(e) {
    e.preventDefault();
    
    const formData = new FormData(e.target);
    const releaseData = {
        version: formData.get('version'),
        title: formData.get('title'),
        description: formData.get('description'),
        is_major: formData.get('is_major') === 'on',
        is_featured: formData.get('is_featured') === 'on',
        changelog_url: formData.get('changelog_url') || null,
        download_url: formData.get('download_url') || null
    };
    
    try {
        const response = await fetch('/api/releases/', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${getApiToken()}`
            },
            body: JSON.stringify(releaseData)
        });
        
        if (response.ok) {
            document.getElementById('create-release-modal').classList.add('hidden');
            document.getElementById('create-release-form').reset();
            showNotification('Release created successfully!', 'success');
            loadReleases();
            loadReleaseStats();
        } else {
            const error = await response.json();
            throw new Error(error.detail || 'Failed to create release');
        }
    } catch (error) {
        console.error('Error creating release:', error);
        showNotification('Error creating release: ' + error.message, 'error');
    }
}

async function syncReleases(source) {
    showNotification(`Syncing releases from ${source}...`, 'info');
    
    try {
        const response = await fetch('/api/releases/sync', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${getApiToken()}`
            },
            body: JSON.stringify({ source, force: false })
        });
        
        if (response.ok) {
            const result = await response.json();
            showNotification(result.message, 'success');
            loadReleases();
            loadReleaseStats();
        } else {
            const error = await response.json();
            throw new Error(error.detail || 'Sync failed');
        }
    } catch (error) {
        console.error('Error syncing releases:', error);
        showNotification('Error syncing releases: ' + error.message, 'error');
    }
}

async function syncAllSources() {
    showNotification('Syncing from all sources...', 'info');
    
    try {
        const response = await fetch('/api/admin/releases/bulk-sync', {
            method: 'POST',
            headers: {
                'Authorization': `Bearer ${getApiToken()}`
            }
        });
        
        if (response.ok) {
            const result = await response.json();
            const messages = result.sync_results.map(r => `${r.source}: ${r.message}`).join('\n');
            showNotification('Bulk sync completed:\n' + messages, 'success');
            loadReleases();
            loadReleaseStats();
        } else {
            const error = await response.json();
            throw new Error(error.detail || 'Bulk sync failed');
        }
    } catch (error) {
        console.error('Error in bulk sync:', error);
        showNotification('Error in bulk sync: ' + error.message, 'error');
    }
}

async function checkSyncStatus() {
    try {
        const response = await fetch('/api/releases/health');
        
        if (response.ok) {
            const data = await response.json();
            const config = data.configuration || {};
            
            // Update GitHub status
            const githubStatus = document.getElementById('github-status');
            if (config.github_enabled) {
                githubStatus.textContent = 'Enabled';
                githubStatus.className = 'px-2 py-1 text-xs rounded-full bg-green-100 dark:bg-green-900 text-green-800 dark:text-green-200';
            } else {
                githubStatus.textContent = 'Disabled';
                githubStatus.className = 'px-2 py-1 text-xs rounded-full bg-red-100 dark:bg-red-900 text-red-800 dark:text-red-200';
            }
            
            // Update Changelog status
            const changelogStatus = document.getElementById('changelog-status');
            if (config.changelog_enabled) {
                changelogStatus.textContent = 'Enabled';
                changelogStatus.className = 'px-2 py-1 text-xs rounded-full bg-green-100 dark:bg-green-900 text-green-800 dark:text-green-200';
            } else {
                changelogStatus.textContent = 'Disabled';
                changelogStatus.className = 'px-2 py-1 text-xs rounded-full bg-red-100 dark:bg-red-900 text-red-800 dark:text-red-200';
            }
        }
    } catch (error) {
        console.error('Error checking sync status:', error);
    }
}

function editRelease(releaseId) {
    // TODO: Implement edit functionality
    showNotification('Edit functionality coming soon!', 'info');
}

async function deleteRelease(releaseId, version) {
    if (confirm(`Are you sure you want to delete release ${version}?`)) {
        try {
            const response = await fetch(`/api/admin/releases/${releaseId}`, {
                method: 'DELETE',
                headers: {
                    'Authorization': `Bearer ${getApiToken()}`
                }
            });
            
            if (response.ok) {
                showNotification('Release deleted successfully!', 'success');
                loadReleases();
                loadReleaseStats();
            } else {
                const error = await response.json();
                throw new Error(error.detail || 'Failed to delete release');
            }
        } catch (error) {
            console.error('Error deleting release:', error);
            showNotification('Error deleting release: ' + error.message, 'error');
        }
    }
}

function getApiToken() {
    // TODO: Implement proper API token retrieval
    return 'dummy_token';
}

function showNotification(message, type = 'info') {
    // TODO: Implement notification system
    console.log(`[${type.toUpperCase()}] ${message}`);
    alert(message);
}
</script>
{% endblock %}