@extends('layouts.app')

@section('title', $post->metaTitle().' — блог teeu')
@section('meta_description', $post->metaDescription())

@section('seo')
    @include('partials.seo.meta', [
        'canonical' => route('blog.show', $post),
        'ogType' => 'article',
        'ogTitle' => $post->metaTitle(),
        'ogDescription' => $post->metaDescription(),
        'ogImage' => \App\Support\OgImage::from($post->coverUrl()),
    ])
    {{-- Article: заголовок, даты, автор и издатель. Без него запись остаётся
         просто страницей и не попадает в блоки новостей и статей. --}}
    @include('partials.seo.json-ld', ['data' => \App\Support\Seo::articleJsonLd($post)])
    @include('partials.seo.json-ld', ['data' => \App\Support\Seo::breadcrumbJsonLd(array_values(array_filter([
        ['name' => 'Главная', 'url' => route('home')],
        ['name' => 'Блог', 'url' => route('blog.index')],
        $post->category ? ['name' => $post->category->title, 'url' => route('blog.category', $post->category->slug)] : null,
        ['name' => $post->title, 'url' => route('blog.show', $post)],
    ])))])
    <meta property="article:published_time" content="{{ $post->published_at?->toIso8601String() }}">
    <meta property="article:modified_time" content="{{ ($post->updated_at ?? $post->published_at)?->toIso8601String() }}">
    @if ($post->category)
        <meta property="article:section" content="{{ $post->category->title }}">
    @endif
@endsection

@section('content')
    <div class="mx-auto w-full max-w-3xl">
        @include('partials.blog.crumbs', ['trail' => array_values(array_filter([
            $post->category ? ['name' => $post->category->title, 'url' => route('blog.category', $post->category->slug)] : null,
            ['name' => $post->title, 'url' => route('blog.show', $post)],
        ]))])

        <article class="mt-4">
            <h1 class="text-3xl font-extrabold leading-tight tracking-tight text-[var(--color-ink)] sm:text-[40px]">{{ $post->title }}</h1>

            <div class="mt-4 flex flex-wrap items-center gap-x-3 gap-y-1 text-sm text-[var(--color-muted)]">
                <time datetime="{{ $post->published_at?->toDateString() }}">{{ $post->published_at?->translatedFormat('j F Y') }}</time>
                <span>·</span>
                <span>{{ $post->readingLabel() }}</span>
                @if ($post->author_name)
                    <span>·</span>
                    <span>{{ $post->author_name }}</span>
                @endif
            </div>

            @if ($post->excerpt)
                <p class="mt-5 text-[19px] font-semibold leading-relaxed text-[var(--color-slate)]">{{ $post->excerpt }}</p>
            @endif

            @if ($post->coverUrl())
                <img src="{{ $post->coverUrl() }}" alt="{{ $post->title }}"
                     class="mt-6 aspect-[16/9] w-full rounded-[var(--radius-lg)] object-cover">
            @endif

            <x-prose size="lg" class="mt-8">
                {!! $post->renderedContent() !!}
            </x-prose>
        </article>

        @if ($related->isNotEmpty())
            <div class="mt-12 border-t border-[var(--color-line)] pt-8">
                <h2 class="text-xl font-extrabold text-[var(--color-ink)]">Читайте дальше</h2>
                <div class="mt-4 grid gap-5 sm:grid-cols-2 lg:grid-cols-3">
                    @foreach ($related as $relatedPost)
                        @include('partials.blog.card', ['post' => $relatedPost])
                    @endforeach
                </div>
            </div>
        @endif
    </div>
@endsection