@extends('news.layout', [
    'metaTitle' => ($author->name ?: $author->username) . ' — News Author',
    'metaDescription' => 'News stories and announcements by ' . ($author->name ?: $author->username) . '.',
    'metaCanonical' => route('news.author', ['username' => $author->username]),
])

@section('news_content')
@php
    $authorLabel = $author->name ?: $author->username;
    $headerBreadcrumbs = collect([
        (object) ['name' => 'Community', 'url' => route('community.activity')],
        (object) ['name' => 'Announcements', 'url' => route('news.index')],
        (object) ['name' => $authorLabel, 'url' => route('news.author', ['username' => $author->username])],
    ]);
@endphp

<x-nova-page-header
    section="Community"
    :title="$authorLabel"
    icon="fa-user-pen"
    :breadcrumbs="$headerBreadcrumbs"
    :description="'Editorial stories and updates by ' . $authorLabel . '.'"
    headerClass="pb-6"
    innerClass="mx-auto max-w-7xl"
/>

<div class="mx-auto max-w-7xl px-6 pt-8 pb-16 md:px-10">
    <div class="mb-8 rounded-[28px] border border-white/[0.08] bg-white/[0.03] p-5 shadow-[0_18px_45px_rgba(0,0,0,0.16)] sm:p-6">
        <div class="flex flex-col gap-4 sm:flex-row sm:items-center">
            <img src="{{ \App\Support\AvatarUrl::forUser((int) $author->id, $author->profile?->avatar_hash ?? null, 96) }}" alt="{{ $authorLabel }}" class="h-20 w-20 rounded-[24px] border border-white/[0.08] object-cover">
            <div>
                <div class="text-[11px] font-semibold uppercase tracking-[0.2em] text-white/40">News author</div>
                <h2 class="mt-2 text-2xl font-semibold text-white">{{ $authorLabel }}</h2>
                <p class="mt-2 text-sm leading-7 text-white/60">{{ $author->profile?->bio ? Str::limit($author->profile->bio, 180) : 'Writes updates, announcements, and editorial stories for Skinbase.' }}</p>
            </div>
        </div>
    </div>

    <div class="grid gap-8 xl:grid-cols-[minmax(0,1fr)_320px]">
        <section>
            @if($articles->isEmpty())
                <div class="rounded-[28px] border border-white/[0.06] bg-white/[0.025] px-8 py-14 text-center text-white/45">This author has not published News articles yet.</div>
            @else
                <div class="grid gap-5 md:grid-cols-2">
                    @foreach($articles as $article)
                        @include('news._article_card', ['article' => $article])
                    @endforeach
                </div>
                <div class="mt-8 flex justify-center">{{ $articles->links() }}</div>
            @endif
        </section>
        <aside class="space-y-4">
            @include('news._sidebar', ['categories' => $categories, 'trending' => $trending, 'tags' => $tags])
        </aside>
    </div>
</div>
@endsection