@extends('layouts.app')
@section('title', $device->name.' — RouterOS')

@section('content')
    <div class="page-head">
        <div>
            <h1>{{ $device->name }}</h1>
            <p>Live RouterOS state read over the API from <span class="mono">{{ $device->management_ip }}:{{ $device->mgmt_port }}</span>.</p>
        </div>
        <div class="row-actions">
            <a href="{{ route('devices.show', $device) }}" class="btn ghost">&larr; Device</a>
            <a href="{{ route('devices.index') }}" class="btn ghost">All devices</a>
        </div>
    </div>

    {{-- Identity / resource / health are arbitrary RouterOS key-value maps. --}}
    @foreach ([
        'identity'   => 'System identity',
        'resource'   => 'Resources',
        'health'     => 'Hardware health',
    ] as $key => $heading)
        @php $rows = $info[$key] ?? []; @endphp
        @if (! empty($rows))
            <div class="card">
                <div class="card-head"><h2>{{ $heading }}</h2></div>
                <div class="card-body tight">
                    <div class="table-wrap">
                        <table class="data">
                            <tbody>
                            @foreach ($rows as $field => $value)
                                <tr>
                                    <th class="row-head mono">{{ $field }}</th>
                                    <td class="mono">{{ is_scalar($value) ? $value : json_encode($value) }}</td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        @endif
    @endforeach

    @php $interfaces = $info['interfaces'] ?? []; @endphp
    <div class="card">
        <div class="card-head">
            <h2>Interfaces</h2>
            <span class="muted small">{{ count($interfaces) }} reported by the device</span>
        </div>
        <div class="card-body tight">
            @if (! empty($interfaces))
                <div class="table-wrap">
                    <table class="data">
                        <thead>
                        <tr>
                            <th>Name</th><th>Type</th><th>MAC</th><th class="num">MTU</th>
                            <th>Running</th><th class="num">Rx</th><th class="num">Tx</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach ($interfaces as $iface)
                            <tr>
                                <td class="mono">{{ $iface['name'] ?? '—' }}</td>
                                <td>{{ $iface['type'] ?? '—' }}</td>
                                <td class="mono small">{{ $iface['mac-address'] ?? '—' }}</td>
                                <td class="num">{{ $iface['mtu'] ?? '—' }}</td>
                                <td>
                                    @php $running = ($iface['running'] ?? 'false') === 'true'; @endphp
                                    <span class="badge {{ $running ? 'good' : 'muted' }}">{{ $running ? 'running' : 'stopped' }}</span>
                                </td>
                                <td class="num mono small">{{ isset($iface['rx-byte']) ? human_bytes((int) $iface['rx-byte']) : '—' }}</td>
                                <td class="num mono small">{{ isset($iface['tx-byte']) ? human_bytes((int) $iface['tx-byte']) : '—' }}</td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            @else
                @include('components.empty-state', [
                    'title' => 'No interfaces reported',
                    'message' => 'The device accepted the API session but returned an empty /interface/print.',
                ])
            @endif
        </div>
    </div>

    <p class="muted small">
        Read at {{ now()->format('j M Y H:i:s') }}. This page queries the device live; nothing here is cached.
    </p>
@endsection