import { ArticleDetail } from "@/app/_types/article";
import Link from "next/link";
import ArticleHeading from "@/app/_components/ArticleHeading";

const ArticleRender = ({ article }: { article: ArticleDetail }) => {
  return (
    <div className={"h-full"}>
      <ArticleHeading text={article.title} />
      <div dangerouslySetInnerHTML={{ __html: article.content }}></div>
      <div className={"bottom-nav mb-[50px] mt-[27px]"}>
        <div className={"prev"}>
          <span className={"text-base"}>上一篇</span>
          {article.prev ? (
            <Link
              className={"ml-8 text-sm text-[#666]"}
              href={`./${article.prev?.id}`}
            >
              {article.prev.title}
            </Link>
          ) : (
            <span className={"ml-8 cursor-not-allowed text-sm text-[#666]"}>
              没有了
            </span>
          )}
        </div>
        <div className={"next mt-8"}>
          <span className={"text-base"}>下一篇</span>
          {article.next ? (
            <Link
              className={"ml-8 text-sm text-[#666]"}
              href={`./${article.next?.id}`}
            >
              {article.next.title}
            </Link>
          ) : (
            <span className={"ml-8 cursor-not-allowed text-sm text-[#666]"}>
              没有了
            </span>
          )}
        </div>
      </div>
    </div>
  );
};

export default ArticleRender;