<div class="p-4 bg-white block sm:flex items-center justify-between border-b border-gray-200 lg:mt-1.5">
  <div class="w-full mb-1">
    <div class="mb-4">
      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl">All Page Parts (Cross-Tenant)</h1>
      <p class="text-sm text-gray-600">Showing up to 100 most recent page parts</p>
    </div>
  </div>
</div>

<div class="flex flex-col">
  <div class="overflow-x-auto">
    <div class="inline-block min-w-full align-middle">
      <div class="overflow-hidden shadow">
        <table class="min-w-full divide-y divide-gray-200">
          <thead class="bg-gray-100">
            <tr>
              <th class="p-4 text-xs font-medium text-left text-gray-500 uppercase">Key</th>
              <th class="p-4 text-xs font-medium text-left text-gray-500 uppercase">Page Slug</th>
              <th class="p-4 text-xs font-medium text-left text-gray-500 uppercase">Website</th>
              <th class="p-4 text-xs font-medium text-left text-gray-500 uppercase">Created</th>
              <th class="p-4 text-xs font-medium text-left text-gray-500 uppercase">Actions</th>
            </tr>
          </thead>
          <tbody class="bg-white divide-y divide-gray-200">
            <% @page_parts.each do |part| %>
              <tr class="hover:bg-gray-100">
                <td class="p-4 text-sm font-medium text-gray-900">
                  <%= link_to part.page_part_key, tenant_admin_page_part_path(part), class: "text-blue-600 hover:underline" %>
                </td>
                <td class="p-4 text-sm text-gray-500">
                  <%= part.page_slug || "N/A" %>
                </td>
                <td class="p-4 text-sm text-gray-500">
                  <%= part.website&.subdomain || "Global/N/A" %>
                </td>
                <td class="p-4 text-sm text-gray-500">
                  <%= time_ago_in_words(part.created_at) %> ago
                </td>
                <td class="p-4">
                  <%= link_to "View", tenant_admin_page_part_path(part), class: "inline-flex items-center px-3 py-2 text-sm font-medium text-center text-white rounded-lg bg-blue-600 hover:bg-blue-700" %>
                </td>
              </tr>
            <% end %>
            <% if @page_parts.empty? %>
              <tr>
                <td colspan="5" class="p-8 text-center text-gray-500">No page parts found</td>
              </tr>
            <% end %>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
