update

app/components/ArticleList.tsx

@@ -0,0 +1,44 @@
+import React from "react";
+import { listArticles } from "@/app/api/articles";
+import styles from "./ArticleList.module.scss";
+import Link from "next/link";
+import Pagination from "@/app/components/Pagination";
+import dayjs from "dayjs";
+
+const ArticleList = async ({
+  cid,
+  pageNo,
+  title,
+}: {
+  title: string;
+  cid: string;
+  pageNo: number;
+}) => {
+  const data = await listArticles({
+    pageNo,
+    cid,
+    pageSize: 20,
+    sort: "new",
+  });
+  return (
+    <>
+      <h2 className={"text-[#0f6fca] text-sm"}>{title}</h2>
+      <ul className={`${styles.articles} mt-5`}>
+        {data.lists.map((article, index) => (
+          <li className={`${styles.article}`} key={article.id}>
+            <Link
+              className={"flex h-8 text-sm text-[#666666] items-center"}
+              href={`../${article.id}`}
+            >
+              <span className={"flex-1 w-0 truncate"}>{article.title}</span>
+              <span>{dayjs(article.createTime).format("YYYY-MM-DD")}</span>
+            </Link>
+          </li>
+        ))}
+      </ul>
+      <Pagination page={pageNo} total={data.count} perPage={20} />
+    </>
+  );
+};
+
+export default ArticleList;