<?php
/**
 * Generic List Template for ListFrontEndPage
 *
 * Variables available via localized script:
 * - Actions: e.g. blog_list, blog_load, prayer_list, etc.
 */
if (!defined('ABSPATH'))
    exit;
?>

<div class="ai-list-container">
    <div id="ai-list-status" class="ai-list-status"></div>

    <div class="ai-list-header-row">
        <h2 class="ai-list-title">
            <?php echo esc_html($this->get_category()) . ' List'; ?>
        </h2>
    </div>

    <div class="ai-list-controls">
        <div class="ai-list-buttons">
            <button id="bulk-delete-btn" class="button ai-table-btn">🗑️ Delete Selected</button>
            <button id="ai-list-new-btn" class="button ai-table-btn">➕ New Item</button>
        </div>
        <div class="ai-list-search-toggle">
            <div class="ai-list-search">
                <input type="text" id="ai-list-search-keyword" placeholder="Search by keyword..." />
                <button id="ai-list-search-btn" class="button ai-table-btn">🔍</button>
            </div>
            <div class="ai-list-toggle">
                <label>
                    <input type="checkbox" id="toggle-drafts-only" checked>
                    Show Drafts Only
                </label>
            </div>
        </div>
    </div>


    <div id="ai-list">
        <table class="ai-list-table">
            <thead>
                <tr>
                    <th><input type="checkbox" id="select-all-checkbox"></th>
                    <th>Title</th>
                    <th>Last Modified</th>
                    <th>Preview</th>
                    <th class="action-col">Actions</th>
                </tr>
            </thead>
            <tbody id="ai-list-table-body"></tbody>
        </table>
    </div>

    <div id="ai-list-preview" class="ai-list-preview hidden">
        <h3 id="list-item-title"></h3>
        <div id="list-item-content" class="ai-list-item-content"></div>
        <a href="#" id="resume-item-btn" class="button ai-table-btn resume-btn">Resume / Edit</a>
    </div>
</div>