<?php
namespace FuseCommerce\Views\Admin\Settings;
if ( ! defined( 'ABSPATH' ) ) exit;

use FuseCommerce\Views\Admin\Settings\BaseView;
use FuseCommerce\Views\Admin\Settings\IView;

class Indexing extends BaseView implements IView {

    public function render(): void {
        ?>
            <!-- Product Indexing Section -->
            <div class="card mb-4">
                <div class="card-header">
                    <h5 class="mb-0"><?php esc_html_e('Product Indexing', 'ftlcommerce-instant-product-search'); ?></h5>
                </div>
                <div class="card-body">
                    <div id="indexing-status-container">
                        <!-- Status will be loaded via AJAX -->
                        <div class="d-flex align-items-center">
                            <div class="spinner-border spinner-border-sm me-2" role="status">
                                <span class="visually-hidden"><?php esc_html_e('Loading...', 'ftlcommerce-instant-product-search'); ?></span>
                            </div>
                            <span><?php esc_html_e('Loading status...', 'ftlcommerce-instant-product-search'); ?></span>
                        </div>
                    </div>

                    <div class="mt-3">
                        <button type="button" class="btn btn-primary index-prod-btn me-2" id="btn-index-products">
                            <?php esc_html_e('Index Products', 'ftlcommerce-instant-product-search'); ?>
                        </button>
                        <button type="button" class="btn btn-warning me-2" id="btn-reset-index">
                            <?php esc_html_e('Reset Process', 'ftlcommerce-instant-product-search'); ?>
                        </button>
                        <button type="button" class="btn btn-secondary" id="btn-refresh-status">
                            <?php esc_html_e('Refresh Status', 'ftlcommerce-instant-product-search'); ?>
                        </button>
                    </div>

                    <div id="indexing-files-container" class="mt-3" style="display:none;">
                        <h6><?php esc_html_e('Index Files:', 'ftlcommerce-instant-product-search'); ?></h6>
                        <ul class="list-group">
                            <li class="list-group-item" id="file-products" style="display:none;">
                                <div class="d-flex justify-content-between align-items-center">
                                    <span class="file-label"><?php esc_html_e('Products JSON', 'ftlcommerce-instant-product-search'); ?></span>
                                    <a href="#" class="btn btn-sm btn-link" target="_blank"><?php esc_html_e('View', 'ftlcommerce-instant-product-search'); ?></a>
                                </div>
                                <div class="alert alert-info mt-1" role="alert">
                                    <?php esc_html_e("It's recommended that the product JSON not exceed 5MB.", 'ftlcommerce-instant-product-search'); ?>
                                </div>
                            </li>
                            <li class="list-group-item d-flex justify-content-between align-items-center" id="file-categories" style="display:none;">
                                <span class="file-label"><?php esc_html_e('Categories JSON', 'ftlcommerce-instant-product-search'); ?></span>
                                <a href="#" class="btn btn-sm btn-link" target="_blank"><?php esc_html_e('View', 'ftlcommerce-instant-product-search'); ?></a>
                            </li>
                            <li class="list-group-item d-flex justify-content-between align-items-center" id="file-attributes" style="display:none;">
                                <span class="file-label"><?php esc_html_e('Attributes JSON', 'ftlcommerce-instant-product-search'); ?></span>
                                <a href="#" class="btn btn-sm btn-link" target="_blank"><?php esc_html_e('View', 'ftlcommerce-instant-product-search'); ?></a>
                            </li>
                            <li class="list-group-item d-flex justify-content-between align-items-center" id="file-tags" style="display:none;">
                                <span class="file-label"><?php esc_html_e('Tags JSON', 'ftlcommerce-instant-product-search'); ?></span>
                                <a href="#" class="btn btn-sm btn-link" target="_blank"><?php esc_html_e('View', 'ftlcommerce-instant-product-search'); ?></a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        <?php
    }
}