{{-- Cukup sediakan wadah kosong, isinya akan diisi oleh JS agar tidak ditimpa main.js --}}
<section class="sidebar s-sidebar"></section>

@push('scripts')
<script type="text/javascript">
$(document).ready(function() {
    // 1. Ambil data dari Laravel ke dalam Variabel JS
    let contactsDB = @json(contact());
    let uploadPath = "{{ asset('uploads') }}"; 
    
    // Ambil gambar tema (Gunakan default jika null)
    let themeDownload = "{{ asset('uploads/'.theme()->download) }}";
    let themeContact = "{{ asset('uploads/'.theme()->contact) }}";

    function injectSidebarContacts() {
        // 2. BERSIHKAN INJEKSI DARI MAIN.JS TEMPLATE
        $('.s-sidebar').empty();

        // 3. BANGUN ULANG STRUKTUR HTML SIDEBAR
        let sidebarHTML = `
            <div class="sidebar__left">
                <a href="/secure/mobile">
                    <picture>
                        <img src="${themeDownload}" width="62" height="241" loading="lazy" alt="download">
                    </picture>
                </a>
            </div>
            <div class="sidebar__right s-cs">
                <a href="javascript:void(0);" class="contact">
                    <picture>
                        <img src="${themeContact}" width="61" height="241" loading="lazy" alt="contact">
                    </picture>
                </a>
                <ul id="g8-contact-list"></ul>
            </div>
        `;

        // Masukkan struktur yang bersih ke sidebar
        $('.s-sidebar').html(sidebarHTML);

        // 4. PROSES LIST KONTAK DARI DATABASE
        let listHTML = '';
        if(contactsDB && contactsDB.length > 0) {
            contactsDB.forEach(function(c) {
                let linkUrl = c.url || c.link || '#'; 
                let textName = c.title || c.nama || 'Contact';
                let iconDisplay = '';
                
                if (c.icon && c.icon.indexOf('.') !== -1) {
                    let imageUrl = uploadPath + '/' + c.icon;
                    iconDisplay = `<img src="${imageUrl}" alt="${textName}" style="width: 20px; height: 20px; margin-right: 10px; display: inline-block; vertical-align: middle; object-fit: contain;">`;
                } else {
                    let iconClass = c.icon || c.logo || 'fab fa-whatsapp'; 
                    iconDisplay = `<i class="${iconClass}"></i>`;
                }

                listHTML += `<li>
                                <a href="${linkUrl}" target="_blank" rel="noopener noreferrer nofollow">
                                    ${iconDisplay}<span>${textName}</span>
                                </a>
                             </li>`;
            });
        } 
        // 5. JIKA DATABASE KOSONG (Dummy Data)
        else {
            listHTML = `
                <li><a href="https://www.facebook.com/groups/forummantra" target="_blank" rel="noopener noreferrer nofollow" aria-label="facebook"><i class="fab fa-facebook-square"></i><span>groups/forummantra</span></a></li>
                <li><a href="https://www.instagram.com/mantra88_management" target="_blank" rel="noopener noreferrer nofollow" aria-label="instagram"><i class="fab fa-instagram"></i><span>@mantra88_management</span></a></li>
                <li><a href="http://line.me/ti/p/~MANTRA88ID" target="_blank" rel="noopener noreferrer nofollow" aria-label="line"><i class="fab fa-line"></i><span>MANTRA88ID</span></a></li>
                <li><a href="https://t.me/Mantra88_official" target="_blank" rel="noopener noreferrer nofollow" aria-label="telegram"><i class="fab fa-telegram"></i><span>@Mantra88_official</span></a></li>
                <li><a href="https://twitter.com/Mantra88___" target="_blank" rel="noopener noreferrer nofollow" aria-label="twitter"><i class="fab fa-twitter"></i><span>@Mantra88___</span></a></li>
                <li><a href="https://api.whatsapp.com/send?phone=6285924477704" target="_blank" aria-label="whatsapp"><i class="fab fa-whatsapp"></i><span>6285924477704</span></a></li>
                <li><a href="weixin://dl/chat?MANTRA88ID" aria-label="wechat"><i class="fab fa-weixin"></i><span>MANTRA88ID</span></a></li>
            `;
        }

        // Suntikkan list ke dalam UL yang baru saja kita buat
        $('#g8-contact-list').html(listHTML);
    }

    // 6. EKSEKUSI BYPASS (Sistem Sapu Bersih)
    // Beri jeda agar main.js selesai meload kode bawaannya, baru kita timpa
    setTimeout(injectSidebarContacts, 100);
    setTimeout(injectSidebarContacts, 800); // Eksekusi kedua untuk pengamanan ekstra
});
</script>
@endpush