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

namespace AutoMarketerAI;

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

// $connect_url is set by FacebookPage::render()
// $auth_error  is set by FacebookPage::render()

$error_messages = [
    'invalid_state'           => 'Something went wrong with the authorization. Please try again.',
    'missing_code'            => 'Authorization code was missing. Please try again.',
    'no_pages_found'          => 'We couldn\'t find any Facebook Pages on your account.',
    'no_business_pages_found' => 'no_business_pages',
    'save_failed'             => 'We couldn\'t save your connection. Please try again.',
    'http_error'              => 'A network error occurred. Please try again.',
];

$error_msg = '';
if (!empty($auth_error)) {
    if ($auth_error === 'no_business_pages_found') {
        $error_msg = 'personal_profile_error';
    } else {
        $error_msg = $error_messages[$auth_error] ?? 'Something went wrong. Please try again.';
    }
}
?>
<div class="wrap amai-fb-wrap">

    <?php // Tab navigation ?>
    <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>

    <?php if ($error_msg === 'personal_profile_error') : ?>
    <div class="amai-fb-notice amai-fb-notice-warn">
        <div class="amai-fb-notice-icon">
            <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                <circle cx="10" cy="10" r="9" stroke="#C8870A" stroke-width="1.5"/>
                <path d="M10 6v5M10 13.5v.5" stroke="#C8870A" stroke-width="1.5" stroke-linecap="round"/>
            </svg>
        </div>
        <div class="amai-fb-notice-body">
            <strong>That looks like a personal profile.</strong>
            Personal Facebook profiles can't be managed by apps - and honestly, a Business Page looks far more professional to your customers.
            Creating one takes about 4 minutes.
            <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>
    <?php elseif ($error_msg !== '') : ?>
    <div class="amai-fb-notice amai-fb-notice-warn">
        <div class="amai-fb-notice-icon">
            <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                <circle cx="10" cy="10" r="9" stroke="#C8870A" stroke-width="1.5"/>
                <path d="M10 6v5M10 13.5v.5" stroke="#C8870A" stroke-width="1.5" stroke-linecap="round"/>
            </svg>
        </div>
        <div class="amai-fb-notice-body"><?php echo esc_html($error_msg); ?></div>
    </div>
    <?php endif; ?>

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

        <div class="amai-fb-connect-hero">
            <div class="amai-fb-connect-icon">
                <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <rect width="48" height="48" rx="12" fill="#1877F2"/>
                    <path d="M31 14h-4a6 6 0 0 0-6 6v3h-3v4h3v9h4v-9h3l1-4h-4v-3a1 1 0 0 1 1-1h3v-5z" fill="white"/>
                </svg>
            </div>
            <h2 class="amai-fb-connect-heading">Connect your Facebook Business Page</h2>
            <p class="amai-fb-connect-subheading">
                We'll write, schedule, and post to Facebook for you - Monday through Friday,
                every week. All you do is approve or let it run.
            </p>
        </div>

        <div class="amai-fb-connect-steps">
            <div class="amai-fb-connect-step">
                <div class="amai-fb-step-num">1</div>
                <div class="amai-fb-step-body">
                    <div class="amai-fb-step-title">Click Connect below</div>
                    <div class="amai-fb-step-desc">You'll be taken to Facebook to authorize AutoMarketer AI. We only ask for the permissions we actually use.</div>
                </div>
            </div>
            <div class="amai-fb-connect-step">
                <div class="amai-fb-step-num">2</div>
                <div class="amai-fb-step-body">
                    <div class="amai-fb-step-title">Pick your Business Page</div>
                    <div class="amai-fb-step-desc">You'll see a list of Pages you manage. Select the one you want us to post to. Personal profiles won't appear - that's intentional.</div>
                </div>
            </div>
            <div class="amai-fb-connect-step">
                <div class="amai-fb-step-num">3</div>
                <div class="amai-fb-step-body">
                    <div class="amai-fb-step-title">Tell us about your business</div>
                    <div class="amai-fb-step-desc">A few quick questions so we can write posts that actually sound like you. Takes 2 minutes.</div>
                </div>
            </div>
        </div>

        <div class="amai-fb-connect-action">
            <a href="<?php echo esc_url($connect_url); ?>" class="amai-fb-connect-btn">
                <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <rect width="18" height="18" rx="4" fill="white" fill-opacity="0.2"/>
                    <path d="M11.5 5h-1.5a2.25 2.25 0 0 0-2.25 2.25v1.125H6.5v1.5h1.25V13.5h1.5V9.875H10.5l.375-1.5H9.25V7.25a.75.75 0 0 1 .75-.75h1.5V5z" fill="white"/>
                </svg>
                Connect with Facebook
            </a>
            <p class="amai-fb-connect-fine">
                We never post without your knowledge. You're always in control.
            </p>
        </div>

        <div class="amai-fb-help-block">
            <div class="amai-fb-help-heading">Don't have a Facebook Business Page yet?</div>
            <p class="amai-fb-help-body">
                A Business Page is different from a personal profile - and it's what your customers expect to find.
                Creating one is free and takes about 4 minutes.
            </p>
            <a href="https://www.facebook.com/pages/creation/" target="_blank" rel="noopener noreferrer" class="amai-fb-help-link">
                Create a Business Page on Facebook →
            </a>
        </div>

    </div>
</div>