@extends('dashboard.layouts.app')

@section('content')
    @include('components.alert')

    @php
        $statusVariant = fn ($status) => match ($status) {
            'pending' => 'warn',
            'accepted' => 'success',
            'rejected' => 'danger',
            default => 'neutral',
        };

        $preservedHolidayQuery = request()->only([
            'holiday_search',
            'holiday_start_date',
            'holiday_end_date',
            'holiday_per_page',
            'holiday_page',
        ]);

        $preservedLeaveQuery = request()->only([
            'status',
            'search',
            'per_page',
            'page',
        ]);
    @endphp

    <div class="container-fluid app-bg">
        <div class="page-shell">
            <div class="space-y-4">

                <x-page-title
                    title="My Leaves"
                    description="Track your leave requests, filter them by status, and review your assigned holiday dates.">
                </x-page-title>

                <div class="ui-card ui-card--table" style="margin-bottom: 15px">
                    <div class="ui-card__header d-flex flex-wrap align-items-center justify-content-between gap-3">
                        <div>
                            <div class="dashTitle">Leave Requests</div>
                            <div class="assesstHint">
                                Review submitted leave requests and follow their latest approval status.
                            </div>
                        </div>
{{-- 
                        <x-table-controls
                            action="{{ route('leaves.index') }}"
                            formId="leave-table-controls-form"
                            :clearUrl="route('leaves.index', $preservedHolidayQuery)"
                            :filters="[
                                'status' => [
                                    'pending' => 'Pending',
                                    'accepted' => 'Accepted',
                                    'rejected' => 'Rejected',
                                ],
                            ]">
                            @foreach ($preservedHolidayQuery as $queryKey => $queryValue)
                                <input type="hidden" name="{{ $queryKey }}" value="{{ $queryValue }}">
                            @endforeach
                        </x-table-controls> --}}
                    </div>

                    @if ($requests->isNotEmpty())
                        <x-table
                            :headers="['Type', 'From', 'To', 'Apply Date', 'Status', 'Actions']"
                            :paginator="$requests">

                            @foreach ($requests as $request)
                                <tr class="{{ $request->isEditable() ? 'ui-row-click' : '' }}"
                                    @if ($request->isEditable()) onclick="window.location='{{ route('leaves.edit', $request->id) }}'" @endif>
                                    <td class="text-center">
                                        <div class="ui-title">{{ $request->leaveType->type ?? 'N/A' }}</div>
                                    </td>

                                    <td class="text-center">
                                        <div class="ui-muted">{{ $request->leave_from }}</div>
                                    </td>

                                    <td class="text-center">
                                        <div class="ui-muted">{{ $request->leave_to }}</div>
                                    </td>

                                    <td class="text-center">
                                        <div class="ui-muted">{{ $request->created_at?->format('Y-m-d') }}</div>
                                    </td>

                                    <td class="text-center">
                                        <span class="ui-pill ui-pill--{{ $statusVariant($request->status) }}">
                                            {{ ucfirst($request->status) }}
                                        </span>
                                    </td>

                                    <td class="text-center" onclick="event.stopPropagation()">
                                        @if ($request->isEditable())
                                            <div class="ui-actions justify-content-center">
                                                <x-table-action type="edit" :url="route('leaves.edit', $request->id)" />
                                            </div>
                                        @else
                                            <span class="ui-muted">Locked</span>
                                        @endif
                                    </td>
                                </tr>
                            @endforeach
                        </x-table>
                    @else
                        <x-table
                            :headers="['Type', 'From', 'To', 'Apply Date', 'Status', 'Actions']"
                            :emptyMessage="'No leave requests found.'" />
                    @endif
                </div>

                <div class="ui-card ui-card--table">
                    <div class="ui-card__header d-flex flex-wrap align-items-center justify-content-between gap-3">
                        <div>
                            <div class="dashTitle">My Holiday</div>
                            <div class="assesstHint">
                                View holiday titles assigned to you, with dates and total counted days.
                            </div>
                        </div>

                        {{-- <x-table-controls
                            action="{{ route('leaves.index') }}"
                            formId="holiday-table-controls-form"
                            searchName="holiday_search"
                            searchPlaceholder=" search holiday title"
                            startDateName="holiday_start_date"
                            endDateName="holiday_end_date"
                            perPageName="holiday_per_page"
                            :date="true"
                            :clearUrl="route('leaves.index', $preservedLeaveQuery)">
                            @foreach ($preservedLeaveQuery as $queryKey => $queryValue)
                                <input type="hidden" name="{{ $queryKey }}" value="{{ $queryValue }}">
                            @endforeach
                        </x-table-controls> --}}
                    </div>

                    <x-table :headers="['Holiday Title', 'Assigned Dates', 'Total Days']" :paginator="$myHolidays"
                        :emptyMessage="'No holiday found.'">
                        @foreach ($myHolidays as $item)
                            @php
                                $dates = array_filter(explode(',', $item->assigned_dates));
                                $count = count($dates);
                                $formattedDates = array_map(function ($d) {
                                    return \Carbon\Carbon::parse(trim($d))->format('M d, Y');
                                }, $dates);
                            @endphp

                            <tr>
                                <td class="text-center">
                                    <div class="ui-title">{{ $item->holiday_title }}</div>
                                </td>

                                <td class="text-center">
                                    <div class="ui-muted">{{ implode(', ', $formattedDates) }}</div>
                                </td>

                                <td class="text-center">
                                    <span class="ui-pill ui-pill--info">{{ $count }} Days</span>
                                </td>
                            </tr>
                        @endforeach
                    </x-table>
                </div>

            </div>
        </div>
    </div>
@endsection