@extends('layouts.admin', ['title' => 'Webhooks'])

@section('admin-content')
<section class="grid gap-6 lg:grid-cols-[0.9fr_1.1fr]">
    <div class="rounded-[2rem] border border-white/10 bg-slate-900/70 p-6">
        <h1 class="font-display text-3xl font-bold text-white">Webhook endpoints</h1>
        <form method="POST" action="{{ route('admin.webhooks.store') }}" class="mt-6 space-y-4">
            @csrf
            <input name="name" placeholder="Endpoint name" title="Give the webhook a clear internal label" class="w-full rounded-2xl border border-white/10 bg-slate-950/80 px-4 py-3 text-white" required>
            <input name="target_url" placeholder="https://example.com/webhook" title="Enter the full HTTPS endpoint that will receive outbound events" class="w-full rounded-2xl border border-white/10 bg-slate-950/80 px-4 py-3 text-white" required>
            <input name="secret" placeholder="Signing secret" title="Optional: shared secret used to validate webhook payloads" class="w-full rounded-2xl border border-white/10 bg-slate-950/80 px-4 py-3 text-white">
            <input name="events" placeholder="license.activated, license.expired, subscription.renewed" title="Optional: comma-separated event names this endpoint should listen for" class="w-full rounded-2xl border border-white/10 bg-slate-950/80 px-4 py-3 text-white">
            <button type="submit" class="w-full rounded-2xl bg-brand-500 px-5 py-3 font-semibold text-white">Add webhook</button>
        </form>
    </div>
    <div class="rounded-[2rem] border border-white/10 bg-slate-900/70 p-6">
        <h2 class="font-display text-2xl font-semibold text-white">Registered endpoints</h2>
        <div class="mt-6 space-y-3">
            @foreach ($webhooks as $webhook)
                <div class="rounded-2xl border border-white/10 bg-white/5 p-4">
                    <div class="font-medium text-white">{{ $webhook->name }}</div>
                    <div class="text-sm text-slate-400">{{ $webhook->target_url }}</div>
                    <div class="mt-2 text-xs text-slate-500">{{ implode(', ', $webhook->events ?? []) ?: 'No event filter' }}</div>
                </div>
            @endforeach
        </div>
        <div class="mt-6">{{ $webhooks->links() }}</div>
    </div>
</section>
@endsection