@extends('layouts.main')
@section('seo')
    <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
    <meta
    name="keywords"
    content="pmi, palang merah indonesia, palang merah, pmr, pmr sumut, pmi sumut, pemprovsu, ifrc, icrc" />
    <meta name="author" content="{{ $identities->title }}" />
    <meta name="description" content="{{ $description ?? $identities->meta_description }}" />

    <!-- Open Graph Meta Tags -->
    <meta property="og:url" content="{{ route('agenda') }}" />
    <meta property="og:title" content="{{ $identities->subtitle }} - {{ $title }}" />
    <meta property="og:type" content="article" />
    <meta property="og:image" content="{{ asset('assets/img/meta-image.png') }}" />
    <meta
        property="og:description"
        content="{{ $description ?? $identities->meta_description }}"
    />
    <meta property="og:locale" content="id_ID" />

    <!-- Twitter Card Meta Tags -->
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:title" content="{{ $identities->subtitle }} - {{ $title }}" />
    <meta
        name="twitter:description"
        content="{{ $description ?? $identities->meta_description }}"
    />
    <meta name="twitter:image" content="{{ asset('assets/img/meta-image.png') }}" />

    <!-- Canonical Tag -->
    <link rel="canonical" href="{{ route('agenda') }}" />

    <!-- Additional SEO Meta Tags -->
    <meta name="distribution" content="global" />
    <meta name="revisit-after" content="7 days" />
    <meta name="rating" content="general" />
    <meta name="language" content="Indonesian" />
    <meta name="geo.region" content="ID" />
    <meta name="geo.placename" content="Medan" />

    <link href="{{ asset('assets/css/module-css/page-title.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/css/module-css/blog-sidebar.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/css/module-css/blog-details.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/css/module-css/news.css') }}" rel="stylesheet">

    <link href="{{ asset('assets/css/module-css/page-title.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/css/module-css/blog-sidebar.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/css/module-css/news.css') }}" rel="stylesheet">
@endsection

@section('content')
    <section class="page-title centred">
        <div class="bg-layer" style="background-image: url('{{ asset('assets/img/background/agenda.png') }}');"></div>
        <div class="auto-container">
            <div class="content-box">
                <ul class="bread-crumb">
                    <li>{{ $page }}</li>
                    <li>{{ $title }}</li>
                </ul>
                <h1>{{ $title }}</h1>
                <div class="row justify-content-center">
                <div class="col-lg-6">
                    <p class="text-white pt-3">{{ $description }}</p>
                </div>
                </div>
            </div>
        </div>
    </section>

    <section class="sidebar-page-container pt_120 pb_120">
        <div class="auto-container">
            <div class="row clearfix">
                <div class="col-lg-4 col-md-12 col-12 sidebar-side">
                    <div class="blog-sidebar">
                        <div class="sidebar-widget search-widget">
                            <div class="widget-title mb_25">
                                <h3>Cari Agenda</h3>
                            </div>
                            <div class="search-form">
                                <form id="searchForm" action="{{ route('agenda') }}" method="get" class="default-form">
                                    <div class="form-group">
                                        <input type="search" name="q" value="{{ request('q') }}" placeholder="Search...">
                                        <button type="submit"><i class="icon-8"></i></button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-8 col-md-12 col-sm-12 content-side">
                    <div class="blog-standard-content p_relative">
                      <div class="row clearfix">
                        @forelse ($agenda as $item)
                          <div class="col-lg-6 col-md-6 col-sm-12 news-block">
                            <div class="news-block-four">
                                <div class="inner-box">
                                    <span class="post-date">
                                      {{ \Carbon\Carbon::parse($item->start_date)->format('d F Y') }}
                                      @if ($item->end_date)
                                          - {{ \Carbon\Carbon::parse($item->end_date)->format('d F Y') }}
                                      @endif
                                    </span>
                                    <h4><a href="{{ route('agenda.show', $item->slug) }}">{{ $item->title }}</a></h4>
                                    <ul class="post-info">
                                        <li>
                                          <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" fill="currentColor" class="bi bi-geo-alt-fill text-danger" viewBox="0 0 16 16">
                                            <path d="M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10m0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6"></path>
                                          </svg>
                                          <small>{{ $item->address }}</small>
                                        </li>
                                    </ul>
                                    <p>{{ \Illuminate\Support\Str::limit(strip_tags($item->content), 110) }}</p>
                                    <div class="link"><a href="{{ route('agenda.show', $item->slug) }}"><span>Baca Selengkapnya</span><i class="icon-39"></i></a></div>
                                </div>
                            </div>
                          </div>
                        @empty
                          <div class="col-12">
                            <div class="text-center mb-5 text-muted">
                                <div class="mt-2">Tidak ada artikel ditemukan.</div>
                            </div>
                        </div>
                        @endforelse
                      </div>

                        @php
                            $query = request()->except('page');
                        @endphp

                        <div class="pagination-wrapper">
                            <ul class="pagination">
                                {{-- Previous Page --}}
                                @if ($agenda->onFirstPage())
                                    <li>
                                        <a href="#" class="d-flex justify-content-center align-items-center disabled">
                                            <i class="icon-50"></i>
                                        </a>
                                    </li>
                                @else
                                    <li>
                                        <a href="{{ $agenda->previousPageUrl() . (count($query) ? '&' . http_build_query($query) : '') }}" class="d-flex justify-content-center align-items-center">
                                            <i class="icon-50"></i>
                                        </a>
                                    </li>
                                @endif

                                {{-- Page Number --}}
                                @php
                                    $start = max($agenda->currentPage() - 1, 1);
                                    $end = min($start + 2, $agenda->lastPage());
                                @endphp
                                @for ($page = $start; $page <= $end; $page++)
                                    <li>
                                        <a href="{{ $agenda->url($page) . (count($query) ? '&' . http_build_query($query) : '') }}"
                                            class="{{ $page == $agenda->currentPage() ? 'current' : '' }}">
                                            {{ $page }}
                                        </a>
                                    </li>
                                @endfor

                                {{-- Next Page --}}
                                @if ($agenda->hasMorePages())
                                    <li>
                                        <a href="{{ $agenda->nextPageUrl() . (count($query) ? '&' . http_build_query($query) : '') }}" class="d-flex justify-content-center align-items-center">
                                            <i class="icon-51"></i>
                                        </a>
                                    </li>
                                @else
                                    <li>
                                        <a href="#" class="d-flex justify-content-center align-items-center disabled">
                                            <i class="icon-51"></i>
                                        </a>
                                    </li>
                                @endif
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection

@section('script')
@endsection