From b72fbb501fdeda77222228ada30cd0b84b4adcf1 Mon Sep 17 00:00:00 2001
From: DIYgod <i@diygod.me>
Date: Thu, 8 Dec 2022 18:56:39 +0000
Subject: [PATCH] feat: use rehype-infer-description-meta to get excerpt

---
 showcase.json                    |  3 ++-
 src/components/site/SiteHome.tsx |  2 +-
 src/markdown/index.ts            |  6 +++---
 src/markdown/remark-excerpt.ts   | 19 -------------------
 tailwind.config.js               |  2 +-
 5 files changed, 7 insertions(+), 25 deletions(-)
 delete mode 100644 src/markdown/remark-excerpt.ts

diff --git a/showcase.json b/showcase.json
index 1a3480ee79..4bea7e71f7 100644
--- a/showcase.json
+++ b/showcase.json
@@ -56,5 +56,6 @@
   "henryq",
   "duoyu",
   "candinya",
-  "shang"
+  "shang",
+  "v1984"
 ]
diff --git a/src/components/site/SiteHome.tsx b/src/components/site/SiteHome.tsx
index 58ec7a2cbb..4fbfe821ab 100644
--- a/src/components/site/SiteHome.tsx
+++ b/src/components/site/SiteHome.tsx
@@ -81,7 +81,7 @@ export const SiteHome: React.FC<{
                       </span>
                     </div>
                     <div
-                      className="xlog-post-excerpt mt-3 text-zinc-500"
+                      className="xlog-post-excerpt mt-3 text-zinc-500 line-clamp-2"
                       style={{
                         wordBreak: "break-word",
                       }}
diff --git a/src/markdown/index.ts b/src/markdown/index.ts
index c690fcfc0f..a84e8e9c37 100644
--- a/src/markdown/index.ts
+++ b/src/markdown/index.ts
@@ -9,7 +9,6 @@ import rehypeRaw from "rehype-raw"
 import { refractor } from "refractor"
 import rehypePrismGenerator from "rehype-prism-plus/generator"
 import { rehypeImage } from "./rehype-image"
-import { remarkExcerpt } from "./remark-excerpt"
 import { rehypeTable } from "./rehype-table"
 import { remarkCallout } from "./remark-callout"
 import { rehypeExternalLink } from "./rehyper-external-link"
@@ -30,6 +29,7 @@ import type { Root } from "hast"
 import { Mention } from "~/components/ui/Mention"
 import remarkMath from "remark-math"
 import rehypeKatex from "rehype-katex"
+import rehypeInferDescriptionMeta from "rehype-infer-description-meta"
 
 export type MarkdownEnv = {
   excerpt: string
@@ -88,7 +88,6 @@ export const renderPageContent = (
         env.toc = toc(tree, { tight: true, ordered: true })
       })
       .use(remarkGfm, {})
-      .use(remarkExcerpt, { env })
       .use(remarkCallout)
       .use(remarkDirective)
       .use(remarkDirectiveRehype)
@@ -107,6 +106,7 @@ export const renderPageContent = (
       .use(rehypeTable)
       .use(rehypeExternalLink)
       .use(rehypeWrapCode)
+      .use(rehypeInferDescriptionMeta)
       .use(rehypeSlug)
       .use(rehypeAutolinkHeadings, {
         properties: {
@@ -155,7 +155,7 @@ export const renderPageContent = (
   return {
     contentHTML,
     element: result?.result,
-    excerpt: env.excerpt,
+    excerpt: result?.data.meta.description,
     frontMatter: env.frontMatter,
     cover: env.cover,
     toc: env.toc,
diff --git a/src/markdown/remark-excerpt.ts b/src/markdown/remark-excerpt.ts
deleted file mode 100644
index 338892432d..0000000000
--- a/src/markdown/remark-excerpt.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { Plugin } from "unified"
-import { MarkdownEnv } from "."
-import { Root } from "remark-gfm"
-import { toString as mdAstToString } from "mdast-util-to-string"
-
-export const remarkExcerpt: Plugin<Array<{ env: MarkdownEnv }>, Root> =
-  ({ env }) =>
-  (tree) => {
-    for (const node of tree.children) {
-      if (node.type === "paragraph") {
-        env.excerpt = mdAstToString(node, {
-          includeImageAlt: false,
-        }).slice(0, 140)
-        if (env.excerpt) {
-          break
-        }
-      }
-    }
-  }
diff --git a/tailwind.config.js b/tailwind.config.js
index 59150367db..75d59bb3cb 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -22,5 +22,5 @@ module.exports = {
     },
   },
   variants: {},
-  plugins: [],
+  plugins: [require("@tailwindcss/line-clamp")],
 }