@php
  $tbEntryPages = config('tb_entry.pages', []);
  $tbEntryClinics = config('tb_entry.clinics', []);
  $tbClinicPrefixes = (array) config('tb_entry.general_id_prefixes', []);
  $currentTbPage = $currentPage ?? session('tb.entry_page', config('tb_entry.default_page', 'pretb'));
  $currentTbClinic = session('tb.clinic', config('tb_entry.default_clinic', 'Myitkyina'));
  $queuePanelId = $currentTbPage === 'tb03' ? 'tb03SyncPanel' : ($currentTbPage === 'pretb' ? 'pretbSyncPanel' : '');
@endphp

<form method="POST" action="{{ route('tb.entry.context') }}" class="tb-entry-context mb-3" id="tbEntryContextForm">
  @csrf
  <div class="row g-2 align-items-end">
    <div class="col-12 col-md-5">
      <label for="tb_entry_page" class="form-label mb-1">Data entry page</label>
      <select id="tb_entry_page" name="tb_entry_page" class="form-select">
        @foreach ($tbEntryPages as $key => $page)
          <option value="{{ $key }}" {{ $currentTbPage === $key ? 'selected' : '' }}>{{ $page['label'] }}</option>
        @endforeach
      </select>
    </div>
    <div class="col-12 col-md-5">
      <label for="tb_entry_clinic" class="form-label mb-1">Clinic name</label>
      <select id="tb_entry_clinic" name="tb_entry_clinic" class="form-select">
        @foreach ($tbEntryClinics as $clinic)
          <option value="{{ $clinic }}" {{ $currentTbClinic === $clinic ? 'selected' : '' }}>
            {{ $clinic }} : {{ $tbClinicPrefixes[$clinic] ?? '' }}
          </option>
        @endforeach
      </select>
    </div>
    <div class="col-12 col-md-2">
      <div class="d-flex gap-2">
        <button type="submit" class="btn btn-primary flex-grow-1 tb-entry-switch">Switch</button>
        @if ($queuePanelId !== '')
        <button type="button"
          class="btn tb-queue-panel-toggle"
          id="tbQueuePanelToggle"
          data-target="{{ $queuePanelId }}"
          aria-expanded="true"
          aria-controls="{{ $queuePanelId }}"
          title="Toggle browser queue">
          <span class="tb-queue-panel-toggle-icon" aria-hidden="true">&#9662;</span>
        </button>
        @endif
      </div>
    </div>
  </div>
</form>

<script>
  window.currentTbClinic = @json($currentTbClinic);
  window.tbClinicGeneralIdPrefixes = @json((array) config('tb_entry.general_id_prefixes', []));
  document.getElementById('tb_entry_page')?.addEventListener('change', function () {
    const form = document.getElementById('tbEntryContextForm');
    if (!form) return;
    if (typeof form.requestSubmit === 'function') {
      form.requestSubmit();
    } else {
      form.submit();
    }
  });
</script>