---
import { SIDEBAR } from "../../config";

type Props = {
    section: string;
    language: string;
};
const { section, language } = Astro.props as Props;
---

<ul>
    {
        SIDEBAR[language || "en"][section].map((item) => (
            <li>
                {item.links ? (
                    <strong>{item.text}</strong>
                    <ul>
                        {item.links.map((link) => (
                            <li>
                                <a href={Astro.site?.pathname + link.link}>{link.text}</a>
                            </li>
                        ))}
                    </ul>
                ) : (
                    <a href={Astro.site?.pathname + (item.link ?? item.url)}>{item.text ?? item.title}</a>
                )}
            </li>
        ))
    }
</ul>

<style>
    ul {
        list-style: none;
        padding: 0;
    }
    li {
        margin: 0;
    }
    a {
        color: var(--color-text);
        text-decoration: none;
    }
    a:hover {
        text-decoration: underline;
    }
    details {
        margin: 0;
    }
    summary {
        cursor: pointer;
    }
</style>