@extends('layouts.admin')

@section('title', 'Restore Database')

@section('content')
<div class="container-fluid">
    <!-- Page Header -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h1 class="h3 mb-0 text-gray-800">Restore Database</h1>
            <p class="text-muted">Restore database from backup file</p>
        </div>
        <div>
            <a href="{{ route('admin.database-backup.index') }}" class="btn btn-outline-secondary">
                <i class="fas fa-arrow-left me-2"></i>Back to Dashboard
            </a>
        </div>
    </div>

    <!-- Requirements Check -->
    @if(!empty($requirements))
        <div class="alert alert-danger mb-4">
            <h6 class="alert-heading"><i class="fas fa-exclamation-triangle me-2"></i>System Requirements</h6>
            <ul class="mb-0">
                @foreach($requirements as $requirement)
                    <li>{{ $requirement }}</li>
                @endforeach
            </ul>
            <hr>
            <p class="mb-0">Please resolve these issues before attempting a restore.</p>
        </div>
    @endif

    <!-- Warning Alert -->
    <div class="alert alert-warning mb-4">
        <h6 class="alert-heading"><i class="fas fa-exclamation-triangle me-2"></i>Important Warning</h6>
        <p class="mb-2">Database restore is a <strong>destructive operation</strong> that will:</p>
        <ul class="mb-2">
            <li>Replace all current data with backup data</li>
            <li>Potentially cause data loss if not used carefully</li>
            <li>Require application downtime during the process</li>
        </ul>
        <p class="mb-0">It is <strong>highly recommended</strong> to create a backup before restoring.</p>
    </div>

    <div class="row">
        <!-- Restore from Existing Backup -->
        <div class="col-lg-6">
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">Restore from Existing Backup</h6>
                </div>
                <div class="card-body">
                    @if($backups->count() > 0)
                        <form method="POST" action="{{ route('admin.database-backup.restore-from-backup') }}" 
                              id="restoreExistingForm" onsubmit="return confirmRestore('existing')">
                            @csrf
                            
                            <div class="mb-3">
                                <label for="backup_id" class="form-label">Select Backup <span class="text-danger">*</span></label>
                                <select class="form-select" id="backup_id" name="backup_id" required onchange="updateBackupInfo()">
                                    <option value="">Choose a backup...</option>
                                    @foreach($backups as $backup)
                                    <option value="{{ $backup->id }}" 
                                            data-size="{{ $backup->formatted_file_size }}"
                                            data-created="{{ $backup->created_at->format('M d, Y H:i') }}"
                                            data-tables="{{ $backup->tables_included ? count($backup->tables_included) : 'All' }}"
                                            data-description="{{ $backup->description }}">
                                        {{ $backup->name }} ({{ $backup->created_at->format('M d, Y') }})
                                    </option>
                                    @endforeach
                                </select>
                            </div>

                            <div id="backupInfo" style="display: none;" class="mb-3">
                                <div class="card bg-light">
                                    <div class="card-body">
                                        <h6 class="card-title">Backup Information</h6>
                                        <div class="row">
                                            <div class="col-sm-6"><strong>Size:</strong></div>
                                            <div class="col-sm-6" id="backupSize">-</div>
                                        </div>
                                        <div class="row">
                                            <div class="col-sm-6"><strong>Created:</strong></div>
                                            <div class="col-sm-6" id="backupCreated">-</div>
                                        </div>
                                        <div class="row">
                                            <div class="col-sm-6"><strong>Tables:</strong></div>
                                            <div class="col-sm-6" id="backupTables">-</div>
                                        </div>
                                        <div class="row" id="backupDescriptionRow" style="display: none;">
                                            <div class="col-sm-6"><strong>Description:</strong></div>
                                            <div class="col-sm-6" id="backupDescription">-</div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="mb-3">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" id="create_backup_before_restore_existing" 
                                           name="create_backup_before_restore" value="1" checked>
                                    <label class="form-check-label" for="create_backup_before_restore_existing">
                                        Create backup before restore (Recommended)
                                    </label>
                                    <div class="form-text">This will create a backup of the current database before restoring</div>
                                </div>
                            </div>

                            <div class="mb-3">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" id="drop_existing_tables_existing" 
                                           name="drop_existing_tables" value="1">
                                    <label class="form-check-label" for="drop_existing_tables_existing">
                                        Drop existing tables before restore
                                    </label>
                                    <div class="form-text text-warning">
                                        <i class="fas fa-exclamation-triangle me-1"></i>
                                        This will completely remove all existing tables
                                    </div>
                                </div>
                            </div>

                            <div class="mb-3">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" id="confirmation_existing" 
                                           name="confirmation" value="1" required>
                                    <label class="form-check-label" for="confirmation_existing">
                                        I understand the risks and want to proceed with the restore
                                    </label>
                                </div>
                            </div>

                            <button type="submit" class="btn btn-warning w-100" 
                                    {{ !empty($requirements) ? 'disabled' : '' }}>
                                <i class="fas fa-undo me-2"></i>Restore from Selected Backup
                            </button>
                        </form>
                    @else
                        <div class="text-center py-4">
                            <i class="fas fa-database fa-3x text-muted mb-3"></i>
                            <h6 class="text-muted">No Backups Available</h6>
                            <p class="text-muted">Create a backup first before you can restore.</p>
                            <a href="{{ route('admin.database-backup.create') }}" class="btn btn-primary">
                                <i class="fas fa-plus me-2"></i>Create Backup
                            </a>
                        </div>
                    @endif
                </div>
            </div>
        </div>

        <!-- Restore from Uploaded File -->
        <div class="col-lg-6">
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">Restore from Uploaded File</h6>
                </div>
                <div class="card-body">
                    <form method="POST" action="{{ route('admin.database-backup.restore-from-file') }}" 
                          enctype="multipart/form-data" id="restoreUploadForm" onsubmit="return confirmRestore('upload')">
                        @csrf
                        
                        <div class="mb-3">
                            <label for="backup_file" class="form-label">Backup File <span class="text-danger">*</span></label>
                            <input type="file" class="form-control @error('backup_file') is-invalid @enderror" 
                                   id="backup_file" name="backup_file" accept=".sql,.gz" required onchange="updateFileInfo()">
                            @error('backup_file')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                            <div class="form-text">
                                Accepted formats: .sql, .sql.gz (Max size: 500MB)
                            </div>
                        </div>

                        <div id="fileInfo" style="display: none;" class="mb-3">
                            <div class="card bg-light">
                                <div class="card-body">
                                    <h6 class="card-title">File Information</h6>
                                    <div class="row">
                                        <div class="col-sm-6"><strong>Filename:</strong></div>
                                        <div class="col-sm-6" id="fileName">-</div>
                                    </div>
                                    <div class="row">
                                        <div class="col-sm-6"><strong>Size:</strong></div>
                                        <div class="col-sm-6" id="fileSize">-</div>
                                    </div>
                                    <div class="row">
                                        <div class="col-sm-6"><strong>Type:</strong></div>
                                        <div class="col-sm-6" id="fileType">-</div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="mb-3">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" id="create_backup_before_restore_upload" 
                                       name="create_backup_before_restore" value="1" checked>
                                <label class="form-check-label" for="create_backup_before_restore_upload">
                                    Create backup before restore (Recommended)
                                </label>
                                <div class="form-text">This will create a backup of the current database before restoring</div>
                            </div>
                        </div>

                        <div class="mb-3">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" id="drop_existing_tables_upload" 
                                       name="drop_existing_tables" value="1">
                                <label class="form-check-label" for="drop_existing_tables_upload">
                                    Drop existing tables before restore
                                </label>
                                <div class="form-text text-warning">
                                    <i class="fas fa-exclamation-triangle me-1"></i>
                                    This will completely remove all existing tables
                                </div>
                            </div>
                        </div>

                        <div class="mb-3">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" id="confirmation_upload" 
                                       name="confirmation" value="1" required>
                                <label class="form-check-label" for="confirmation_upload">
                                    I understand the risks and want to proceed with the restore
                                </label>
                            </div>
                        </div>

                        <button type="submit" class="btn btn-warning w-100" 
                                {{ !empty($requirements) ? 'disabled' : '' }}>
                            <i class="fas fa-upload me-2"></i>Restore from Uploaded File
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- Restore Process Information -->
    <div class="card shadow">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold text-primary">Restore Process Information</h6>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-6">
                    <h6 class="text-primary">What happens during restore:</h6>
                    <ul class="list-unstyled">
                        <li><i class="fas fa-check text-success me-2"></i>Backup file is validated</li>
                        <li><i class="fas fa-check text-success me-2"></i>Current database is backed up (if selected)</li>
                        <li><i class="fas fa-check text-success me-2"></i>Existing tables are dropped (if selected)</li>
                        <li><i class="fas fa-check text-success me-2"></i>Backup data is imported</li>
                        <li><i class="fas fa-check text-success me-2"></i>Database integrity is verified</li>
                    </ul>
                </div>
                <div class="col-md-6">
                    <h6 class="text-warning">Important considerations:</h6>
                    <ul class="list-unstyled">
                        <li><i class="fas fa-exclamation-triangle text-warning me-2"></i>Application will be unavailable during restore</li>
                        <li><i class="fas fa-exclamation-triangle text-warning me-2"></i>Process may take several minutes</li>
                        <li><i class="fas fa-exclamation-triangle text-warning me-2"></i>All current data will be replaced</li>
                        <li><i class="fas fa-exclamation-triangle text-warning me-2"></i>Users will be logged out</li>
                        <li><i class="fas fa-exclamation-triangle text-warning me-2"></i>Always test in staging first</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
function updateBackupInfo() {
    const select = document.getElementById('backup_id');
    const info = document.getElementById('backupInfo');
    const option = select.selectedOptions[0];
    
    if (option && option.value) {
        document.getElementById('backupSize').textContent = option.dataset.size;
        document.getElementById('backupCreated').textContent = option.dataset.created;
        document.getElementById('backupTables').textContent = option.dataset.tables + ' tables';
        
        const description = option.dataset.description;
        if (description) {
            document.getElementById('backupDescription').textContent = description;
            document.getElementById('backupDescriptionRow').style.display = 'flex';
        } else {
            document.getElementById('backupDescriptionRow').style.display = 'none';
        }
        
        info.style.display = 'block';
    } else {
        info.style.display = 'none';
    }
}

function updateFileInfo() {
    const fileInput = document.getElementById('backup_file');
    const info = document.getElementById('fileInfo');
    
    if (fileInput.files.length > 0) {
        const file = fileInput.files[0];
        
        document.getElementById('fileName').textContent = file.name;
        document.getElementById('fileSize').textContent = formatFileSize(file.size);
        document.getElementById('fileType').textContent = file.name.endsWith('.gz') ? 'Compressed SQL' : 'SQL';
        
        info.style.display = 'block';
    } else {
        info.style.display = 'none';
    }
}

function formatFileSize(bytes) {
    const units = ['B', 'KB', 'MB', 'GB'];
    let size = bytes;
    let unitIndex = 0;
    
    while (size >= 1024 && unitIndex < units.length - 1) {
        size /= 1024;
        unitIndex++;
    }
    
    return size.toFixed(2) + ' ' + units[unitIndex];
}

function confirmRestore(type) {
    const message = type === 'existing' 
        ? 'Are you sure you want to restore the database from the selected backup? This will replace all current data.'
        : 'Are you sure you want to restore the database from the uploaded file? This will replace all current data.';
    
    if (!confirm(message)) {
        return false;
    }
    
    // Show loading state
    const form = type === 'existing' ? document.getElementById('restoreExistingForm') : document.getElementById('restoreUploadForm');
    const button = form.querySelector('button[type="submit"]');
    
    button.disabled = true;
    button.innerHTML = '<i class="fas fa-spinner fa-spin me-2"></i>Restoring Database...';
    
    // Show progress message
    const alert = document.createElement('div');
    alert.className = 'alert alert-warning mt-3';
    alert.innerHTML = '<i class="fas fa-exclamation-triangle me-2"></i><strong>Restore in progress!</strong> Please do not close this page or navigate away. This process may take several minutes.';
    form.appendChild(alert);
    
    return true;
}

// Prevent accidental page navigation during restore
let restoreInProgress = false;

document.getElementById('restoreExistingForm').addEventListener('submit', function() {
    restoreInProgress = true;
});

document.getElementById('restoreUploadForm').addEventListener('submit', function() {
    restoreInProgress = true;
});

window.addEventListener('beforeunload', function(e) {
    if (restoreInProgress) {
        e.preventDefault();
        e.returnValue = 'Database restore is in progress. Are you sure you want to leave?';
        return e.returnValue;
    }
});
</script>
@endsection