@extends('layouts.admin', ['title' => 'Integrações'])

@section('content')
<div class="space-y-6">
    <div class="flex justify-end">
        <a href="{{ route('admin.integrations.nuvemshop.connect') }}" class="btn-primary">
            Conectar via OAuth Nuvemshop
        </a>
    </div>
    @foreach($integrations as $integration)
        <form method="POST" action="{{ route('admin.integrations.update', $integration) }}" class="card space-y-5">
            @csrf @method('PUT')
            <div class="flex items-center justify-between">
                <div>
                    <h2 class="text-lg font-bold">{{ $integration->provider->name }}</h2>
                    <p class="text-sm text-slate-500">Credenciais da loja vinculada ao provider.</p>
                </div>
                <span class="rounded-full bg-slate-100 px-3 py-1 text-sm">{{ $integration->status->label() }}</span>
            </div>
            <div class="grid gap-4 md:grid-cols-2">
                <div><label class="input-label">Store/User ID Nuvemshop</label><input class="input-field" name="external_store_id" value="{{ $integration->external_store_id }}"></div>
                <div><label class="input-label">Status</label><select class="input-field" name="status">@foreach(App\Enums\IntegrationStatus::cases() as $status)<option value="{{ $status->value }}" @selected($integration->status===$status)>{{ $status->label() }}</option>@endforeach</select></div>
                <div><label class="input-label">Access token</label><input class="input-field" name="access_token" placeholder="Deixe vazio para manter"></div>
                <div><label class="input-label">Refresh token</label><input class="input-field" name="refresh_token" placeholder="Opcional"></div>
                <div class="md:col-span-2"><label class="input-label">Scopes</label><input class="input-field" name="scopes" value="{{ implode(',', $integration->scopes ?? []) }}" placeholder="read_orders,write_coupons"></div>
            </div>
            <button class="btn-primary">Salvar integração</button>
        </form>
    @endforeach

    <div class="rounded-2xl border border-amber-200 bg-amber-50 p-5 text-sm text-amber-900">
        <strong>OAuth preparado:</strong> as credenciais globais do app ficam no `.env`; as credenciais da loja ficam nesta tela em `store_integrations`.
    </div>
</div>
@endsection