<x-mb-layout pageTitle="Campaign performance" :conversations="$conversations ?? []">
    @push('styles')
        <link href="{{ asset('assets/mb/css/creatives.css') }}?v={{ filemtime(public_path('assets/mb/css/creatives.css')) }}" rel="stylesheet">
        <link href="{{ asset('assets/mb/css/campaigns.css') }}?v={{ filemtime(public_path('assets/mb/css/campaigns.css')) }}" rel="stylesheet">
    @endpush

    @php
        $filterUrl = fn (?string $status = null) => route('campaigns.performance', array_filter([
            'q' => request('q') ?: null,
            'platform' => in_array(request('platform'), ['meta', 'google', 'linkedin'], true) ? request('platform') : null,
            'status' => $status,
            'per_page' => request('per_page') ?: null,
        ], fn (mixed $value): bool => $value !== null && $value !== ''));
        $activeStatus = (string) request('status', '');
        $activePlatform = (string) request('platform', '');
    @endphp

    <div class="mb-page">
        <div class="mb-page-inner">
            <div class="mb-page-head">
                <div>
                    <h1 class="mb-page-title">Campaign performance</h1>
                </div>
            </div>

            <div class="mb-stats mb-perf-kpis is-five">
                <div class="mb-stat">
                    <span class="mb-stat-icon is-all"><i class="bi bi-megaphone"></i></span>
                    <span><span class="mb-stat-num">{{ $stats['all'] }}</span><span class="mb-stat-label d-block">Campaigns</span></span>
                </div>
                <div class="mb-stat">
                    <span class="mb-stat-icon is-ok"><i class="bi bi-currency-dollar"></i></span>
                    <span><span class="mb-stat-num">${{ number_format($totals['spend_7d'], 2) }}</span><span class="mb-stat-label d-block">7-day spend</span></span>
                </div>
                <div class="mb-stat">
                    <span class="mb-stat-icon is-all"><i class="bi bi-eye"></i></span>
                    <span><span class="mb-stat-num">{{ number_format($totals['impressions_7d']) }}</span><span class="mb-stat-label d-block">7-day impressions</span></span>
                </div>
                <div class="mb-stat">
                    <span class="mb-stat-icon is-run"><i class="bi bi-cursor"></i></span>
                    <span><span class="mb-stat-num">{{ number_format($totals['clicks_7d']) }}</span><span class="mb-stat-label d-block">7-day clicks</span></span>
                </div>
                <div class="mb-stat">
                    <span class="mb-stat-icon is-all"><i class="bi bi-graph-up"></i></span>
                    <span><span class="mb-stat-num">{{ $totals['cpc_7d'] === null ? '—' : '$'.number_format($totals['cpc_7d'], 2) }}</span><span class="mb-stat-label d-block">7-day CPC</span></span>
                </div>
            </div>

            <div class="mb-perf-chips" role="navigation" aria-label="Filter by verdict">
                <a class="mb-perf-chip{{ $activeStatus === '' || $activeStatus === 'all' ? ' is-active' : '' }}" href="{{ $filterUrl(null) }}">
                    All <span class="mb-perf-chip-count">{{ $stats['all'] }}</span>
                </a>
                @foreach ($verdicts as $verdict)
                    <a class="mb-perf-chip{{ $activeStatus === $verdict->value ? ' is-active' : '' }}" href="{{ $filterUrl($verdict->value) }}">
                        {{ $verdict->label() }} <span class="mb-perf-chip-count">{{ $stats[$verdict->value] ?? 0 }}</span>
                    </a>
                @endforeach
                <a class="mb-perf-chip{{ $activeStatus === 'none' ? ' is-active' : '' }}" href="{{ $filterUrl('none') }}">
                    No verdict yet <span class="mb-perf-chip-count">{{ $stats['none'] }}</span>
                </a>
            </div>

            <div class="mb-card">
                <form class="mb-toolbar" method="GET" action="{{ route('campaigns.performance') }}">
                    <label class="mb-search">
                        <i class="bi bi-search"></i>
                        <input type="search" name="q" value="{{ request('q') }}" placeholder="Search campaigns…" aria-label="Search campaigns">
                    </label>
                    <select class="mb-select" name="platform" aria-label="Filter by platform" onchange="this.form.submit()">
                        <option value="all" @selected(!request('platform') || request('platform') === 'all')>All platforms</option>
                        <option value="meta" @selected(request('platform') === 'meta')>Meta</option>
                        <option value="google" @selected(request('platform') === 'google')>Google</option>
                        <option value="linkedin" @selected(request('platform') === 'linkedin')>LinkedIn</option>
                    </select>
                    @if (request('status'))
                        <input type="hidden" name="status" value="{{ request('status') }}">
                    @endif
                    <div class="mb-toolbar-end">
                        <select class="mb-select" name="per_page" aria-label="Rows per page" onchange="this.form.submit()">
                            <option value="10" @selected($rows->perPage() === 10)>10 / page</option>
                            <option value="25" @selected($rows->perPage() === 25)>25 / page</option>
                            <option value="50" @selected($rows->perPage() === 50)>50 / page</option>
                        </select>
                        <button type="submit" class="mb-btn-ghost"><i class="bi bi-search"></i>Search</button>
                    </div>
                </form>

                @if ($rows->isEmpty())
                    <div class="mb-empty">
                        <div class="mb-empty-icon"><i class="bi bi-megaphone"></i></div>
                        <div class="mb-empty-title">No live campaigns yet</div>
                        <div>After Whale ingest, run <code>php artisan campaigns:monitor-adops --hourly</code>.</div>
                    </div>
                @else
                    <div class="mb-perf-campaign-list">
                        @foreach ($rows as $row)
                            @php
                                $verdict = \App\Library\CampaignDecision\CampaignDecisionVerdict::tryFromStored($row['status'])
                                    ?? \App\Campaigns\PerformanceVerdict::tryFromStored($row['status']);
                                $statusClass = $verdict?->statusClass() ?? 'queued';
                                $statusLabel = $verdict?->label() ?? 'No verdict yet';
                                $actionSummary = $row['action_summary'] ?? 'Run campaigns:monitor-adops --hourly to generate a suggestion.';
                                $trendLabel = match ($row['trend'] ?? null) {
                                    'improving' => 'Improving',
                                    'declining' => 'Declining',
                                    'flat' => 'Flat',
                                    default => '—',
                                };
                                $adPlatform = $row['platform'] === 'google' ? 'Google' : 'Meta';
                                $detailUrl = route('campaigns.performance.show', [$row['platform'], $row['external_campaign_id']]);
                                $platformStatus = is_string($row['platform_status'] ?? null) && $row['platform_status'] !== ''
                                    ? str_replace('_', ' ', ucwords(strtolower((string) $row['platform_status'])))
                                    : null;
                                $ctrLabel = ($row['ctr_7d'] ?? null) === null
                                    ? '—'
                                    : number_format(((float) $row['ctr_7d']) * 100, 2).'%';
                            @endphp
                            <article class="mb-perf-campaign-card">
                                <div class="mb-perf-campaign-head">
                                    <div class="mb-perf-campaign-title">
                                        <a href="{{ $detailUrl }}" class="mb-perf-campaign-name" wire:navigate>{{ $row['name'] }}</a>
                                        <div class="mb-perf-campaign-meta">
                                            <span>{{ $row['external_campaign_id'] }}</span>
                                            @if (! empty($row['account_id']))
                                                <span>Account {{ $row['account_id'] }}</span>
                                            @endif
                                            @if ($row['daily_budget'] !== null && $row['daily_budget'] !== '')
                                                <span>${{ number_format((float) $row['daily_budget'], 2) }}/day</span>
                                            @endif
                                            @if ($row['region_label'])
                                                <span>{{ $row['region_label'] }}</span>
                                            @endif
                                        </div>
                                    </div>
                                    <div class="mb-perf-campaign-badges">
                                        <span class="mb-tag">{{ $adPlatform }}</span>
                                        @if ($platformStatus)
                                            <span class="mb-tag">{{ $platformStatus }}</span>
                                        @endif
                                        <span class="mb-status is-{{ $statusClass }}"><span class="mb-dot"></span>{{ $statusLabel }}</span>
                                    </div>
                                </div>

                                <div class="mb-perf-campaign-metrics">
                                    <div><span class="mb-perf-metric-label">Spend 7d</span><strong>${{ number_format($row['spend_7d'], 2) }}</strong></div>
                                    <div><span class="mb-perf-metric-label">Impr 7d</span><strong>{{ number_format($row['impressions_7d']) }}</strong></div>
                                    <div><span class="mb-perf-metric-label">Clicks 7d</span><strong>{{ number_format($row['clicks_7d']) }}</strong></div>
                                    <div><span class="mb-perf-metric-label">CPC</span><strong>{{ $row['cpc_7d'] === null ? '—' : '$'.number_format($row['cpc_7d'], 2) }}</strong></div>
                                    <div><span class="mb-perf-metric-label">CTR</span><strong>{{ $ctrLabel }}</strong></div>
                                    <div><span class="mb-perf-metric-label">{{ $adPlatform }} conv.</span><strong>{{ number_format((int) ($row['platform_conversions_7d'] ?? 0)) }}</strong></div>
                                </div>

                                @if ($row['affiliate_matched'] ?? false)
                                    <div class="mb-perf-campaign-metrics is-affiliate">
                                        <div><span class="mb-perf-metric-label">Whale orders</span><strong>{{ number_format((float) ($row['affiliate_orders_7d'] ?? 0), 2) }}</strong></div>
                                        <div><span class="mb-perf-metric-label">Whale clicks</span><strong>{{ number_format((int) ($row['affiliate_clicks_7d'] ?? 0)) }}</strong></div>
                                        <div><span class="mb-perf-metric-label">Sum CPC</span><strong>${{ number_format((float) ($row['affiliate_sum_cpc_7d'] ?? 0), 2) }}</strong></div>
                                        <div><span class="mb-perf-metric-label">Net revenue</span><strong>${{ number_format((float) ($row['affiliate_net_revenue_7d'] ?? 0), 2) }}</strong></div>
                                    </div>
                                @endif

                                <div class="mb-perf-campaign-action">
                                    <span class="mb-perf-metric-label">What to do</span>
                                    <p class="mb-perf-action-summary">{{ $actionSummary }}</p>
                                    @if (! empty($row['verdict_reason']))
                                        <span class="mb-perf-metric-label">Why this verdict</span>
                                        <p class="mb-perf-verdict-reason">{{ $row['verdict_reason'] }}</p>
                                        @if (! empty($row['verdict_reasons']))
                                            <ul class="mb-perf-verdict-reasons">
                                                @foreach ($row['verdict_reasons'] as $reasonRow)
                                                    @if (is_array($reasonRow))
                                                        <li>{{ \App\Library\CampaignDecision\CampaignDecisionReasonFormatter::line($reasonRow) }}</li>
                                                    @endif
                                                @endforeach
                                            </ul>
                                        @endif
                                    @endif
                                    <span class="mb-perf-metric-label">AI suggestion</span>
                                    <p class="mb-perf-reason">{{ $row['reason'] ?: 'No AI reason yet. Mapping has not run for this campaign.' }}</p>
                                    <div class="mb-perf-campaign-context">
                                        <span>{{ $row['learning'] }}</span>
                                        @if ($row['trend_summary'])
                                            <span>· {{ $row['trend_summary'] }}</span>
                                        @endif
                                        @if ($row['platform_learning_label'])
                                            <span>· {{ $row['platform_learning_label'] }}</span>
                                        @endif
                                    </div>
                                </div>

                                @if (! empty($row['last_error']))
                                    <div class="mb-note is-error" role="alert">
                                        <i class="bi bi-exclamation-triangle"></i>
                                        <div><strong>Last sync failed.</strong> {{ $row['last_error'] }}</div>
                                    </div>
                                @endif

                                <div class="mb-perf-campaign-foot">
                                    <div class="mb-perf-campaign-context">
                                        <span>Whale 7-day</span>
                                        <span>· Trend {{ $trendLabel }}</span>
                                        <span>· {{ $row['updated_at']?->diffForHumans() ?? 'Not mapped yet' }}</span>
                                    </div>
                                    <a href="{{ $detailUrl }}" class="mb-row-btn" wire:navigate>
                                        <i class="bi bi-eye"></i>View details
                                    </a>
                                </div>
                            </article>
                        @endforeach
                    </div>

                    <div class="mb-table-foot">
                        <span>Showing <strong>{{ $rows->firstItem() }}–{{ $rows->lastItem() }}</strong> of <strong>{{ $rows->total() }}</strong></span>
                        <div class="mb-pager">{{ $rows->onEachSide(1)->links() }}</div>
                    </div>
                @endif
            </div>
        </div>
    </div>
</x-mb-layout>
