---
import ArticlePreview, {
    type Props as ArticlePreviewProps,
} from "./ArticlePreview.astro";

type Props = {
    articles: ArticlePreviewProps["article"][];
} & Omit<ArticlePreviewProps, "article">;

export type { Props };

const { articles, ...otherProps } = Astro.props;
---

{
    articles.length > 0 && (
        <ArticlePreview article={articles[0]} {...otherProps} />
    )
}

{
    articles.slice(1).map((a) => (
        <>
            <hr class="article-preview-hr" />
            <ArticlePreview article={a} {...otherProps} />
        </>
    ))
}

<style>
    hr.article-preview-hr {
        border: none;
        border-top: 1.5px dashed currentColor;
    }
</style>