@extends('root')

@section('title', 'Auto Reply Custom')

@section('content')
<div class="container-fluid">
    @include('components.breadcrumb', [
        'title' => 'Auto Reply Custom',
        'links' => [
            ['url' => route('client.dashboard'), 'label' => 'Dashboard'],
            ['url' => route('client.simple-autoreply.index'), 'label' => 'Auto Reply'],
        ],
        'current' => 'Auto Reply Custom'
    ])

    @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

    <div class="card mb-4">
        <div class="card-body py-3">
            <h5 class="mb-1">Balasan berdasarkan kata kunci</h5>
            <p class="text-muted mb-0 small">Ketika pesan masuk cocok dengan kata kunci (misal: "halo"), sistem membalas otomatis dengan respon yang Anda tentukan. Rule diperiksa sebelum Auto Reply umum (Simple Auto Reply).</p>
        </div>
    </div>

    <div class="card">
        <div class="card-header d-flex flex-wrap align-items-center justify-content-between gap-2">
            <h5 class="mb-0">Daftar Rule</h5>
            <div class="d-flex align-items-center gap-2">
                @if($wabaPools->isNotEmpty())
                <form method="get" class="d-flex align-items-center gap-2">
                    <select name="waba_pool_id" class="form-select form-select-sm" style="width: auto;" onchange="this.form.submit()">
                        <option value="">— Semua WABA —</option>
                        @foreach($wabaPools as $pool)
                            <option value="{{ $pool->id }}" {{ (string)$currentWabaPoolId === (string)$pool->id ? 'selected' : '' }}>{{ $pool->account_name ?? $pool->phone_number ?? 'WABA #'.$pool->id }}</option>
                        @endforeach
                    </select>
                </form>
                @endif
                <a href="{{ route('client.custom-autoreply.create', $currentWabaPoolId ? ['waba_pool_id' => $currentWabaPoolId] : []) }}" class="btn btn-primary btn-sm">
                    <i class="ti ti-plus me-1"></i> Tambah Rule
                </a>
            </div>
        </div>
        <div class="card-body p-0">
            @if($rules->isEmpty())
                <div class="p-4 text-center text-muted">
                    <p class="mb-2">Belum ada rule. Klik <strong>Tambah Rule</strong> atau gunakan contoh di bawah.</p>
                    <div class="small">
                        <strong>Contoh:</strong> Kata kunci <code>halo</code> → Balasan <code>Hai kak, ada yang bisa dibantu?</code>
                    </div>
                </div>
            @else
                <div class="table-responsive">
                    <table class="table table-hover table-striped mb-0">
                        <thead class="table-light">
                            <tr>
                                <th>Urutan</th>
                                <th>Kata kunci</th>
                                <th>Jenis cocok</th>
                                <th>Balasan</th>
                                <th>WABA</th>
                                <th>Status</th>
                                <th width="120">Aksi</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($rules as $rule)
                                <tr>
                                    <td>{{ $rule->sort_order }}</td>
                                    <td><code>{{ $rule->keyword }}</code></td>
                                    <td>
                                        @if($rule->keyword_type === 'exact') Persis
                                        @elseif($rule->keyword_type === 'starts_with') Awalan
                                        @else Mengandung
                                        @endif
                                    </td>
                                    <td class="text-break">
                                        @if($rule->reply_type === 'text')
                                            {{ Str::limit($rule->reply_payload['message'] ?? '-', 50) }}
                                        @else
                                            <span class="badge bg-secondary">{{ $rule->reply_type }}</span>
                                        @endif
                                    </td>
                                    <td>{{ $rule->wabaPool ? ($rule->wabaPool->account_name ?? $rule->wabaPool->phone_number ?? '#' . $rule->waba_pool_id) : 'Semua' }}</td>
                                    <td>
                                        @if($rule->is_active)
                                            <span class="badge bg-success">Aktif</span>
                                        @else
                                            <span class="badge bg-secondary">Nonaktif</span>
                                        @endif
                                    </td>
                                    <td>
                                        <a href="{{ route('client.custom-autoreply.edit', $rule) }}" class="btn btn-sm btn-outline-primary" title="Edit"><i class="ti ti-edit"></i></a>
                                        <form action="{{ route('client.custom-autoreply.destroy', $rule) }}" method="POST" class="d-inline" onsubmit="return confirm('Hapus rule ini?');">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="btn btn-sm btn-outline-danger" title="Hapus"><i class="ti ti-trash"></i></button>
                                        </form>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            @endif
        </div>
    </div>

    <div class="card mt-4">
        <div class="card-header">
            <h6 class="mb-0">Contoh konfigurasi</h6>
        </div>
        <div class="card-body">
            <p class="small text-muted mb-2">Anda bisa menambahkan rule seperti berikut agar pengguna langsung bisa mencoba:</p>
            <ul class="small mb-0">
                <li><strong>Kata kunci:</strong> <code>halo</code> (jenis: Mengandung) → <strong>Balasan:</strong> <code>Hai kak, ada yang bisa dibantu?</code></li>
                <li><strong>Kata kunci:</strong> <code>harga</code> (jenis: Mengandung) → <strong>Balasan:</strong> <code>Untuk info harga silakan ketik "katalog" atau hubungi CS kami.</code></li>
                <li><strong>Kata kunci:</strong> <code>info</code> (jenis: Awalan) → <strong>Balasan:</strong> <code>Berikut info layanan kami: ...</code></li>
            </ul>
        </div>
    </div>
</div>
@endsection