@extends('layouts.app')
@section('title', 'Import Preview')
@section('content')
    <x-page-head title="Import Preview" :subtitle="$preview['file_name']">
        <x-slot:actions>
            @if ($preview['valid_rows'] > 0)
                <form method="POST" action="{{ route('data.import.confirm', $preview['module']) }}" style="display:inline;">
                    @csrf
                    <input type="hidden" name="token" value="{{ $preview['token'] }}">
                    <button type="submit" class="btn btn-primary" onclick="return confirm('Import {{ $preview['valid_rows'] }} valid row(s)?')">Confirm Import</button>
                </form>
            @endif
            <a href="{{ route('data.import.index', $preview['module']) }}" class="btn btn-outline">Cancel</a>
        </x-slot:actions>
    </x-page-head>

    <div class="stat-grid" style="margin-bottom:16px;">
        <x-stat-card label="Total Rows" :value="$preview['total_rows']" />
        <x-stat-card label="Valid" :value="$preview['valid_rows']" color="teal" />
        <x-stat-card label="Invalid" :value="$preview['invalid_rows']" color="violet" />
    </div>

    @if ($preview['errors'])
        <x-panel title="Validation Errors" style="margin-bottom:16px;">
            <div class="table-wrap">
                <table>
                    <thead><tr><th>Row</th><th>Column</th><th>Value</th><th>Error</th><th>Suggestion</th></tr></thead>
                    <tbody>
                        @foreach (collect($preview['errors'])->take(50) as $error)
                            <tr>
                                <td>{{ $error['row_number'] ?? '—' }}</td>
                                <td>{{ $error['column'] ?? '—' }}</td>
                                <td>{{ $error['value'] ?? '—' }}</td>
                                <td style="color:var(--danger);">{{ $error['message'] }}</td>
                                <td>{{ $error['suggestion'] ?? '—' }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </x-panel>
    @endif

    <x-panel title="Preview (first 100 rows)">
        @if ($preview['preview'])
            <div class="table-wrap">
                <table>
                    <thead>
                        <tr>
                            <th>Row</th>
                            <th>Action</th>
                            @foreach (array_keys($preview['preview'][0]['data'] ?? []) as $col)
                                <th>{{ str_replace('_', ' ', ucfirst($col)) }}</th>
                            @endforeach
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($preview['preview'] as $row)
                            <tr style="{{ $row['errors'] ? 'background:rgba(239,68,68,0.08);' : '' }}">
                                <td>{{ $row['row_number'] }}</td>
                                <td><x-badge :variant="$row['action'] === 'create' ? 'green' : 'red'">{{ ucfirst($row['action']) }}</x-badge></td>
                                @foreach ($row['data'] as $value)
                                    <td>{{ Str::limit((string) $value, 40) }}</td>
                                @endforeach
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        @else
            <x-empty-state title="No data rows" message="The uploaded file contains no importable rows." />
        @endif
    </x-panel>
@endsection
