@props(['type'])

@php
    $maps = [
        'roles' => [
            'title' => 'Peta peran dan batas kendali',
            'description' => 'Semakin sensitif perubahan, semakin ketat pemisahan kewenangannya.',
            'steps' => [
                ['Superadmin', 'Kontrol sistem, pengguna, 2FA, maintenance, serta backup dan restore.'],
                ['Admin', 'Master data, perangkat, kartu, santri, keluarga, dan kebijakan operasional.'],
                ['Bendahara', 'Tagihan, pembayaran, sesi kas, rekonsiliasi, penyesuaian, dan laporan.'],
                ['Petugas kios', 'Membuka sesi perangkat, menerima transaksi tunai, dan menghitung kas fisik.'],
                ['Wali & santri', 'Mengakses data milik sendiri dan membuat transaksi sesuai kebijakan.'],
                ['Pengasuh & pengelola', 'Pengawasan pesantren atau operasional unit usaha yang ditautkan.'],
            ],
        ],
        'install' => [
            'title' => 'Jalur instalasi yang dapat diverifikasi',
            'description' => 'Setiap tahap harus berhasil sebelum melanjutkan ke tahap berikutnya.',
            'steps' => [
                ['Dependensi', 'Composer dan npm memasang paket sesuai lock file.'],
                ['Environment', 'Salin .env, buat app key, lalu isi koneksi layanan.'],
                ['Database', 'Jalankan migration dan seeder role/data awal.'],
                ['Storage & queue', 'Buat storage link dan pastikan worker dapat berjalan.'],
                ['Build', 'Kompilasi CSS dan JavaScript produksi melalui Vite.'],
                ['Verifikasi', 'Jalankan test, login setiap role, dan smoke test transaksi.'],
            ],
        ],
        'deployment' => [
            'title' => 'Deployment aman dan dapat dibatalkan',
            'description' => 'Cutover dilakukan setelah salinan, pengujian, dan jalur rollback tersedia.',
            'steps' => [
                ['Persiapan', 'Catat versi, backup database/file, checksum, dan konfigurasi lama.'],
                ['Staging', 'Restore salinan lalu uji migration, queue, API, Midtrans, dan dokumen.'],
                ['Maintenance', 'Hentikan perubahan data saat sinkronisasi final dilakukan.'],
                ['Release', 'Deploy kode, migration, cache, storage, worker, dan scheduler.'],
                ['Smoke test', 'Uji login, saldo, tagihan, transaksi, callback, export, dan restore menu.'],
                ['Cutover / rollback', 'Alihkan trafik jika sehat; pulihkan versi dan data jika gagal.'],
            ],
        ],
        'database' => [
            'title' => 'Hubungan domain data utama',
            'description' => 'Identitas menjadi akar, sedangkan transaksi membentuk ledger yang diaudit.',
            'steps' => [
                ['Identitas', 'User, role, keluarga, wali, santri, lembaga, kamar, dan rayon.'],
                ['Akses fisik', 'Kartu santri, device, penugasan petugas, dan sesi kas.'],
                ['Kewajiban', 'Periode, jenis tagihan, tagihan, diskon, dan pembayaran.'],
                ['Ledger', 'Saldo santri, tabungan, kas sesi, serta saldo unit usaha.'],
                ['Kontrol', 'Rekonsiliasi, temuan, penyesuaian, snapshot, dan tutup buku.'],
                ['Keluaran', 'Audit log, notifikasi, invoice, kwitansi, laporan, dan export.'],
            ],
        ],
        'api-wali' => [
            'title' => 'Lifecycle request aplikasi wali',
            'description' => 'Token mengenali wali; ownership menentukan anak yang boleh diakses.',
            'steps' => [
                ['Login', 'Kredensial valid menghasilkan token Sanctum perangkat wali.'],
                ['Pilih anak', 'Aplikasi mengirim santri_id; server memeriksa hubungan keluarga.'],
                ['Validasi transaksi', 'PIN, saldo, tagihan, limit, status, dan idempotensi diperiksa.'],
                ['Service domain', 'Perubahan ledger dilakukan atomik dan tidak bergantung pada UI mobile.'],
                ['Respons', 'API Resource menjaga tipe JSON, status, nominal, dan referensi konsisten.'],
                ['Sinkronisasi', 'Notifikasi/deep link memperbarui UI tanpa menjadi sumber kebenaran.'],
            ],
        ],
        'api-kiosk' => [
            'title' => 'Lifecycle request perangkat kiosk',
            'description' => 'Perangkat dipercaya melalui token; biometrik mentah tidak dikirim ke server.',
            'steps' => [
                ['Token device', 'Sanctum memvalidasi perangkat dan ability kiosk.'],
                ['Tap kartu', 'UID mengidentifikasi kartu aktif dan santri yang sah.'],
                ['Verifikasi lokal', 'Perangkat mencocokkan sidik jari dan mengirim referensi hasil.'],
                ['Validasi server', 'Status, limit, sesi kas, saldo, dan kebijakan diperiksa kembali.'],
                ['Transaksi', 'Service melakukan perubahan atomik dan menyimpan device serta sesi.'],
                ['Bukti & heartbeat', 'Hasil diterbitkan dan status perangkat dipantau berkala.'],
            ],
        ],
    ];
    $map = $maps[$type] ?? null;
@endphp

@if ($map)
    <section class="dev-visual dev-journey not-prose" aria-label="{{ $map['title'] }}">
        <div class="dev-visual-heading">
            <div>
                <p class="dev-document-eyebrow">Ringkasan visual</p>
                <h2>{{ $map['title'] }}</h2>
            </div>
            <span class="dev-visual-legend">{{ $map['description'] }}</span>
        </div>
        <div class="dev-journey-track" role="list">
            @foreach ($map['steps'] as $index => [$title, $description])
                <div class="dev-journey-step" role="listitem">
                    <span>{{ str_pad((string) ($index + 1), 2, '0', STR_PAD_LEFT) }}</span>
                    <div>
                        <strong>{{ $title }}</strong>
                        <small>{{ $description }}</small>
                    </div>
                </div>
            @endforeach
        </div>
    </section>
@endif