{% for job in jobs %}
<tr hx-get="{{ url_for('jobs.jobdetails', job_id=job.id) }}" hx-target="#details-{{ job.id }}" hx-swap="innerHTML" data-expanded="false" onclick="toggleDetails('{{ job.id }}')" id="job-row-{{ job.id }}">
    <td class="px-6 py-4 border-b border-gray-300 text-sm truncate">{{ job.id }}</td>
    <td class="px-6 py-4 border-b border-gray-300 text-sm truncate">{{ job.name }}</td>
    <td class="px-6 py-4 border-b border-gray-300 text-sm truncate">{{ job.trigger }}</td>
    <td class="px-6 py-4 border-b border-gray-300 text-sm truncate">{{ job.next_run_time }}</td>
    {% if debug %}
    <td class="px-6 py-4 border-b border-gray-300 text-sm">
        <button hx-delete="/jobs?job_id={{ job.id }}" hx-target="#jobs-body" hx-swap="innerHTML" class="bg-red-500 text-white p-2 rounded">Delete</button>
    </td>
    {% endif %}
</tr>
<tr id="details-{{ job.id }}" class="hidden transition-all duration-300 ease-in-out"></tr>
{% endfor %}
