@extends('layouts.dashboard')
@section('title', t('إدارة الكاش','Cache Manager'))
@section('page-title','🗄️ '.t('إدارة التخزين المؤقت','Cache Manager'))

@section('content')
<div id="cache-msg" style="display:none;padding:14px;border-radius:10px;margin-bottom:16px;font-weight:600"></div>

<div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-bottom:28px">

  @foreach([
    ['views',     '🖼️', t('Views Cache','Views Cache'),     t('صفحات Blade المُحوَّلة','Compiled Blade views'),       $cacheInfo['views'].' '.t('ملفات','files')],
    ['bootstrap', '⚙️', t('Bootstrap Cache','Bootstrap Cache'), t('ملفات التشغيل الأساسية','Core bootstrap files'),  $cacheInfo['bootstrap'].' '.t('ملفات','files')],
    ['data',      '📦', t('Data Cache','Data Cache'),       t('بيانات مؤقتة متنوعة','Various cached data'),           '—'],
    ['logs',      '📋', t('Laravel Log','Laravel Log'),     t('سجل أخطاء التطبيق','Application error log'),           $cacheInfo['log_size']],
  ] as [$type, $icon, $name, $desc, $size])
  <div style="background:#fff;border:1.5px solid #e2e8f0;border-radius:14px;padding:20px">
    <div style="display:flex;align-items:center;gap:12px;margin-bottom:14px">
      <div style="width:46px;height:46px;background:#f1f5f9;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:24px">{{ $icon }}</div>
      <div>
        <div style="font-weight:700;font-size:15px">{{ $name }}</div>
        <div style="font-size:12px;color:#94a3b8">{{ $desc }}</div>
      </div>
    </div>
    <div style="display:flex;align-items:center;justify-content:space-between">
      <span style="font-size:13px;color:#64748b;background:#f8fafc;padding:4px 12px;border-radius:6px">{{ $size }}</span>
      <button onclick="clearCache('{{ $type }}')" class="btn btn-sm" style="background:#fef2f2;color:#dc2626;border:1px solid #fecaca">
        🗑️ {{ t('مسح','Clear') }}
      </button>
    </div>
  </div>
  @endforeach
</div>

{{-- Clear All --}}
<div style="background:linear-gradient(135deg,#fff7ed,#fef3c7);border:1.5px solid #fde68a;border-radius:14px;padding:24px;text-align:center;margin-bottom:20px">
  <div style="font-size:32px;margin-bottom:8px">⚠️</div>
  <h3 style="margin-bottom:6px">{{ t('مسح كل الكاش دفعة واحدة','Clear All Cache at Once') }}</h3>
  <p style="color:#92400e;font-size:14px;margin-bottom:16px">{{ t('سيتم إعادة بناء الكاش تلقائياً عند أول طلب','Cache will be rebuilt automatically on next request') }}</p>
  <button onclick="clearCache('all')" class="btn btn-lg" style="background:#dc2626;color:#fff;border:none;min-width:200px">
    🗑️ {{ t('مسح كل التخزين المؤقت','Clear All Cache') }}
  </button>
</div>

{{-- Laravel Log Viewer --}}
<div class="card">
  <div class="card-header">
    <h3>📋 {{ t('آخر أخطاء Laravel','Latest Laravel Errors') }}</h3>
    <button onclick="clearCache('logs')" class="btn btn-sm btn-outline">🗑️ {{ t('مسح اللوج','Clear Log') }}</button>
  </div>
  <div style="padding:16px">
    @php
      $logFile = storage_path('logs/laravel.log');
      $logContent = '';
      if (file_exists($logFile) && filesize($logFile) > 0) {
          $lines = array_slice(file($logFile) ?: [], -50);
          $logContent = implode('', $lines);
      }
    @endphp
    @if($logContent)
    <pre style="background:#1e293b;color:#94a3b8;padding:16px;border-radius:10px;font-size:11px;max-height:400px;overflow-y:auto;white-space:pre-wrap;word-break:break-all">{{ $logContent }}</pre>
    @else
    <div style="text-align:center;padding:24px;color:#94a3b8">✅ {{ t('السجل فارغ — لا يوجد أخطاء','Log is empty — no errors') }}</div>
    @endif
  </div>
</div>
@endsection

@section('scripts')
<script>
function clearCache(type) {
  var msg = document.getElementById('cache-msg');
  fetch('/admin/cache/clear', {
    method: 'POST',
    headers: {
      'X-CSRF-TOKEN': '{{ csrf_token() }}',
      'Accept': 'application/json',
      'Content-Type': 'application/json',
      'X-Requested-With': 'XMLHttpRequest'
    },
    body: JSON.stringify({ type: type })
  })
  .then(r => r.json())
  .then(data => {
    msg.style.display = 'block';
    msg.style.background = data.success ? '#f0fdf4' : '#fef2f2';
    msg.style.color      = data.success ? '#16a34a' : '#dc2626';
    msg.style.border     = data.success ? '1px solid #bbf7d0' : '1px solid #fecaca';
    msg.textContent = data.message;
    window.scrollTo(0,0);
    if (data.success) setTimeout(() => location.reload(), 1500);
  })
  .catch(err => {
    msg.style.display = 'block';
    msg.style.background = '#fef2f2';
    msg.style.color = '#dc2626';
    msg.textContent = '❌ ' + err;
  });
}
</script>
@endsection