<?php
declare(strict_types=1);
// ==================================================
// Nuclear Fancy Pants Edition™ — NUCLEAR+++
// File: /templates/facebook-picker.php
// Description: Facebook Business Page picker template - NUCLEAR+++
// Last Edited: 2026-03-25
// ==================================================

namespace AutoMarketerAI;

// No direct access
defined('ABSPATH') || exit;

// $pending_pages is set by FacebookPage::render()
// Shape: ['pages' => [...], 'user_token' => '...', 'fb_user_id' => '...']

$pages = $pending_pages['pages'] ?? [];
?>
<div class="wrap amai-fb-wrap">

    <div class="amai-page-header">
        <h1 class="amai-page-title">Facebook</h1>
        <p class="amai-page-subtitle">Connect your Business Page and let us handle the content.</p>
        <nav class="amai-tabs">
            <a href="<?php echo esc_url(admin_url('admin.php?page=automarketer-ai')); ?>" class="amai-tab">Overview</a>
            <a href="<?php echo esc_url(admin_url('admin.php?page=automarketer-ai-modules')); ?>" class="amai-tab">Modules</a>
            <a href="<?php echo esc_url(admin_url('admin.php?page=automarketer-ai-billing')); ?>" class="amai-tab">Plans</a>
            <a href="<?php echo esc_url(admin_url('admin.php?page=automarketer-ai-facebook')); ?>" class="amai-tab amai-tab-active">Facebook</a>
        </nav>
    </div>

    <div class="amai-fb-picker-shell">

        <div class="amai-fb-picker-header">
            <h2 class="amai-fb-picker-heading">Which page should we post to?</h2>
            <p class="amai-fb-picker-sub">
                These are the Business Pages you manage on Facebook.
                Pick the one you want AutoMarketer AI to handle.
            </p>
        </div>

        <?php if (empty($pages)) : ?>
        <div class="amai-fb-notice amai-fb-notice-warn">
            <div class="amai-fb-notice-body">
                We couldn't find any Business Pages on your account.
                Make sure you have a Facebook Business Page and that you're an admin on it.
                <a href="https://www.facebook.com/pages/creation/" target="_blank" rel="noopener noreferrer" class="amai-fb-notice-link">Create a Business Page →</a>
            </div>
        </div>
        <div style="text-align: center; margin-top: 2rem;">
            <a href="<?php echo esc_url(admin_url('admin.php?page=automarketer-ai-facebook')); ?>" class="amai-fb-back-link">← Start over</a>
        </div>
        <?php else : ?>

        <form method="post" action="<?php echo esc_url(admin_url('admin.php?page=automarketer-ai-facebook')); ?>" id="amai-fb-picker-form">
            <?php wp_nonce_field('amai_fb_select_page'); ?>
            <input type="hidden" name="amai_fb_action" value="select_page"/>
            <input type="hidden" name="page_id" id="amai-selected-page-id" value=""/>

            <div class="amai-fb-pages-list">
                <?php foreach ($pages as $page) :
                    $page_id      = esc_attr((string) ($page['id'] ?? ''));
                    $page_name    = esc_html((string) ($page['name'] ?? ''));
                    $page_cat     = esc_html((string) ($page['category'] ?? ''));
                    $page_pic     = esc_url((string) ($page['picture_url'] ?? ''));
                    $page_follows = number_format((int) ($page['followers'] ?? 0));
                    $initials     = strtoupper(substr((string) ($page['name'] ?? 'P'), 0, 2));
                ?>
                <div class="amai-fb-page-card" data-page-id="<?php echo $page_id; ?>" role="button" tabindex="0">
                    <div class="amai-fb-page-avatar">
                        <?php if ($page_pic !== '') : ?>
                            <img src="<?php echo $page_pic; ?>" alt="<?php echo $page_name; ?>" width="48" height="48"/>
                        <?php else : ?>
                            <div class="amai-fb-page-initials"><?php echo esc_html($initials); ?></div>
                        <?php endif; ?>
                    </div>
                    <div class="amai-fb-page-info">
                        <div class="amai-fb-page-name"><?php echo $page_name; ?></div>
                        <div class="amai-fb-page-meta">
                            <?php if ($page_cat !== '') : ?>
                                <span><?php echo $page_cat; ?></span>
                                <span class="amai-fb-page-meta-dot">·</span>
                            <?php endif; ?>
                            <span><?php echo esc_html($page_follows); ?> followers</span>
                        </div>
                    </div>
                    <div class="amai-fb-page-check">
                        <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <circle cx="9" cy="9" r="8.25" stroke="#E2C4B0" stroke-width="1.5"/>
                        </svg>
                    </div>
                </div>
                <?php endforeach; ?>
            </div>

            <div class="amai-fb-picker-footer">
                <a href="<?php echo esc_url(admin_url('admin.php?page=automarketer-ai-facebook')); ?>" class="amai-fb-back-link">← Use a different account</a>
                <button type="submit" class="amai-fb-select-btn" id="amai-fb-select-btn" disabled>
                    Connect this page →
                </button>
            </div>
        </form>

        <?php endif; ?>

    </div>
</div>