@extends("front.layouts.newsLayout")

@section("content")
    <main class="main">
        <!-- Search Section -->
        <div class="find-car">
            <div class="container">
                <div class="find-car-form">
                    <form
                        method="get"
                        action="{{ route('site.news.search') }}"
                    >
                        @csrf
                        <h3>
                            {{ TranslationHelper::translate("Search for trending news...", "site") }}
                        </h3>
                        <div class="row">
                            <div class="col-lg-11">
                                <div class="row">
                                    <div class="col-lg-6 col-md-12">
                                        <div class="form-group">
                                            <input
                                                type="text"
                                                name="search_key"
                                                class="form-control custom_input"
                                                value="{{ $app->request->get("search_key") }}"
                                                placeholder="{{ TranslationHelper::translate("What are you searching for?", "site") }}"
                                            />
                                        </div>
                                    </div>
                                    <div class="col-lg-3 col-md-6">
                                        <div class="form-group">
                                            <select
                                                name="country"
                                                class="select"
                                            >
                                                <option
                                                    value=""

                                                >
                                                {{ TranslationHelper::translate('All Countries', 'site') }}
                                                </option>
                                                <option
                                                    value="ae"
                                                    {{ $app->request->get("country") == "ae" ? "selected" : "" }}
                                                >
                                                {{ TranslationHelper::translate('emirates', 'site') }}
                                                </option>
                                                <option
                                                    value="eg"
                                                    {{ $app->request->get("country") == "eg" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("egypt", "site") }}
                                                </option>
                                                <option
                                                    value="sa"
                                                    {{ $app->request->get("country") == "sa" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("Saudi Arabia", "site") }}
                                                </option>
                                                <option
                                                    value="lb"
                                                    {{ $app->request->get("country") == "lb" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("Lebanon", "site") }}
                                                </option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-lg-3 col-md-6">
                                        <div class="form-group">
                                            <select
                                                name="category"
                                                class="select"
                                            >
                                                <option
                                                    value="world"
                                                    {{ $app->request->get("category") == "general" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("general", "site") }}
                                                </option>
                                                <option
                                                    value="business"
                                                    {{ $app->request->get("category") == "business" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("business", "site") }}
                                                </option>
                                                <option
                                                    value="entertainment"
                                                    {{ $app->request->get("category") == "entertainment" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("entertainment", "site") }}
                                                </option>
                                                <option
                                                    value="health"
                                                    {{ $app->request->get("category") == "health" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("health", "site") }}
                                                </option>
                                                <option
                                                    value="science"
                                                    {{ $app->request->get("category") == "science" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("science", "site") }}
                                                </option>
                                                <option
                                                    value="sports"
                                                    {{ $app->request->get("category") == "sports" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("sports", "site") }}
                                                </option>
                                                <option
                                                    value="technology"
                                                    {{ $app->request->get("category") == "technology" ? "selected" : "" }}
                                                >
                                                    {{ TranslationHelper::translate("technology", "site") }}
                                                </option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-1 align-self-end">
                                <button class="theme-btn" type="submit">
                                    <span class="far fa-search"></span>
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- Trending News Section -->
        <div class="py-120">
            <div class="container">
                <!-- Grouped News by Category -->

                <div class="category-section">
                    <div class="row">
                        <div class="col-lg-6 mx-auto">
                            <div class="site-heading text-center">
                                <span class="site-title-tagline">
                                    <i class="flaticon-star"></i>
                                </span>
                                <h2 class="site-title">
                                    {{ Request()->get("category") ? Request()->get("category") : TranslationHelper::translate("trending news", "site") }}
                                </h2>
                                <div class="heading-divider"></div>
                            </div>
                        </div>
                    </div>
                    <div class="trending_grid">
                        @foreach ($newsItems as $news)
                            <div class="news-card">
                                <div class="news-img">
                                    <a
                                        href="{{route('site.new.show', ['id' => $news->id, 'title' => str_replace(' ', '-', $news->title)]) }}"
                                    >
                                        <img
                                            src="{{ $news["image"] ? $news["image"] : asset("end-user/bkamthis.png") }}"
                                            alt="{{ $news["title"] }}"
                                            class="news-image"
                                            loading="lazy"
                                        />
                                    </a>
                                </div>
                                @php
                                $date = $news['date'];
                                if (is_numeric($date)) {
                                $parsedDate = \Carbon\Carbon::createFromTimestamp($date);
                                }else {
                                    $parsedDate = \Carbon\Carbon::parse($date);
                                }
                                @endphp
                                <div class="news-details">
                                    <div class="src">
                                        <span class="time">
                                            {{ $parsedDate->diffForHumans() }}

                                        </span>
                                    </div>
                                    <div class="data-view">
                                        <a
                                            class="title"
                                            href="{{ route('site.new.show', ['id' => $news->id, 'title' => str_replace(' ', '-', $news->title)]) }}"
                                        >
                                            {{ $news["title"] }}
                                        </a>
                                        <div class="magazine">
                                            <span class="icon">
                                                <i class="fa-solid fa-bolt"></i>
                                            </span>
                                            <a
                                                href="{{ $news["link"] }}"
                                                target="_blank"
                                                class="m_src"
                                            >
                                                {{ $news["domain"] }}
                                            </a>
                                            <div class="writer">
                                                {{ $news["publisher"] ?? "bkamthis" }}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="news-footer">
                                    <div class="controls">
                                        <a
                                            href="#"
                                            @guest onclick="swal('Please login first')" @endguest
                                            class="add-new-to-favorites"
                                            data-new-id="{{ $news->id }}"
                                        >
                                            <button type="button">
                                                <i
                                                    class="fa-regular fa-heart"
                                                ></i>
                                                <span>
                                                    {{ $news->favorites->count() }}
                                                </span>
                                            </button>
                                        </a>
                                        <a
                                            href="{{ route('site.new.show', ['id' => $news->id, 'title' => str_replace(' ', '-', $news->title)]) }}"
                                        >
                                            <i
                                                class="fa-regular fa-message"
                                            ></i>
                                            <span>
                                                {{ $news->comments->count() }}
                                            </span>
                                        </a>
                                        <button
                                            type="button"
                                            onclick="share_news('{{ route('site.new.show', ['id' => $news->id, 'title' => str_replace(' ', '-', $news->title)]) }}')"
                                        >
                                            <i
                                                class="fa-solid fa-share-nodes"
                                            ></i>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
                {{ $newsItems->links() }}
                <br />
            </div>
        </div>
    </main>
@endsection

@push("js")
    <script>
        function share_news(route) {
            if (navigator.share) {
                navigator
                    .share({
                        title: document.title,
                        text: 'Check out this news!',
                        // TODO: Add object id here
                        url: route,
                    })
                    .then(() => {
                        console.log('Thanks for sharing!');
                    })
                    .catch(console.error);
            }
        }
    </script>
@endpush