async function initPage() { try { const response = await fetch('/data.json'); const data = await response.json(); // Initialize dashboard initDashboard(data); // Show content document.querySelector('.dashboard-content').classList.remove('hidden'); document.querySelector('.skeleton-grid').classList.add('hidden'); } catch (error) { console.error('Error loading dashboard:', error); document.body.innerHTML = `

Failed to load dashboard

${error.message}

`; } } function initDashboard(data) { const grid = document.querySelector('grid-layout'); data.dashboard.widgets.forEach(widget => { const widgetEl = document.createElement(`${widget.type}-widget`); widgetEl.setAttribute('config', JSON.stringify(widget.config)); grid.appendChild(widgetEl); }); feather.replace(); } document.addEventListener('DOMContentLoaded', initPage);