<?php
if (!defined('ABSPATH')) exit;

/**
 * List All Extras - SaaS Modern UI
 * UPDATED: Dynamic Currency Support for the Table List
 */
function afdp_all_extras_tab() {
    $extras = get_option('fd_extras', []); // Unified option key

    // --- DYNAMIC CURRENCY LOGIC ---
    $currency_code = get_option('afdp_currency', 'USD');
    $symbols = [
        'USD'=>'$', 'GBP'=>'£', 'EUR'=>'€', 'INR'=>'₹', 
        'AED'=>'د.إ', 'BDT'=>'৳', 'CAD'=>'C$', 'SAR'=>'SR'
    ];
    $currency = isset($symbols[$currency_code]) ? $symbols[$currency_code] : '$';

    // Handle deletion logic
    if (isset($_GET['delete'])) {
        $delete_id = intval($_GET['delete']);
        $nonce = $_GET['_wpnonce'] ?? '';
        if (isset($extras[$delete_id]) &&  wp_verify_nonce($nonce, 'afdp_delete_extra_' . $delete_id)) {
            unset($extras[$delete_id]);
            update_option('fd_extras', $extras);
            echo '<div class="notice notice-success is-dismissible" style="border-left-color: var(--fd-primary);"><p>Extra removed successfully.</p></div>';
        }
    }
    ?>

    <style>
        :root { 
            --fd-primary: #e53935; 
            --fd-primary-hover: #c62828;
            --fd-border: #ccd0d4; 
            --fd-text: #1d2327;
            --fd-muted: #64748b;
        }

        .afdp-dashboard { margin-top: 10px; }
        
        #fd-extras-table-container { background: #fff; border: 1px solid var(--fd-border); border-radius: 12px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.05); }
        #fd-extras-table { border: none !important; width: 100% !important; margin: 0 !important; border-collapse: collapse; }
        #fd-extras-table thead th { background: #f8f9fa; padding: 16px; font-weight: 700; color: var(--fd-muted); border-bottom: 2px solid #f0f0f1; text-transform: uppercase; font-size: 11px; text-align: left; }
        #fd-extras-table td { padding: 14px 16px; vertical-align: middle; border-bottom: 1px solid #f0f0f1; }
        
        .fd-badge { display: inline-block; padding: 4px 10px; border-radius: 6px; font-size: 11px; font-weight: 700; border: 1px solid transparent; }
        .fd-status-badge { background: #f0fdf4; color: #166534; border: 1px solid #bbf7d0; }
        .fd-out-badge { background: #fff5f5; color: var(--fd-primary); border: 1px solid #fecaca; }
        
        .btn-fd { 
            display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; 
            border-radius: 6px; font-size: 12px; font-weight: 600; text-decoration: none; 
            transition: 0.2s; cursor: pointer; border: 1px solid transparent;
        }
        .btn-fd svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.5; }

        .btn-view-fd { color: #475569; border-color: #cbd5e1; background: #fff; }
        .btn-view-fd:hover { background: #f1f5f9; color: #1e293b; }

        .btn-edit-fd { color: var(--fd-primary); border-color: var(--fd-primary); background: transparent; }
        .btn-edit-fd:hover { background: var(--fd-primary); color: #fff; }

        .btn-delete-fd { color: #fff; background: var(--fd-primary); border-color: var(--fd-primary); }
        .btn-delete-fd:hover { background: var(--fd-primary-hover); }

        .fd-item-img { border-radius: 8px; border: 1px solid #eee; object-fit: cover; width: 44px; height: 44px; }
        .fd-no-img { width: 44px; height: 44px; border-radius: 8px; background: #f8f9fa; display: flex; align-items: center; justify-content: center; color: #cbd5e1; border: 1px solid #eee; }

        .dataTables_wrapper .dataTables_filter { float: left; margin-bottom: 20px; }
        .dataTables_wrapper .dataTables_filter input { border: 1px solid var(--fd-border); border-radius: 8px; padding: 10px 15px; width: 320px; background: #fff; }
    </style>

    <div class="wrap afdp-dashboard">
        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px;">
            <h1 style="font-weight: 800; font-size: 24px;">Menu Extras</h1>
            <a href="?page=awesome_food_delivery&tab=extras&sub=add" class="btn-fd" style="background:var(--fd-primary); color:#fff; padding: 10px 20px; border-radius: 8px;">+ Add New Extra</a>
        </div>

        <div id="fd-extras-table-container">
            <table id="fd-extras-table">
                <thead>
                    <tr>
                        <th width="60">Photo</th>
                        <th>Extra Details</th>
                        <th width="120">Price</th>
                        <th width="150">Status</th>
                        <th width="260" style="text-align: right;">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    <?php if($extras): 
                        foreach($extras as $id => $item):
                            $img_id = $item['file_id'] ?? 0;
                            $img_url = $img_id ? wp_get_attachment_thumb_url($img_id) : '';
                            
                            $view_url   = "?page=awesome_food_delivery&tab=extras&sub=view&item=$id";
                            $edit_url   = "?page=awesome_food_delivery&tab=extras&sub=add&edit=$id";
                            $delete_url = wp_nonce_url(add_query_arg(['delete' => $id], menu_page_url('awesome_food_delivery', false) . '&tab=extras'), 'afdp_delete_extra_' . $id);
                    ?>
                        <tr>
                            <td>
                                <?php if ($img_url): ?>
                                    <img src="<?php echo esc_url($img_url); ?>" class="fd-item-img">
                                <?php else: ?>
                                    <div class="fd-no-img"><span class="dashicons dashicons-plus"></span></div>
                                <?php endif; ?>
                            </td>
                            <td>
                                <div style="font-weight: 700; font-size: 15px; color: var(--fd-text);"><?php echo esc_html($item['name']); ?></div>
                                <div style="color: var(--fd-muted); font-size: 11px; margin-top: 2px;">Code: #EXT-<?php echo esc_html($id); ?></div>
                            </td>
                            <td>
                                <strong style="font-size:15px; color: var(--fd-primary);">
                                    <?php echo esc_html( $currency ); ?><?php echo esc_html( number_format( floatval( $item['price'] ?? 0 ), 2 ) ); ?>
                                </strong>
                            </td>
                            <td>
                                <?php if(isset($item['quantity']) && $item['quantity'] > 0): ?>
                                    <span class="fd-badge fd-status-badge">Available (<?php echo esc_html($item['quantity']); ?>)</span>
                                <?php else: ?>
                                    <span class="fd-badge fd-out-badge">Out of Stock</span>
                                <?php endif; ?>
                            </td>
                            <td>
                                <div style="display: flex; gap: 8px; justify-content: flex-end;">
                                    <a class="btn-fd btn-view-fd" href="<?php echo esc_url($view_url); ?>">
                                        <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>
                                        View
                                    </a>
                                    <a class="btn-fd btn-edit-fd" href="<?php echo esc_url($edit_url); ?>">
                                        <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4L18.5 2.5z"></path></svg>
                                        Edit
                                    </a>
                                    <a class="btn-fd btn-delete-fd" onclick="return confirm('Remove this extra?')" href="<?php echo esc_url($delete_url); ?>">
                                        <svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path></svg>
                                    </a>
                                </div>
                            </td>
                        </tr>
                    <?php endforeach; else: ?>
                        <tr><td colspan="5" style="text-align:center; padding: 50px; color: var(--fd-muted);">No extras found.</td></tr>
                    <?php endif; ?>
                </tbody>
            </table>
        </div>
    </div>

    <script>
    jQuery(document).ready(function($){
        if ($.fn.DataTable) {
            $('#fd-extras-table').DataTable({
                "pageLength": 10,
                "language": {
                    "search": "",
                    "searchPlaceholder": "Search extras...",
                },
                "dom": '<"top"f>rt<"bottom"ip><"clear">',
                "columnDefs": [{ "orderable": false, "targets": [0, 4] }]
            });
        }
    });
    </script>
<?php
}