---
import { sidebar } from '../config.ts';
---

<nav>
  <ul class="nav-groups">
    {sidebar.map(category => (
      <li>
        <div class="nav-group">
          <h4 class="nav-group-title"><a href={`${Astro.site}${category.link}`}>{category.text}</a></h4>
          <ul>
            {category.children.map(child => (
              <li class="nav-link"><a href={`${Astro.site}${child.link}`}>{child.text}</a></li>
            ))}
          </ul>
        </div>
      </li>
    ))}
  </ul>
</nav>