---
import { AdultFlag, FormattedDate, NewFlag } from "components";
import type { PostProps } from "content.config";
import { keyTypeNameMap } from "const";
import { type Post } from "types";
import { getPostUrl, isNew } from "utils";
import "./styles.css";

type DatePosition = "top" | "bottom";

export interface Props {
  datePosition?: DatePosition;
  includeCollection?: boolean;
  includeDescription?: boolean;
  item: Post;
}

const {
  datePosition: pDatePosition,
  includeCollection,
  includeDescription,
  item,
} = Astro.props as Props;
const { collection } = item;
const { adult, description, pubDate, title } = item.data as PostProps;
const showNewFlag = await isNew(item);
const url = getPostUrl(collection, item);
const datePosition: DatePosition = pDatePosition || "top";
---

<div class="link-to-post-container">
  {
    includeCollection && (
      <span class="collection-name">{keyTypeNameMap[collection]}</span>
    )
  }
  {datePosition === "top" && <FormattedDate date={pubDate} />}
  <div class="link-to-post">
    {showNewFlag && <NewFlag post={item} />}
    <a href={url}>{title}</a>
    {adult && <AdultFlag />}
  </div>
  {datePosition === "bottom" && <FormattedDate date={pubDate} />}
  {
    !!description && includeDescription && (
      <p class="item-description">{description}</p>
    )
  }
</div>