@extends('layouts.admin_layout')

@section('content')

<main class="h-full pb-16 overflow-y-auto">
  <div class="container grid px-6 mx-auto">
    <h2 class="my-6 text-2xl font-semibold text-gray-700 dark:text-gray-200">
      <span class="text-blue-500">Grant</span> Tiers
    </h2>
    <p class="mb-4 text-sm text-gray-500 dark:text-gray-400">
      Configure each grant's amount, expiry (n) days, required active team members, and the requirements text shown to users. Changes only apply to grants issued after saving -- grants already running keep the values they were issued with.
    </p>

    <div class="flex items-center gap-3 mb-6">
      <a href="{{ route('admin.grant-tiers.create') }}" class="px-4 py-2 text-xs font-semibold text-white bg-blue-600 rounded-md">
        + New Tier
      </a>
      <a href="{{ route('admin.all-grants') }}" class="px-4 py-2 text-xs font-semibold rounded-md bg-gray-100 text-gray-600 dark:bg-gray-800 dark:text-gray-300">
        All Grants
      </a>
      <a href="{{ route('admin.grants') }}" class="px-4 py-2 text-xs font-semibold rounded-md bg-gray-100 text-gray-600 dark:bg-gray-800 dark:text-gray-300">
        Pending Review Queue
      </a>
    </div>

    <x-alert/>

    @foreach(['pre' => 'Pre-Grant Tiers (instant disbursement)', 'post' => 'Post-Grant Tiers (admin-reviewed)'] as $type => $label)
    <h4 class="mt-4 mb-4 text-lg font-semibold text-gray-600 dark:text-gray-300">{{ $label }}</h4>
    <div class="w-full overflow-hidden mb-10 rounded-lg shadow-xs">
      <div class="w-full overflow-x-auto">
        <table class="w-full whitespace-no-wrap">
          <thead>
            <tr class="text-xs font-semibold tracking-wide text-left text-gray-500 uppercase border-b dark:border-gray-700 bg-gray-50 dark:text-gray-400 dark:bg-gray-800">
              <th class="px-4 py-3">Name</th>
              <th class="px-4 py-3">Amount</th>
              <th class="px-4 py-3">Expiry (days)</th>
              <th class="px-4 py-3">Active Team Members Required</th>
              <th class="px-4 py-3">Status</th>
              <th class="px-4 py-3">Actions</th>
            </tr>
          </thead>
          <tbody class="bg-white divide-y dark:divide-gray-700 dark:bg-gray-800">
          @forelse($tiers->where('type', $type) as $tier)
            <tr class="text-gray-700 dark:text-gray-400">
              <td class="px-4 py-3">
                <p class="font-semibold">{{ $tier->name }}</p>
                @if($tier->ai_requirement)
                <p class="text-xs text-gray-500">AI: {{ $tier->ai_requirement }}</p>
                @endif
              </td>
              <td class="px-4 py-3 text-sm">${{ number_format($tier->amount, 2) }}</td>
              <td class="px-4 py-3 text-sm">{{ $tier->expiry_days }}</td>
              <td class="px-4 py-3 text-sm">{{ $tier->required_active_referrals }}</td>
              <td class="px-4 py-3 text-xs">
                @if($tier->is_active)
                <span class="px-2 py-1 font-semibold leading-tight text-green-700 bg-green-100 rounded-full dark:bg-green-700 dark:text-green-100">Active</span>
                @else
                <span class="px-2 py-1 font-semibold leading-tight text-gray-600 bg-gray-100 rounded-full dark:bg-gray-700 dark:text-gray-300">Disabled</span>
                @endif
              </td>
              <td class="px-4 py-3 text-sm">
                <div class="flex items-center gap-3">
                  <a href="{{ route('admin.grant-tiers.edit', $tier->id) }}" class="text-blue-500 underline">Edit</a>

                  <form action="{{ route('admin.grant-tiers.toggle', $tier->id) }}" method="post">
                    @csrf
                    <button type="submit" class="text-amber-600 underline">{{ $tier->is_active ? 'Disable' : 'Enable' }}</button>
                  </form>

                  <form action="{{ route('admin.grant-tiers.destroy', $tier->id) }}" method="post" onsubmit="return confirm('Delete this tier? This only works if no grants have been issued from it yet.');">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="text-red-600 underline">Delete</button>
                  </form>
                </div>
              </td>
            </tr>
          @empty
            <tr><td class="px-4 py-3 text-sm" colspan="6">No {{ $type }} tiers yet.</td></tr>
          @endforelse
          </tbody>
        </table>
      </div>
    </div>
    @endforeach

  </div>
</main>

@endsection