@extends('frontend::layouts.app')

@section('title', 'Trainings - Activities - WBU - World Buddhist University')

@php
$activities = [
    [
        'id' => '10',
        'title' => 'The World Buddhist University in conjunction with the World Fellowship of Buddhists and the Pipphalivan Mindfulness Center (PMC) organized the International Seminar, “Life Management with Meditation :Experience and Success”, held consecutively during August 10th – 12th B.E. 2556 (2013) in Bangkok and Rayong, Thailand.',
        'date' => 'August 10th – 12th B.E. 2556 (2013)',
        'tag' => 'Trainings',
        'tag_id' => 'trainings',
        'image' => '/images/activity/10.jpg',
    ],
    [
        'id' => '13',
        'title' => 'Dharma Talk Series: The Path to Enlightenment',
        'date' => 'April 15, 2026',
        'tag' => 'Trainings',
        'tag_id' => 'trainings',
        'image' => '/images/activity-meditation.jpg',
    ],
    [
        'id' => '15',
        'title' => 'Sacred Texts Translation Workshop',
        'date' => 'May 1, 2026',
        'tag' => 'Trainings',
        'tag_id' => 'trainings',
        'image' => '/images/activity-art.jpg',
    ],
    [
        'id' => '19',
        'title' => 'Buddhist Psychology and Counseling Workshop',
        'date' => 'June 10, 2026',
        'tag' => 'Trainings',
        'tag_id' => 'trainings',
        'image' => '/images/activity-mindfulness.jpg',
    ],
];

$itemsPerPage = 12;
$currentPage = (int) request()->query('page', 1);
$totalPages = max(1, (int) ceil(count($activities) / $itemsPerPage));
$currentPage = max(1, min($currentPage, $totalPages));
$startIndex = ($currentPage - 1) * $itemsPerPage;
$paginatedActivities = array_slice($activities, $startIndex, $itemsPerPage);
@endphp

@section('content')
    <section id="page-title" class="gradient-green">
        <div class="container">
            <div class="page-title">
                <h1>Trainings</h1>
            </div>
            <div class="breadcrumb">
                <ul>
                    <li><a href="{{ route('frontend.index') }}">Home</a></li>
                    <li><a href="{{ url('/activities') }}">Activities</a></li>
                    <li class="active"><a href="#">Trainings</a></li>
                </ul>
            </div>
        </div>
    </section>

    <!-- Activities Section -->
    <section class="py-16 md:py-24 bg-background" style="background: url('{{ asset('assets/frontend/images/bg-dots.jpg') }}') center center; background-size: contain;">
        <div class="mx-auto max-w-7xl px-6 lg:px-8">
            <!-- Activities Grid -->
            <div class="grid sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
                @forelse($paginatedActivities as $activity)
                    @include('frontend::components.activity-card', [
                        'id' => $activity['id'],
                        'title' => $activity['title'],
                        'date' => $activity['date'],
                        'tag' => $activity['tag'],
                        'image' => $activity['image'],
                    ])
                @empty
                    <div class="sm:col-span-2 lg:col-span-3 xl:col-span-4">
                        <div class="text-center py-12">
                            <p class="text-muted-foreground">
                                No trainings found.
                            </p>
                        </div>
                    </div>
                @endforelse
            </div>

            <!-- Pagination -->
            @if($totalPages > 1)
                <div class="flex justify-center items-center gap-2 mt-12">
                    @php
                        $prevUrl = url('/activities/trainings') . '?' . http_build_query([
                            'page' => max(1, $currentPage - 1),
                        ]);
                        $nextUrl = url('/activities/trainings') . '?' . http_build_query([
                            'page' => min($totalPages, $currentPage + 1),
                        ]);
                    @endphp

                    <!-- Previous -->
                    <a href="{{ $currentPage === 1 ? '#' : $prevUrl }}"
                       class="inline-flex items-center justify-center rounded-md text-sm font-medium px-4 py-2 border border-border bg-background hover:bg-accent hover:text-accent-foreground transition-colors {{ $currentPage === 1 ? 'opacity-50 pointer-events-none' : '' }}">
                        Previous
                    </a>

                    <!-- Page Numbers -->
                    @for($page = 1; $page <= $totalPages; $page++)
                        @php
                            $pageUrl = url('/activities/trainings') . '?' . http_build_query([
                                'page' => $page,
                            ]);
                        @endphp
                        <a href="{{ $pageUrl }}"
                           class="min-w-[40px] inline-flex items-center justify-center rounded-md text-sm font-medium px-3 py-2 border transition-colors
                                  {{ $currentPage === $page ? 'bg-primary text-primary-foreground border-primary' : 'border-border bg-background text-foreground hover:bg-accent hover:text-accent-foreground' }}">
                            {{ $page }}
                        </a>
                    @endfor

                    <!-- Next -->
                    <a href="{{ $currentPage === $totalPages ? '#' : $nextUrl }}"
                       class="inline-flex items-center justify-center rounded-md text-sm font-medium px-4 py-2 border border-border bg-background hover:bg-accent hover:text-accent-foreground transition-colors {{ $currentPage === $totalPages ? 'opacity-50 pointer-events-none' : '' }}">
                        Next
                    </a>
                </div>
            @endif
        </div>
    </section>
@endsection