{% extends 'admin/base.html.twig' %}

{% block title %}Güncellemeler{% endblock %}
{% block page_title %}Güncellemeler{% endblock %}

{% block body %}
<div class="max-w-3xl mx-auto space-y-6">

    {# Mevcut Versiyon #}
    <div class="bg-white rounded-xl shadow-sm border p-6">
        <div class="flex items-center justify-between">
            <div>
                <h3 class="text-lg font-bold text-gray-900">Mevcut Versiyon</h3>
                <p class="text-3xl font-black text-primary-600 mt-1">v{{ currentVersion }}</p>
            </div>
            <div>
                <form method="post" action="{{ path('admin_updates_check') }}">
                    <input type="hidden" name="_token" value="{{ csrf_token('update_check') }}">
                    <button type="submit" class="inline-flex items-center px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 transition text-sm font-medium">
                        <i class="fas fa-sync-alt mr-2"></i> Güncelleme Kontrol Et
                    </button>
                </form>
            </div>
        </div>

        {% if installation and installation.lastUpdateCheck %}
            <p class="text-xs text-gray-400 mt-3">
                <i class="fas fa-clock mr-1"></i> Son kontrol: {{ installation.lastUpdateCheck|date('d.m.Y H:i') }}
            </p>
        {% endif %}
    </div>

    {# Güncelleme Mevcut #}
    {% if availableUpdate %}
        <div class="bg-gradient-to-r from-primary-50 to-blue-50 rounded-xl shadow-sm border border-primary-200 p-6">
            <div class="flex items-start gap-4">
                <div class="w-12 h-12 bg-primary-100 rounded-xl flex items-center justify-center flex-shrink-0">
                    <i class="fas fa-arrow-up text-primary-600 text-xl"></i>
                </div>
                <div class="flex-1">
                    <h3 class="text-lg font-bold text-gray-900">Yeni Güncelleme Mevcut!</h3>
                    <p class="text-sm text-gray-600 mt-1">
                        v{{ currentVersion }} → <span class="font-bold text-primary-600">v{{ availableUpdate.latest_version }}</span>
                    </p>

                    {% if availableUpdate.file_size is defined %}
                        <p class="text-xs text-gray-400 mt-1">
                            <i class="fas fa-file-archive mr-1"></i> {{ (availableUpdate.file_size / 1048576)|round(1) }} MB
                            {% if availableUpdate.required_php is defined %}
                                &middot; PHP {{ availableUpdate.required_php }}+ gerekli
                            {% endif %}
                        </p>
                    {% endif %}

                    {# Changelog #}
                    {% if availableUpdate.changelog is defined and availableUpdate.changelog %}
                        <div class="mt-4 space-y-3">
                            {% for entry in availableUpdate.changelog %}
                                <div class="bg-white/60 rounded-lg p-3">
                                    <div class="flex items-center gap-2 mb-1">
                                        <span class="text-xs font-bold text-primary-600 bg-primary-100 px-2 py-0.5 rounded">v{{ entry.version }}</span>
                                        <span class="text-xs text-gray-400">{{ entry.date }}</span>
                                    </div>
                                    <ul class="text-sm text-gray-600 space-y-0.5">
                                        {% for change in entry.changes %}
                                            <li class="flex items-start gap-1.5">
                                                <i class="fas fa-check text-green-500 text-xs mt-1"></i>
                                                <span>{{ change }}</span>
                                            </li>
                                        {% endfor %}
                                    </ul>
                                </div>
                            {% endfor %}
                        </div>
                    {% endif %}

                    <div class="mt-4">
                        <form method="post" action="{{ path('admin_updates_apply') }}"
                              onsubmit="this.querySelector('button').disabled=true; this.querySelector('button').innerHTML='<i class=\'fas fa-spinner fa-spin mr-2\'></i> Güncelleniyor...';">
                            <input type="hidden" name="_token" value="{{ csrf_token('update_apply') }}">
                            <button type="submit" class="inline-flex items-center px-6 py-2.5 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition text-sm font-semibold shadow-sm">
                                <i class="fas fa-download mr-2"></i> Güncellemeyi Uygula
                            </button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    {% else %}
        <div class="bg-green-50 rounded-xl shadow-sm border border-green-200 p-6 text-center">
            <div class="w-12 h-12 bg-green-100 rounded-xl flex items-center justify-center mx-auto mb-3">
                <i class="fas fa-check-circle text-green-600 text-xl"></i>
            </div>
            <h3 class="text-lg font-bold text-gray-900">Sisteminiz Güncel</h3>
            <p class="text-sm text-gray-500 mt-1">En son sürümü kullanıyorsunuz.</p>
        </div>
    {% endif %}

    {# Bilgi #}
    <div class="bg-amber-50 rounded-xl border border-amber-200 p-4">
        <div class="flex gap-3">
            <i class="fas fa-info-circle text-amber-500 mt-0.5"></i>
            <div class="text-sm text-amber-800">
                <p class="font-medium">Güncelleme Hakkında</p>
                <ul class="mt-1 space-y-0.5 text-amber-700">
                    <li>• Güncelleme öncesi otomatik yedek alınır</li>
                    <li>• Özel ayarlarınız ve verileriniz korunur</li>
                    <li>• Güncelleme sırasında site kısa süre erişilemez olabilir</li>
                    <li>• Sorun olursa yedekten geri dönülebilir</li>
                </ul>
            </div>
        </div>
    </div>

</div>
{% endblock %}
