---
import Base from "../../layout/Base.astro";

import { getCollection } from "astro:content";

const fics = (await getCollection("fanfic"))
    .filter(
        (entry) =>
            (!entry.data.wip || process.env.NODE_ENV === "development") &&
            !entry.data.parent
    )
    .sort((a, b) => a.data.title.localeCompare(b.data.title));
---

<Base title="ruthenic.com: Fanfics">
    <h1>Fanfics</h1>
    <div>
        {
            fics.map((fic) => (
                <a href={`/fanfic/${fic.slug}`}>
                    <div
                        class="main-content"
                        style="margin-bottom: 10px; font-size: 125%;"
                    >
                        <div style="display:flex;">
                            <b>{fic.data.title}</b>
                            {fic.data.oneshot ? (
                                <span>&nbsp;- (Oneshot)</span>
                            ) : undefined}
                        </div>
                        {fic.data.description ? (
                            <i>{fic.data.description}</i>
                        ) : undefined}
                        {fic.data.tags?.join(", ")}
                    </div>
                </a>
            ))
        }
    </div>
</Base>