@extends('layouts.app')

@php
    $currentGenreId = request()->segment(3); 
    $activeGenre = collect($result['results'][0]['Genres'] ?? [])->firstWhere('id', $currentGenreId);
    $displayGenreName = $activeGenre ? $activeGenre['name'] : ($result['results'][0]['Genres'][0]['name'] ?? 'Unknown');
    $seoTitle = 'Genres ' . $displayGenreName . ' - ' . config('app.name');
    $seoDesc = 'Nonton koleksi drama pendek genre ' . $displayGenreName . ' terbaru dengan subtitle Indonesia. Gratis dan update setiap hari.';
@endphp
@section('title', $seoTitle)
@section('description', $seoDesc)
@section('image', config('app.og_image')) {{-- Gunakan logo default untuk halaman list --}}
@section('type', 'website')

@section('content')
<main class="container mt-3">
    <div class="kategori-container">
        <div class="kategori-wrapper" id="kategori-wrapper">
            @if($lang == 'in')
            <a href="javascript:void();" class="kategori-item aktif">Semua</a>
            @else
            <a href="javascript:void();" class="kategori-item aktif">All</a>
            @endif
    		@foreach($genre_list['genres'] as $genres)
    		<a href="{{$genres['permalink']}}" class="kategori-item">{{$genres['name']}}</a>
    		@endforeach
    	</div>
    	<button class="kategori-toggle-btn btn btn-light d-lg-none" type="button" id="kategori-toggle">
            <i class="bi bi-chevron-down"></i>
        </button>
    </div>
    @php
        /* 1. Ambil ID dari URL (Contoh: /in/genres/429 -> ambil 429)
           Jika URL Anda strukturnya berbeda, pastikan segment-nya tepat.
        */
        $currentGenreId = request()->segment(3); 
    
        /* 2. Cari nama genre yang ID-nya cocok dengan ID di URL 
           Kita mencari di dalam array 'Genres' milik data pertama
        */
        $activeGenre = collect($result['results'][0]['Genres'] ?? [])->firstWhere('id', $currentGenreId);
    
        /* 3. Tentukan nama yang akan ditampilkan. 
           Jika ketemu, pakai namanya. Jika tidak, pakai fallback atau genre pertama.
        */
        $displayGenreName = $activeGenre ? $activeGenre['name'] : ($result['results'][0]['Genres'][0]['name'] ?? 'Unknown');
    @endphp
    
    <div class="d-flex justify-content-between">
        <h4 class="section-title">Genres {{ $displayGenreName }}</h4>
    </div>
    <div class="row row-cols-3 row-cols-sm-3 row-cols-md-4 row-cols-lg-6 g-2">
        @foreach($result['results'] as $data)
            @php $genre = implode(', ', $data['Genre']); @endphp
            <div class="col">
                <div class="card card-drama">
                    @php
                    $permalink = ltrim($data['Permalink'], '/');
                    if (str_starts_with($permalink, $lang . '/')) {
                        $finalUrl = $permalink;
                    } else {
                        $finalUrl = $lang . '/' . $permalink;
                    }
                    @endphp
                    <a href="{{ url($finalUrl) }}" alt="{{ $data['Title'] }}">
                        <div class="position-relative">
                            <img src="{{ $data['Poster'] }}" class="card-img-top" alt="{{ $data['Title'] }}">
                            @if(!empty($data['Total_Episode']))
                                <span class=" card-img-overlay-top d-none d-sm-block">{{ $data['Total_Episode'] }} Episode</span>
                            @endif
                        </div>
                        <div class="card-body">
                            <h2 class="card-title">{{ $data['Title'] }}</h2>
                            <p class="card-text d-none d-sm-block">{{ $genre }}</p>
                        </div>
                    </a>
                </div>
            </div>
        @endforeach
    </div> 
    <x-pagination :current-page="$current_page" :total-pages="$total_pages" :base-url="$base_url" />
</main>
@endsection