{extends file="layout.tpl"}

{block name="content"}
<div class="container-fluid">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h4 class="mb-1">Aktualizacje</h4>
            <p class="text-muted mb-0">Sprawdź dostępność nowych wersji</p>
        </div>
    </div>

    <div class="row">
        <div class="col-lg-6">
            <div class="card mb-4">
                <div class="card-header">
                    <h5 class="card-title mb-0"><i class="bi bi-info-circle me-2"></i>Aktualna wersja</h5>
                </div>
                <div class="card-body">
                    <div class="d-flex align-items-center">
                        <div class="display-4 text-primary me-3">
                            <i class="bi bi-box-seam"></i>
                        </div>
                        <div>
                            <h2 class="mb-0">v{$currentVersion}</h2>
                            <p class="text-muted mb-0">Zainstalowana wersja systemu</p>
                        </div>
                    </div>
                </div>
            </div>
            
            {if $updateAvailable}
            <div class="card border-success mb-4">
                <div class="card-header bg-success text-white">
                    <h5 class="card-title mb-0"><i class="bi bi-download me-2"></i>Dostępna aktualizacja!</h5>
                </div>
                <div class="card-body">
                    <div class="d-flex align-items-center mb-3">
                        <div class="display-4 text-success me-3">
                            <i class="bi bi-arrow-up-circle"></i>
                        </div>
                        <div>
                            <h2 class="mb-0 text-success">v{$latestVersion.version}</h2>
                            <p class="text-muted mb-0">
                                Data wydania: {$latestVersion.release_date}
                            </p>
                        </div>
                    </div>
                    <div class="alert alert-info">
                        <i class="bi bi-info-circle me-2"></i>
                        Aby zaktualizować system, pobierz najnowszą wersję z repozytorium i zastąp pliki.
                    </div>
                </div>
            </div>
            {else}
            <div class="card border-success mb-4">
                <div class="card-body text-center py-4">
                    <i class="bi bi-check-circle text-success" style="font-size: 3rem;"></i>
                    <h4 class="mt-3 text-success">System aktualny!</h4>
                    <p class="text-muted mb-0">Masz zainstalowaną najnowszą wersję.</p>
                </div>
            </div>
            {/if}
        </div>
        
        <div class="col-lg-6">
            <div class="card">
                <div class="card-header">
                    <h5 class="card-title mb-0"><i class="bi bi-journal-text me-2"></i>Historia zmian</h5>
                </div>
                <div class="card-body p-0">
                    <div class="accordion" id="changelogAccordion">
                        {foreach $changelog as $version => $changes}
                        <div class="accordion-item">
                            <h2 class="accordion-header">
                                <button class="accordion-button {if !$changes@first}collapsed{/if}" type="button" 
                                        data-bs-toggle="collapse" 
                                        data-bs-target="#changelog-{$changes@index}">
                                    <span class="badge bg-primary me-2">v{$version}</span>
                                    {if $version == $currentVersion}
                                    <span class="badge bg-success">Zainstalowana</span>
                                    {/if}
                                </button>
                            </h2>
                            <div id="changelog-{$changes@index}" 
                                 class="accordion-collapse collapse {if $changes@first}show{/if}"
                                 data-bs-parent="#changelogAccordion">
                                <div class="accordion-body">
                                    <ul class="mb-0">
                                        {foreach $changes as $change}
                                        <li>{$change}</li>
                                        {/foreach}
                                    </ul>
                                </div>
                            </div>
                        </div>
                        {/foreach}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}
