@extends('layouts.app')
@section('title','API Clients - NGBVD')

@section('content')
@include('integrations.partials.settings_style')
@php $clients = $clients ?? collect(); @endphp
<div class="ni-shell">
    <div class="ni-hero">
        <div>
            <span class="ni-kicker">Credential Management</span>
            <h2 class="ni-title">API Clients</h2>
            <p class="ni-subtitle">Create and manage dedicated credentials for UBOS GBV Portal, Sauti and approved partner systems. Each client should only receive the scopes required for its approved purpose.</p>
        </div>
        <div class="ni-actions">
            <a href="{{ url('/integrations') }}" class="btn ngbvd-btn-soft"><i class="ti-arrow-left"></i> Overview</a>
            <a href="{{ url('/integrations/api-urls') }}" class="btn ngbvd-btn-primary"><i class="ti-link"></i> API URLs</a>
        </div>
    </div>

    @if(session('new_api_client_secret') || session('message'))
        <div class="ni-secret">
            <i class="ti-key"></i>
            <div>
                <strong>{{ session('message') ?: 'API client created. Copy the secret now; it will not be shown again.' }}</strong>
                @if(session('new_api_client_key'))<br>Client Key: <code>{{ session('new_api_client_key') }}</code>@endif
                @if(session('new_api_client_secret'))<br>Client Secret: <code>{{ session('new_api_client_secret') }}</code>@endif
            </div>
        </div>
    @endif

    <div class="ni-layout-wide">
        <div class="ni-card">
            <div class="ni-card-body">
                <div class="ni-heading">
                    <div><h4>Registered API Clients</h4><p>Maintain separate clients for production, test and partner environments.</p></div>
                    <span class="ni-heading-icon"><i class="ti-server"></i></span>
                </div>
                <div class="ni-table-wrap">
                    <table class="table table-hover ni-table" data-datatable="false">
                        <thead><tr><th>Client</th><th>Client Key</th><th>Scopes</th><th>Status</th><th>Last Used</th></tr></thead>
                        <tbody>
                        @forelse($clients as $client)
                            @php $scopes = is_array($client->allowed_scopes) ? $client->allowed_scopes : preg_split('/[,\s]+/', (string)$client->allowed_scopes, -1, PREG_SPLIT_NO_EMPTY); @endphp
                            <tr>
                                <td><strong>{{ $client->name }}</strong><br><small class="text-muted">{{ $client->system_name ?: 'External system' }}</small></td>
                                <td><code class="ni-code">{{ $client->client_key }}</code></td>
                                <td>@forelse($scopes as $scope)<span class="ni-chip">{{ $scope }}</span>@empty<span class="text-muted">No scopes</span>@endforelse</td>
                                <td><span class="ni-badge {{ $client->is_active ? 'ni-success' : 'ni-danger' }}">{{ $client->is_active ? 'Active' : 'Inactive' }}</span></td>
                                <td>{{ $client->last_used_at ? \Carbon\Carbon::parse($client->last_used_at)->format('d M Y H:i') : 'Never' }}</td>
                            </tr>
                        @empty
                            <tr><td colspan="5"><div class="ni-empty"><i class="ti-key"></i><strong>No API clients registered</strong><span>Create the first authorised client using the panel on the right.</span></div></td></tr>
                        @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <div class="ni-card ni-panel ni-filter-card">
            <div class="ni-card-body">
                <div class="ni-heading">
                    <div><h4>Create API Client</h4><p>The generated secret is displayed once only.</p></div>
                    <span class="ni-heading-icon"><i class="ti-plus"></i></span>
                </div>
                <form method="POST" action="{{ url('/integrations/api-clients') }}">
                    @csrf
                    <div class="form-group"><label>Client Name</label><input class="form-control" name="name" required placeholder="e.g. UBOS Production Client"></div>
                    <div class="form-group"><label>System Name</label><input class="form-control" name="system_name" required placeholder="UBOS GBV Portal"></div>
                    <div class="form-group"><label>Allowed Scopes</label><textarea class="form-control" rows="4" name="allowed_scopes" placeholder="reference_data.read, incident_statistics.read, ubos.push, nsr.push">reference_data.read,incident_statistics.read,ubos.push,nsr.push</textarea><small class="text-muted">Use comma-separated scopes.</small></div>
                    <div class="form-group"><label>Allowed IPs</label><textarea class="form-control" rows="2" name="allowed_ips" placeholder="Optional comma-separated IP addresses"></textarea></div>
                    <button class="btn ngbvd-btn-primary btn-block"><i class="ti-save"></i> Create Client</button>
                </form>
                <div class="ni-info mt-3"><i class="ti-shield"></i><span>Only create credentials for approved systems. Use the smallest set of scopes required by the external system.</span></div>
            </div>
        </div>
    </div>
</div>
@endsection
