<ul class="main-menu__list">
    <li class="dropdown has-dropdown <?php if(request()->is(['aplikasi-jati*'])): ?> current <?php endif; ?>">
        <a href="#">Aplikasi Jati</a>
        <ul class="shadow-box">
            <li><a href="https://www.sejati.krsjawa3.com" target="_blank">Sejati</a></li>
            <li><a href="https://www.sinoman.krsjawa3.com" target="_blank">Sinoman</a></li>
            <li><a href="http://www.senyum.krsjawa3.com" target="_blank">Senyum</a></li>
            <li><a href="https://www.ngemong.krsjawa3.com" target="_blank">Ngemong</a></li>
        </ul>
    </li>
    <li class="dropdown has-dropdown <?php if(request()->is(['kondisi*'])): ?> current <?php endif; ?>">
        <a href="#">Kondisi Perumahan</a>
        <ul class="shadow-box">
            <li class="dropdown"><a href="#">Sebaran Rusun</a>
                <ul class="shadow-box">
                    <li><a href="/sebaranrusun"><?php echo e(env('KABKOTA')); ?></a></li>
                    <li><a href="/sebaranrusunprovinsi"><?php echo e(env('PROVINSI')); ?></a></li>
                </ul>
            </li>
            <li class="dropdown"><a href="#">Profil Kawasan Kumuh</a>
                <ul class="shadow-box">
                    <li>
                        <a href="" id="link-kumuh-kabkota" target="_blank"><?php echo e(env('KABKOTA')); ?></a>
                    </li>
                    <li>
                        <a href="" id="link-kumuh-provinsi" target="_blank"><?php echo e(env('PROVINSI')); ?></a>
                    </li>
                </ul>
            </li>
            <li><a href="/sebaransdgs">Sebaran Bantuan SDGS</a></li>
        </ul>
    </li>
    <li class="dropdown has-dropdown <?php if(request()->is(['info-kpr*'])): ?> current <?php endif; ?>">
        <a href="#">Info KPR</a>
        <ul class="shadow-box">
            <li><a href="/simulasikpr">Simulasi KPR</a></li>
            <li class="dropdown"><a href="#">Sikumbang</a>
                <ul class="shadow-box">
                    <li><a href="/sikumbangkabkota"><?php echo e(env('KABKOTA')); ?></a></li>
                    <li><a href="/sikumbangprovinsi"><?php echo e(env('PROVINSI')); ?></a></li>
                </ul>
            </li>
            <li><a href="https://sibaru.perumahan.pu.go.id/" target="_blank">Sibaru</a></li>
            <li><a href="https://my.pkp.go.id/cekbantuan" target="_blank">Cek Bantuan</a></li>
        </ul>
    </li>
    <li class="dropdown has-dropdown <?php if(request()->is(['bank-design*'])): ?> current <?php endif; ?>">
        <a href="#">Bank Desain</a>
        <ul class="shadow-box">
            <li><a href="/designprototype">Desain Prototipe</a></li>
            <li><a href="/designkrsjawa3">Desain KrsJawa3</a></li>
            <li><a href="/designliliput">Rumah Liliput UGM</a></li>
        </ul>
    </li>
    <li class="dropdown has-dropdown <?php if(request()->is(['informasi*'])): ?> current <?php endif; ?>">
        <a href="#">Informasi</a>
        <ul class="shadow-box">
            <li class="dropdown"><a href="/peraturan">Peraturan</a></li>
            <li class="dropdown"><a href="/artikel">Kegiatan KRS</a></li>
            <li class="dropdown"><a href="#">Arsitek Berlisensi</a>
                <ul class="shadow-box">
                    <li><a href="https://lisensi.iai-diy.com/" target="_blank">IAI D.I. Yogyakarta</a></li>
                    <li><a href="https://iai-jateng.or.id/" target="_blank">IAI Jawa Tengah</a></li>
                </ul>
            </li>
            <li class="dropdown"><a href="#">Bahan Bangunan</a>
                <ul class="shadow-box">
                    <li><a href="/material">Material</a></li>
                    <li><a href="https://klinikkonstruksi.jogjaprov.go.id/" target="_blank">Daerah Istimewa Yogyakarta</a></li>
                    <li><a href="https://maspetruk.dpubinmarcipka.jatengprov.go.id/" target="_blank">Jawa Tengah</a></li>
                </ul>
            </li>
            <li class="dropdown"><a href="#">Perizinan</a>
                <ul class="shadow-box">
                    <li><a href="/sertifikathakmilik">Sertifikat Hak Milik</a></li>
                    <li><a href="/pbg">Persetujuan Bangunan Gedung</a></li>
                </ul>
            </li>
            <li class="dropdown"><a href="#">Ruang Baca</a>
                <ul class="shadow-box">
                    
                    <li><a href="/bukuumum">Buku Umum</a></li>
                    <li><a href="/bukukrs3">Buku KRS</a></li>
                </ul>
            </li>
            <li><a href="/tentang">Tentang</a></li>
            <li><a href="https://www.krsjawa3.com/" target="_blank">Web Pusat Jawa III</a></li>
        </ul>
    </li>
</ul>

<script>
    // Fetch slum URLs from API
    (function() {
        const BASE_URL = '<?php echo e(env('AUTH_API_BASE_URL')); ?>';
        const DAERAH = '<?php echo e(env('DAERAH')); ?>';

        // Check if data is already cached in sessionStorage and apply immediately
        const cachedData = sessionStorage.getItem('slumUrlsData');
        if (cachedData) {
            try {
                const data = JSON.parse(cachedData);
                updateLinks(data);
            } catch (e) {
                // ignore parse error and continue to fetch fresh
                console.warn('Could not parse cached slumUrlsData, fetching fresh');
            }
        }

        // Always fetch fresh data (refresh cache and update links). This avoids stale cached data
        // preventing link updates when the API was updated after the first load.
        fetch(`${BASE_URL}/api/public/sites/${DAERAH}`)
            .then(response => {
                if (!response.ok) {
                    throw new Error('Network response was not ok');
                }
                return response.json();
            })
            .then(data => {
                try {
                    // Cache the data
                    sessionStorage.setItem('slumUrlsData', JSON.stringify(data));
                } catch (e) {
                    console.warn('Failed to cache slumUrlsData', e);
                }
                updateLinks(data);
            })
            .catch(error => {
                console.error('Error fetching slum URLs:', error);
            });

        function updateLinks(data) {
            const kabkotaLink = document.getElementById('link-kumuh-kabkota');
            const provinsiLink = document.getElementById('link-kumuh-provinsi');

            // helper: safely set href and only add target/rel when a valid URL is present
            function applyHref(el, url) {
                if (!el) return;
                if (url && typeof url === 'string' && url.trim()) {
                    el.href = url;
                    el.target = '_blank';
                    el.rel = 'noopener noreferrer';
                } else {
                    // remove target/rel if previously set and leave href as-is (do not change visible text)
                    el.removeAttribute('target');
                    el.removeAttribute('rel');
                    // keep existing href (usually '#') to avoid changing other attributes
                }
            }

            if (data && data.site) {
                applyHref(kabkotaLink, data.site.slum_url || null);
                applyHref(provinsiLink, (data.site.parent && data.site.parent.slum_url) ? data.site.parent.slum_url : null);
            }
        }
    })();

    // Force nested dropdowns to open on the left
    document.addEventListener('DOMContentLoaded', function() {
        // Get all nested dropdown items (dropdowns inside dropdowns)
        const nestedDropdowns = document.querySelectorAll('.shadow-box li.dropdown');

        nestedDropdowns.forEach(function(dropdown) {
            const submenu = dropdown.querySelector('.shadow-box');
            if (submenu) {
                // Force submenu to open on the left
                submenu.style.cssText =
                    'right: 100% !important; left: auto !important; margin-right: 5px !important; margin-left: 0 !important;';
            }
        });

        // Also handle on hover to ensure it stays in place
        const allDropdowns = document.querySelectorAll('.dropdown');
        allDropdowns.forEach(function(dropdown) {
            dropdown.addEventListener('mouseenter', function() {
                const submenu = this.querySelector('.shadow-box');
                if (submenu && this.closest('.shadow-box')) {
                    // This is a nested dropdown
                    submenu.style.cssText =
                        'right: 100% !important; left: auto !important; margin-right: 5px !important; margin-left: 0 !important; top: 0 !important; margin-top: 0 !important;';
                }
            });
        });
    });
</script>
<?php /**PATH D:\laravel\krs-jawa3-template\daerah\resources\views/components/menu_list.blade.php ENDPATH**/ ?>