const QUICK_LINKS = [
  { section: "Core", title: "Home Assistant", label: "OPEN CONTROL HUB", url: "http://localhost:8123" },
  { section: "Ops", title: "Uptime Kuma", label: "OPEN MONITORS", url: "http://localhost:3001" },
  { section: "Containers", title: "Portainer", label: "OPEN RUNTIME", url: "http://localhost:9000" },
  { section: "Media", title: "Immich", label: "OPEN GALLERY", url: "http://localhost:2283" },
];

export function renderQuickAccess() {
  const grid = document.getElementById("quick-grid");
  grid.innerHTML = QUICK_LINKS.map(
    (link) => `
      <article class="card quick-card">
        <div class="card-inner">
          <span class="card-label">${link.section}</span>
          <h2 class="card-title">${link.title}</h2>
          <a href="${link.url}" target="_blank" rel="noreferrer">
            <span>${link.label}</span>
            <span>&gt;</span>
          </a>
        </div>
      </article>
    `,
  ).join("");
}