@extends('layouts.sidebar')
@section('title', 'Nomadic - Partner Onboarding Tokens')
@section('content')
<div class="pagetitle d-flex justify-content-between align-items-center">
  <h1>Partner Onboarding Tokens</h1>
  <a href="{{ url('backend/partner-applications') }}" class="btn btn-outline-secondary btn-sm">
    <i class="bi bi-arrow-left"></i> Back to Applications
  </a>
</div>

@if(session('success'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
  {{ session('success') }}
  <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
@endif
@if(session('error'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
  {{ session('error') }}
  <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
@endif

@if(session('generated_url'))
<div class="alert alert-info alert-dismissible fade show" role="alert">
  <strong>Application Link:</strong>
  <div class="input-group mt-2">
    <input type="text" class="form-control" id="generatedUrl" value="{{ session('generated_url') }}" readonly>
    <button class="btn btn-outline-primary" type="button" onclick="copyUrl()">
      <i class="bi bi-clipboard"></i> Copy
    </button>
  </div>
  <small class="text-muted mt-1 d-block">Share this link with the partner to begin their application.</small>
  <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
@endif

<section class="section">
  <div class="row">
    {{-- Generate Token Form --}}
    <div class="col-lg-4">
      <div class="card">
        <div class="card-body">
          <h5 class="card-title">Generate New Token</h5>
          <form method="POST" action="{{ url('backend/partner-tokens/generate') }}">
            @csrf
            <div class="mb-3">
              <label class="form-label">Partner Name</label>
              <input type="text" name="partner_name" class="form-control" placeholder="e.g. Bangkok Creative Hub" value="{{ old('partner_name') }}">
              <small class="text-muted">Reference label for your records</small>
            </div>
            <div class="mb-3">
              <label class="form-label">Partner Email</label>
              <input type="email" name="partner_email" class="form-control" placeholder="contact@partner.com" value="{{ old('partner_email') }}">
              <small class="text-muted">Contact email for the partner</small>
            </div>
            <div class="mb-3">
              <div class="form-check">
                <input class="form-check-input" type="checkbox" name="send_email" id="sendEmail" value="1">
                <label class="form-check-label" for="sendEmail">
                  Send invitation email to partner
                </label>
              </div>
              <small class="text-muted">If checked, an invitation email with the application link will be sent automatically.</small>
            </div>
            <button type="submit" class="btn btn-primary w-100">
              <i class="bi bi-key"></i> Generate Token
            </button>
          </form>
        </div>
      </div>
    </div>

    {{-- Tokens List --}}
    <div class="col-lg-8">
      <div class="card">
        <div class="card-body pt-3">
          <div class="d-flex justify-content-between align-items-center mb-3">
            <h5 class="card-title mb-0">All Tokens</h5>
            <form method="GET" action="{{ url('backend/partner-tokens') }}" class="d-flex gap-2">
              <select name="status" class="form-select form-select-sm" style="width:auto;" onchange="this.form.submit()">
                <option value="">All Status</option>
                <option value="pending" {{ request('status')=='pending' ? 'selected' : '' }}>Pending</option>
                <option value="used" {{ request('status')=='used' ? 'selected' : '' }}>Used</option>
                <option value="expired" {{ request('status')=='expired' ? 'selected' : '' }}>Expired</option>
              </select>
            </form>
          </div>

          <div class="table-responsive">
            <table class="table tbl table-hover">
              <thead>
                <tr>
                  <td>Partner</td>
                  <td>Email</td>
                  <td>Status</td>
                  <td>Created By</td>
                  <td>Created</td>
                  <td>Expires</td>
                  <td></td>
                </tr>
              </thead>
              <tbody>
                @forelse($tokens as $token)
                <tr>
                  <td data-label="Partner">{{ $token->partner_name ?: '—' }}</td>
                  <td data-label="Email">{{ $token->partner_email ?: '—' }}</td>
                  <td data-label="Status">
                    @switch($token->status)
                      @case('pending')
                        <span class="badge bg-warning text-dark">Pending</span>
                        @break
                      @case('used')
                        <span class="badge bg-success">Used</span>
                        @break
                      @case('expired')
                        <span class="badge bg-secondary">Expired</span>
                        @break
                    @endswitch
                  </td>
                  <td data-label="Created By">{{ $token->creator ? trim(($token->creator->fname ?? '').' '.($token->creator->lname ?? '')) : '—' }}</td>
                  <td data-label="Created">{{ $token->created_at?->format('M d, Y') }}</td>
                  <td data-label="Expires">
                    {{ $token->expires_at?->format('M d, Y') }}
                    @if($token->used_at)
                      <br><small class="text-muted">Used: {{ $token->used_at->format('M d, Y') }}</small>
                    @endif
                  </td>
                  <td>
                    @if($token->status === 'pending')
                    <button class="btn btn-sm btn-outline-primary" onclick="copyTokenUrl('{{ $token->token }}')" title="Copy application link">
                      <i class="bi bi-link-45deg"></i>
                    </button>
                    @endif
                  </td>
                </tr>
                @empty
                <tr>
                  <td colspan="7">No tokens found</td>
                </tr>
                @endforelse
              </tbody>
              <tfoot>
                <tr>
                  <td colspan="7">
                    <div class="foot-paging">
                      {!! $tokens->links('vendor.pagination.bootstrap-5') !!}
                    </div>
                  </td>
                </tr>
              </tfoot>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
@endsection

@section('footer_scripts')
<script>
function copyUrl(){
  var input = document.getElementById('generatedUrl');
  input.select();
  input.setSelectionRange(0, 99999);
  navigator.clipboard.writeText(input.value);
  alert('Link copied to clipboard!');
}

function copyTokenUrl(token){
  var frontendUrl = {!! json_encode(rtrim(config('app.frontend_url', env('FRONTEND_URL', config('app.url'))), '/')) !!};
  var url = frontendUrl + '/partner-application?token=' + token;
  navigator.clipboard.writeText(url).then(function(){
    alert('Application link copied to clipboard!');
  });
}
</script>
@endsection