refactor(mobile): simplify heading component and remove unused imports

Signed-off-by: Innei <tukon479@gmail.com>
RSSNext · Feb 11, 2025 · db5bd26 · db5bd26
1 parent 970c932
commit db5bd26
Showing 1 changed file with 15 additions and 30 deletions.
diff --git a/apps/mobile/web-app/html-renderer/src/components/heading.tsx b/apps/mobile/web-app/html-renderer/src/components/heading.tsx
@@ -1,10 +1,14 @@
-import { useScrollViewElement } from "@follow/components/ui/scroll-area/hooks.js"
-import { springScrollToElement } from "@follow/utils/scroller"
 import { cn } from "@follow/utils/utils"
-import { useContext, useId, useRef } from "react"
-
-import { MarkdownRenderContainerRefContext } from "./__internal/ctx"
+import { useId, useRef } from "react"
 
+const size = {
+  1: "text-[1.6em]",
+  2: "text-[1.5em]",
+  3: "text-[1.3em]",
+  4: "text-[1.1em]",
+  5: "text-[1.05em]",
+  6: "text-[1em]",
+}
 export const createHeadingRenderer =
   (level: number) =>
   (
@@ -15,35 +19,16 @@ export const createHeadingRenderer =
     const As = `h${level}` as any
     const { node, ...rest } = props as any
 
-    const scroller = useScrollViewElement()
-    const renderContainer = useContext(MarkdownRenderContainerRefContext)
     const ref = useRef<HTMLHeadingElement>(null)
 
     return (
-      <As ref={ref} {...rest} data-rid={rid} className={cn(rest.className, "group relative")}>
+      <As
+        ref={ref}
+        {...rest}
+        data-rid={rid}
+        className={cn(rest.className, "group relative", size[level])}
+      >
         {rest.children}
-        <span
-          className={cn(
-            "cursor-pointer select-none text-accent opacity-0 transition-opacity duration-200 group-hover:opacity-100",
-            "relative ml-2",
-            "@2xl:absolute @2xl:left-[-1.5em] @2xl:top-0 @2xl:opacity-0",
-          )}
-          aria-hidden
-          onClick={() => {
-            if (!renderContainer) return
-
-            springScrollToElement(
-              renderContainer.querySelector(`[data-rid="${rid}"]`)!,
-              -100,
-              scroller!,
-            )
-          }}
-        >
-          <i className="i-mingcute-hashtag-line invisible" />
-          <span className="center absolute inset-0">
-            <i className="i-mingcute-hashtag-line" />
-          </span>
-        </span>
       </As>
     )
   }