@php
  $editId = (int) request('edit');
  $row = $editId ? $events->firstWhere('id', $editId) : null;
  $open = $row || request()->has('new') || $errors->any();
  $upcoming = $events->where('status', 'published')->filter(fn ($e) => $e->starts_at->isFuture())->count();
  $modes = ['online' => 'Online', 'onsite' => 'On campus', 'hybrid' => 'Hybrid (campus + online)'];
@endphp

@if($open)
<form method="post" action="{{ route('admin.content.events.save') }}" id="editor" class="b2-editor" novalidate>
  @csrf
  <input type="hidden" name="id" value="{{ old('id', $row?->id) }}">
  <div class="panel">
    <div class="panel-head"><h2>{{ $row ? 'Edit event' : 'New event' }}</h2><a class="btn btn-ghost btn-sm" href="{{ route('admin.content.index', ['tab' => 'events']) }}">Cancel</a></div>
    <div class="panel-body">
      <div class="form-grid">
        <x-field name="title" id="ev-title" label="Event title" :value="$row?->title" required full placeholder="e.g. Free AWS Cloud Workshop"/>
        <x-field name="starts_at" id="ev-start" type="datetime-local" label="Starts" :value="$row?->starts_at?->format('Y-m-d\TH:i')" required help="Karachi time (PKT)."/>
        <x-field name="ends_at" id="ev-end" type="datetime-local" label="Ends" :value="$row?->ends_at?->format('Y-m-d\TH:i')" help="Optional. Must be after the start."/>
        <x-field name="mode" id="ev-mode" type="select" label="Format" :options="$modes" :value="$row?->mode ?? 'online'" required/>
        <x-field name="status" id="ev-status" type="select" label="Status" :options="['published' => 'Published — visible on the website', 'draft' => 'Draft — hidden', 'cancelled' => 'Cancelled — shown as cancelled']" :value="$row?->status ?? 'published'" required/>
        <x-field name="location" id="ev-loc" label="Venue" :value="$row?->location" placeholder="e.g. INFOTICS campus, Karachi" help="For on-campus and hybrid events."/>
        <x-field name="meeting_url" id="ev-meet" type="url" label="Online joining link" :value="$row?->meeting_url" placeholder="https://…" help="Zoom, Teams or Meet link. Registered attendees receive it."/>
        <x-field name="registration_url" id="ev-reg" type="url" label="Registration link" :value="$row?->registration_url" placeholder="https://…" help="Optional. Leave empty to send people to the contact page." full/>
        <div class="field full">
          <label class="label" for="ev-desc">Description</label>
          <textarea class="textarea @error('description') is-invalid @enderror" id="ev-desc" name="description" rows="5" maxlength="3000" data-counter="3000">{{ old('description', $row?->description) }}</textarea>
          <div class="help b2-help-row"><span>Say who it is for, what will be covered and what attendees should bring.</span><span class="mono" data-counter-out></span></div>
          @error('description')<div class="field-error">{{ $message }}</div>@enderror
        </div>
      </div>
      <div class="row" style="justify-content:flex-end"><button class="btn btn-primary" type="submit"><x-icon name="check" :size="16"/> Save event</button></div>
    </div>
  </div>
</form>
@endif

<div class="panel">
  <div class="panel-head">
    <div><h2>Events</h2><div class="xs muted">{{ $events->count() }} total · {{ $upcoming }} upcoming and published</div></div>
    @unless($open)<a class="btn btn-primary btn-sm" href="{{ route('admin.content.index', ['tab' => 'events', 'new' => 1]) }}#editor"><x-icon name="plus" :size="16"/> New event</a>@endunless
  </div>
  @if($events->isEmpty())
    <x-empty icon="calendar" title="No events yet" text="Demo classes, workshops and open days appear on the public events page once published."><a class="btn btn-primary btn-sm" href="{{ route('admin.content.index', ['tab' => 'events', 'new' => 1]) }}#editor">Add the first event</a></x-empty>
  @else
  <div class="table-wrap b2-flush">
    <table class="table ad-table b2-cms">
      <thead><tr><th>Event</th><th>When</th><th>Format</th><th>Status</th><th class="actions">Actions</th></tr></thead>
      <tbody>
      @foreach($events as $e)
        <tr>
          <td><a class="b2-title" href="{{ route('admin.content.index', ['tab' => 'events', 'edit' => $e->id]) }}#editor">{{ $e->title }}</a><span class="b2-sub">{{ $e->location ?: ($e->meeting_url ? 'Online link added' : 'No venue or link yet') }}</span></td>
          <td class="nowrap small">{{ $e->starts_at->format('D, d M Y') }}<span class="b2-sub">{{ $e->starts_at->format('g:i A') }}{{ $e->ends_at ? ' – '.$e->ends_at->format('g:i A') : '' }} · {{ $e->starts_at->isPast() ? 'past' : 'upcoming' }}</span></td>
          <td>{{ $modes[$e->mode] ?? ucfirst($e->mode) }}</td>
          <td><x-pill :status="$e->status"/></td>
          <td class="actions">
            <div class="ad-actions">
              <form method="post" action="{{ route('admin.content.toggle', ['type' => 'events', 'id' => $e->id]) }}">@csrf<button class="btn btn-secondary btn-sm" type="submit">{{ $e->status === 'published' ? 'Unpublish' : 'Publish' }}</button></form>
              <a class="icon-btn" href="{{ route('admin.content.index', ['tab' => 'events', 'edit' => $e->id]) }}#editor" aria-label="Edit {{ $e->title }}" title="Edit"><x-icon name="edit" :size="16"/></a>
              <form method="post" action="{{ route('admin.content.events.delete', $e) }}" data-confirm="Delete the event “{{ $e->title }}”? This cannot be undone.">@csrf @method('DELETE')<button class="icon-btn" type="submit" aria-label="Delete {{ $e->title }}" title="Delete"><x-icon name="trash" :size="16"/></button></form>
            </div>
          </td>
        </tr>
      @endforeach
      </tbody>
    </table>
  </div>
  @endif
</div>