<div class="container mx-auto px-4 py-8">
  <details class="mb-3 bg-white border rounded p-3">
    <summary class="cursor-pointer fw-semibold">Bu sayfa ne işe yarar? Nasıl kullanırım?</summary>
    <div class="mt-2 small text-muted">
      <p><b>Kanalı Düzenle</b> sayfasında ad, Chat ID ve token güncelleyebilir; sahipliği devredebilir ve paylaşım erişimlerini yönetebilirsiniz.</p>
      <p><b>Erişim seviyeleri</b>: <code>view</code> (görüntüle), <code>edit</code> (gönderi oluştur/düzenle), <code>manage</code> (kanalı yönet).</p>
      <p><b>Yetkiler</b>: Yöneticiler veya kanal sahibi yönetebilir; diğer kullanıcılar paylaşılan seviyeye göre işlem yapar.</p>
    </div>
  </details>
  <h1 class="text-2xl font-bold mb-4">Kanalı Düzenle</h1>

  <% if (errors && errors.length) { %>
    <div class="alert alert-error shadow-sm mb-4">
      <ul class="list-disc list-inside">
        <% errors.forEach(function(e){ %>
          <li><%= e.msg %></li>
        <% }) %>
      </ul>
    </div>
  <% } %>

  <form action="/channels/<%= channel.id %>/edit?_csrf=<%= csrfToken %>" method="post" class="max-w-xl bg-white shadow rounded p-6 mb-6">
    <input type="hidden" name="_csrf" value="<%= csrfToken %>">

    <div class="mb-4">
      <label class="block text-sm font-medium mb-1">Kanal Adı</label>
      <input class="input input-bordered w-full" type="text" name="name" value="<%= channel.name %>" required>
    </div>

    <div class="mb-4">
      <label class="block text-sm font-medium mb-1">Chat ID</label>
      <input class="input input-bordered w-full" type="text" name="chat_id" value="<%= channel.chat_id %>" required>
      <div class="text-xs text-gray-500 mt-1">Örn: -1001234567890</div>
    </div>

    <div class="mb-6">
      <label class="block text-sm font-medium mb-1">Bot Token (Opsiyonel)</label>
      <input class="input input-bordered w-full" type="text" name="bot_token" placeholder="Yeni token girerseniz güncellenecektir">
      <div class="text-xs text-gray-500 mt-1">Boş bırakırsanız token değişmez.</div>
    </div>

    <div class="flex gap-2 justify-end">
      <a class="btn" href="/channels">Geri</a>
      <button class="btn btn-primary" type="submit">Güncelle</button>
    </div>
  </form>

  <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
    <div class="bg-white rounded shadow">
      <div class="border-b px-4 py-2 font-medium">Sahipliği Devret</div>
      <div class="p-4">
        <form action="/channels/<%= channel.id %>/transfer?_csrf=<%= csrfToken %>" method="post" class="max-w-md">
          <input type="hidden" name="_csrf" value="<%= csrfToken %>">
          <div class="mb-3">
            <label class="block text-sm font-medium mb-1">Hedef Kullanıcı Adı</label>
            <input class="input input-bordered w-full" type="text" name="target_username" placeholder="kullaniciadi" required>
          </div>
          <button class="btn btn-warning" type="submit">Sahipliği Devret</button>
        </form>
      </div>
    </div>
    <div class="bg-white rounded shadow">
      <div class="border-b px-4 py-2 font-medium">Paylaşım Ekle/Güncelle</div>
      <div class="p-4">
        <form action="/channels/<%= channel.id %>/share?_csrf=<%= csrfToken %>" method="post" class="grid grid-cols-1 md:grid-cols-12 gap-3 items-end max-w-xl">
          <input type="hidden" name="_csrf" value="<%= csrfToken %>">
          <div class="md:col-span-6">
            <label class="block text-sm font-medium mb-1">Kullanıcı Adı</label>
            <input class="input input-bordered w-full" type="text" name="username" placeholder="kullaniciadi" required>
          </div>
          <div class="md:col-span-4">
            <label class="block text-sm font-medium mb-1">Seviye</label>
            <select name="access_level" class="select select-bordered w-full">
              <option value="view">Görüntüle</option>
              <option value="edit" selected>Düzenle</option>
              <option value="manage">Yönet</option>
            </select>
          </div>
          <div class="md:col-span-2">
            <button class="btn btn-success w-full" type="submit">Kaydet</button>
          </div>
        </form>
      </div>
    </div>
  </div>

  <div class="bg-white rounded shadow mt-6">
    <div class="border-b px-4 py-2 font-medium">Paylaşım Listesi</div>
    <div class="p-4">
      <% if (Array.isArray(accessList) && accessList.length) { %>
        <div class="overflow-x-auto">
          <table class="table table-zebra w-full">
            <thead class="bg-gray-50">
              <tr>
                <th class="px-3">Kullanıcı</th>
                <th class="px-3">Erişim</th>
                <th class="px-3">Eklenme</th>
                <th class="px-3"></th>
              </tr>
            </thead>
            <tbody>
              <% accessList.forEach(function(a){ %>
                <tr>
                  <td class="px-3 py-2"><%= a.username %></td>
                  <td class="px-3 py-2"><span class="badge badge-ghost text-uppercase"><%= a.access_level %></span></td>
                  <td class="px-3 py-2"><%= new Date(a.created_at).toLocaleString('tr-TR') %></td>
                  <td class="px-3 py-2">
                    <form action="/channels/<%= channel.id %>/unshare?_csrf=<%= csrfToken %>" method="post" onsubmit="return confirm('Erişimi kaldırmak istiyor musunuz?')" class="inline">
                      <input type="hidden" name="_csrf" value="<%= csrfToken %>">
                      <input type="hidden" name="user_id" value="<%= a.user_id %>">
                      <button class="btn btn-xs btn-error" type="submit">Kaldır</button>
                    </form>
                  </td>
                </tr>
              <% }) %>
            </tbody>
          </table>
        </div>
      <% } else { %>
        <div class="text-gray-500">Bu kanalı paylaşmış olduğunuz kullanıcı yok.</div>
      <% } %>
    </div>
  </div>
</div>
