@extends('layouts.client')
@section('title', 'Websites')
@section('content')
@if($creds)<div class="card p-3 mb-3 border-warning"><h2 class="h6">New credentials for {{ $creds['domain'] }} – shown once</h2>
  <x-secret label="API key (paste into the plugin)" :value="$creds['api_key']"/><x-secret label="Callback secret" :value="$creds['callback_secret']"/></div>@endif
@if($code)<div class="card p-3 mb-3 border-primary"><h2 class="h6">Your one-time pairing code (valid 30 minutes)</h2><x-secret label="Pairing code" :value="$code"/>
  <p class="small mb-0">In WordPress → VoiceOrder → Website Connection, paste this code and click Connect.</p></div>@endif
<div class="row g-3">
 <div class="col-lg-8"><div class="card"><div class="p-3 pb-0 d-flex justify-content-between"><h2 class="h6">Your websites</h2>
   <form method="post" action="{{ route('client.websites.pair') }}">@csrf<button class="btn btn-primary btn-sm" type="submit">Generate pairing code</button></form></div>
  @if($websites->isEmpty())<x-empty text="No website connected. Generate a pairing code and enter it in the VoiceOrder WordPress plugin."/>
  @else<div class="table-responsive"><table class="table align-middle mb-0"><thead><tr><th>Domain</th><th>Status</th><th>Plugin</th><th>Last sync</th><th></th></tr></thead><tbody>
  @foreach($websites as $w)<tr><td>{{ $w->normalized_domain }} @if($w->is_primary)<span class="badge-s s-info">primary</span>@endif</td><td><x-badge :v="$w->status"/></td><td>{{ $w->plugin_version ?? '—' }}</td><td>{{ $w->last_sync_at?->diffForHumans() ?? '—' }}</td>
   <td class="text-end text-nowrap">
   @if(in_array($w->status, ['active','pending_verification']))
    <form class="d-inline" method="post" action="{{ route('client.websites.disconnect', $w) }}" data-confirm="Disconnect {{ $w->normalized_domain }}? Calls stop immediately. Your website slot stays used; connecting a different domain needs admin approval.">@csrf<button class="btn btn-sm btn-outline-danger" type="submit">Disconnect</button></form>
    <button class="btn btn-sm btn-outline-secondary" data-bs-toggle="modal" data-bs-target="#rg{{ $w->id }}" type="button">Regenerate keys</button>
   @endif</td></tr>
   @if(in_array($w->status, ['active','pending_verification']))
   <div class="modal fade" id="rg{{ $w->id }}" tabindex="-1"><div class="modal-dialog"><form class="modal-content card" method="post" action="{{ route('client.websites.regenerate', $w) }}">@csrf<div class="modal-body"><h5>Regenerate credentials</h5>
    <p class="small text-muted">The current keys stop working immediately; update the plugin with the new ones. This does not reset free credits or website limits.</p><label class="form-label">Confirm your password</label><input class="form-control" type="password" name="password" required></div>
    <div class="modal-footer border-0"><button class="btn btn-light" data-bs-dismiss="modal" type="button">Cancel</button><button class="btn btn-danger" type="submit">Regenerate</button></div></form></div></div>@endif
  @endforeach</tbody></table></div>@endif</div></div>
 <div class="col-lg-4"><div class="card p-3"><h2 class="h6">Request an additional website</h2>
  <p class="small text-muted">Each account includes one website. Additional websites are reviewed by our team.</p>
  <form method="post" action="{{ route('client.websites.request') }}">@csrf<input class="form-control mb-2" type="url" name="url" placeholder="https://second-shop.com" required><textarea class="form-control mb-2" name="note" rows="2" placeholder="Why do you need it? (optional)"></textarea><button class="btn btn-outline-primary btn-sm" type="submit">Submit request</button></form>
  @if($requests->isNotEmpty())<hr><h3 class="h6">Your requests</h3>@foreach($requests as $q)<div class="small mb-2"><strong>{{ $q->normalized_domain }}</strong> <x-badge :v="$q->status"/>@if($q->rejection_reason)<div class="text-danger">Reason: {{ $q->rejection_reason }}</div>@endif @if($q->status==='approved')<div class="text-success">Approved – generate a pairing code and connect it from the plugin.</div>@endif</div>@endforeach @endif</div></div>
</div>
@endsection