{{--
    Startups attendance table — props:
      $committee          : Committee
      $startupAttendances : Collection keyed by startup_id (may be empty)
      $hideOwnTitle?      : true → no <h3>, consumer renders its own header

    Single admin lane only (no public self-toggle exists for startups).
    Columns: Logo + Name (+ slot range / sector meta) + Attendance status
    (admin-controlled select). Phone + email were dropped in 2026-06;
    the row's name link leads to the startup show page where contacts
    are one click away.
--}}
@php
    use App\Models\CommitteeStartupAttendance;

    $labels = [
        CommitteeStartupAttendance::STATUS_PENDING        => __('admin.committees.attendance.startup.pending'),
        CommitteeStartupAttendance::STATUS_ATTENDED       => __('admin.committees.attendance.startup.attended'),
        CommitteeStartupAttendance::STATUS_DID_NOT_ATTEND => __('admin.committees.attendance.startup.did_not_attend'),
    ];

    $initialsOfStp = function (?string $name): string {
        $name = trim((string) $name);
        if ($name === '') return '—';
        $parts = preg_split('/\s+/u', $name);
        return mb_strtoupper(mb_substr($parts[0] ?? '', 0, 1) . mb_substr($parts[1] ?? '', 0, 1));
    };

    $optLabelStp = function ($opt) {
        if (! $opt) return null;
        $loc = app()->getLocale();
        return $loc === 'ar' ? ($opt->name_ar ?: $opt->name_en) : ($opt->name_en ?: $opt->name_ar);
    };
@endphp

@php $hideOwnTitle = $hideOwnTitle ?? false; @endphp
<section class="cmt-att-card" @if ($hideOwnTitle) style="border:0; background:transparent;" @endif>
    @if (! $hideOwnTitle)
        <header class="cmt-att-card__head">
            <h3>{{ __('admin.committees.fields.startups') }}
                <span class="cmt-att-card__count">({{ $committee->startups->count() }})</span>
            </h3>
        </header>
    @endif
    <div class="cmt-att-card__body">
        @if ($committee->startups->isEmpty())
            <div class="cmt-att-empty">—</div>
        @else
            <div class="cmt-att-scroll">
                <table class="cmt-att-table cmt-att-table--startups">
                    <thead>
                        <tr>
                            <th class="cmt-att-table__th cmt-att-table__th--avatar">&nbsp;</th>
                            <th class="cmt-att-table__th">{{ __('admin.committees.attendance.columns.startup') }}</th>
                            <th class="cmt-att-table__th">{{ __('admin.committees.attendance.columns.startup_attendance') }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($committee->startups as $startup)
                            @php
                                $row       = $startupAttendances->get($startup->id);
                                $current   = $row?->status ?? CommitteeStartupAttendance::STATUS_PENDING;
                                $logo      = $startup->files
                                    ? $startup->files->firstWhere('file_type', \App\Models\File::TYPE_IMAGE)
                                    : null;
                                $logoUrl   = $logo ? route('admin.files.show', $logo) : null;
                                $sector    = $optLabelStp($startup->sector ?? null);
                                $slotStart = $startup->pivot?->start_time ?? null;
                                $slotEnd   = $startup->pivot?->end_time   ?? null;
                                $slotRange = ($slotStart && $slotEnd)
                                    ? substr($slotStart, 0, 5) . ' → ' . substr($slotEnd, 0, 5) : null;
                            @endphp
                            <tr class="cmt-att-table__tr"
                                data-cmt-startup-att-row
                                data-update-url="{{ route('admin.committees.startups.attendance', [$committee, $startup]) }}">
                                <td class="cmt-att-table__td">
                                    <span class="cmt-att-avatar cmt-att-avatar--square">
                                        @if ($logoUrl)
                                            <img src="{{ $logoUrl }}" alt="">
                                        @else
                                            {{ $initialsOfStp($startup->name) }}
                                        @endif
                                    </span>
                                </td>
                                <td class="cmt-att-table__td">
                                    <a href="{{ route('admin.startups.show', $startup) }}" class="cmt-att-name">
                                        {{ $startup->name ?: '—' }}
                                    </a>
                                    @if ($slotRange || $sector)
                                        <div class="cmt-att-sub">
                                            @if ($slotRange)
                                                <span class="cmt-att-pill" dir="ltr">{{ $slotRange }}</span>
                                            @endif
                                            @if ($sector)
                                                <span class="cmt-att-pill cmt-att-pill--faint">{{ $sector }}</span>
                                            @endif
                                        </div>
                                    @endif
                                </td>
                                <td class="cmt-att-table__td">
                                    <select data-startup-status class="cmt-att-select">
                                        @foreach ($labels as $val => $label)
                                            <option value="{{ $val }}" @selected($current === $val)>{{ $label }}</option>
                                        @endforeach
                                    </select>
                                    <span data-startup-saved class="cmt-att-flag cmt-att-flag--ok">✓ {{ __('admin.committees.attendance.saved') }}</span>
                                    <span data-startup-error class="cmt-att-flag cmt-att-flag--err">! {{ __('admin.committees.attendance.save_failed') }}</span>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        @endif
    </div>
</section>

@once
@push('scripts')
<script>
(function () {
    function csrf() {
        var m = document.querySelector('meta[name="csrf-token"]');
        return m ? m.getAttribute('content') : '';
    }
    document.querySelectorAll('[data-cmt-startup-att-row]').forEach(function (row) {
        var url    = row.getAttribute('data-update-url');
        var select = row.querySelector('[data-startup-status]');
        var ok     = row.querySelector('[data-startup-saved]');
        var err    = row.querySelector('[data-startup-error]');
        if (!select || !url) return;
        select.addEventListener('change', async function () {
            ok.style.display = 'none'; err.style.display = 'none';
            select.disabled = true;
            try {
                var res = await fetch(url, {
                    method: 'PATCH',
                    credentials: 'same-origin',
                    headers: {
                        'Accept': 'application/json',
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': csrf(),
                        'X-Requested-With': 'XMLHttpRequest',
                    },
                    body: JSON.stringify({ status: select.value }),
                });
                var body = await res.json().catch(() => ({}));
                if (res.ok && body.ok) {
                    ok.style.display = 'inline';
                    setTimeout(function () { ok.style.display = 'none'; }, 1800);
                } else {
                    err.style.display = 'inline';
                }
            } catch (e) {
                err.style.display = 'inline';
            } finally {
                select.disabled = false;
            }
        });
    });
})();
</script>
@endpush
@endonce