@extends('layouts.app')

@section('title', __('whatsapp::lang.whatsapp') . ' — ' . __('whatsapp::lang.dashboard'))

@section('content')
<section class="content-header">
    <h1><i class="fab fa-whatsapp"></i> {{ __('whatsapp::lang.whatsapp') }}
        <small>{{ __('whatsapp::lang.dashboard') }}</small></h1>
</section>

<section class="content">
    @include('whatsapp::partials._nav')

    @foreach($needAttention as $channel)
        <div class="alert alert-warning alert-dismissible">
            <button type="button" class="close" data-dismiss="alert">&times;</button>
            <i class="fa fa-exclamation-triangle"></i>
            {{ __('whatsapp::lang.channel_disconnected_alert', ['label' => $channel->label]) }}
            <a href="{{ route('whatsapp.channels.connect', $channel->id) }}" class="btn btn-xs btn-warning" style="margin-left:8px;">
                <i class="fa fa-qrcode"></i> {{ __('whatsapp::lang.reconnect') }}
            </a>
        </div>
    @endforeach

    <div class="row">
        @php
            $cards = [
                ['channels',     __('whatsapp::lang.channels'),       'fa-mobile-alt', 'bg-aqua'],
                ['connected',    __('whatsapp::lang.status_active'),  'fa-check-circle', 'bg-green'],
                ['disconnected', __('whatsapp::lang.status_disconnected'), 'fa-unlink', 'bg-red'],
                ['pending',      __('whatsapp::lang.st_pending'),     'fa-clock', 'bg-yellow'],
                ['sent_today',   __('whatsapp::lang.st_sent') . ' (today)', 'fa-paper-plane', 'bg-light-blue'],
                ['failed',       __('whatsapp::lang.st_failed'),      'fa-times-circle', 'bg-maroon'],
            ];
        @endphp
        @foreach($cards as [$key, $label, $icon, $bg])
            <div class="col-md-2 col-sm-6">
                <div class="info-box {{ $bg }}">
                    <span class="info-box-icon"><i class="fa {{ $icon }}"></i></span>
                    <div class="info-box-content">
                        <span class="info-box-text">{{ $label }}</span>
                        <span class="info-box-number">{{ $stats[$key] }}</span>
                    </div>
                </div>
            </div>
        @endforeach
    </div>

    <div class="box box-primary">
        <div class="box-header with-border"><h3 class="box-title">{{ __('whatsapp::lang.channels') }}</h3></div>
        <div class="box-body table-responsive">
            <table class="table table-striped">
                <thead><tr>
                    <th>{{ __('whatsapp::lang.channel_label') }}</th>
                    <th>{{ __('whatsapp::lang.driver') }}</th>
                    <th>{{ __('whatsapp::lang.display_number') }}</th>
                    <th>{{ __('whatsapp::lang.status') }}</th>
                    <th>{{ __('whatsapp::lang.last_seen') }}</th>
                    <th></th>
                </tr></thead>
                <tbody>
                @forelse($channels as $channel)
                    <tr>
                        <td>{{ $channel->label }} @if($channel->is_default)<span class="label label-info">default</span>@endif</td>
                        <td>{{ $channel->driver === 'meta' ? __('whatsapp::lang.driver_meta') : __('whatsapp::lang.driver_web') }}</td>
                        <td>{{ $channel->display_number ?: '—' }}</td>
                        <td>
                            @php $cls = ['active'=>'success','scanning'=>'warning','connecting'=>'warning','disconnected'=>'danger','disabled'=>'default'][$channel->status] ?? 'default'; @endphp
                            <span class="label label-{{ $cls }}">{{ $channel->status_label }}</span>
                        </td>
                        <td>{{ optional($channel->last_heartbeat_at)->diffForHumans() ?? '—' }}</td>
                        <td>
                            @if($channel->driver === 'web' && $channel->status !== 'active')
                                <a href="{{ route('whatsapp.channels.connect', $channel->id) }}" class="btn btn-xs btn-warning"><i class="fa fa-qrcode"></i> {{ __('whatsapp::lang.connect') }}</a>
                            @endif
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="6" class="text-center text-muted">No channels yet. <a href="{{ route('whatsapp.channels.index') }}">Add a number</a>.</td></tr>
                @endforelse
                </tbody>
            </table>
        </div>
    </div>
</section>
@endsection
