feat: improve markdown rendering, artifact file preview, and public scheduled task page

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend-web/src/components/workspace/artifacts/artifact-file-detail.tsx

@@ -1,7 +1,7 @@
 "use client";
 
-import {
-  ArrowDownIcon,
+import {
+  ArrowDownIcon,
   Code2Icon,
   CopyIcon,
   DownloadIcon,
@@ -12,10 +12,11 @@ import {
   SaveIcon,
   SquareArrowOutUpRightIcon,
   XIcon,
-} from "lucide-react";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { toast } from "sonner";
-import { Streamdown } from "streamdown";
+} from "lucide-react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import type { AnchorHTMLAttributes, HTMLAttributes, ReactNode } from "react";
+import { toast } from "sonner";
+import { Streamdown } from "streamdown";
 
 import {
   Artifact,
@@ -47,9 +48,10 @@ import { urlOfArtifact } from "@/core/artifacts/utils";
 import { useI18n } from "@/core/i18n/hooks";
 import { downloadMarkdownAsDocx } from "@/core/scheduled-tasks/markdown-docx";
 import { installSkill } from "@/core/skills/api";
-import { streamdownPlugins } from "@/core/streamdown";
-import { checkCodeFile, getFileName } from "@/core/utils/files";
-import { env } from "@/env";
+import { streamdownPlugins } from "@/core/streamdown";
+import { checkCodeFile, getFileName } from "@/core/utils/files";
+import { createMarkdownAnchorResolver } from "@/core/utils/markdown";
+import { env } from "@/env";
 import { desensitize } from "@/lib/desensitize";
 import { cn } from "@/lib/utils";
 
@@ -59,9 +61,15 @@ import { Tooltip } from "../tooltip";
 
 import { useArtifacts } from "./context";
 
-const SANDBOX_RESUME_EVENT = "workspace:sandbox-resume-autoscroll";
-
-function findScrollableArtifactElement(root: HTMLElement | null) {
+const SANDBOX_RESUME_EVENT = "workspace:sandbox-resume-autoscroll";
+
+function extractTextFromChildren(children: ReactNode): string {
+  if (typeof children === "string" || typeof children === "number") return String(children);
+  if (Array.isArray(children)) return children.map(extractTextFromChildren).join("");
+  return "";
+}
+
+function findScrollableArtifactElement(root: HTMLElement | null) {
   if (!root) {
     return null;
   }
@@ -706,10 +714,54 @@ export function ArtifactFilePreview({
   language: string;
   animated?: boolean;
   activeCursor?: boolean;
-}) {
-  const [htmlPreviewUrl, setHtmlPreviewUrl] = useState<string>();
-
-  useEffect(() => {
+}) {
+  const [htmlPreviewUrl, setHtmlPreviewUrl] = useState<string>();
+  const markdownComponents = useMemo(() => {
+    const anchorResolver = createMarkdownAnchorResolver(content ?? "");
+    const heading = (level: 1 | 2 | 3 | 4 | 5 | 6) => {
+      const Tag = `h${level}` as const;
+      return ({ children, id, ...props }: HTMLAttributes<HTMLHeadingElement>) => (
+        <Tag id={id ?? anchorResolver.getHeadingId(level, extractTextFromChildren(children))} {...props}>
+          {children}
+        </Tag>
+      );
+    };
+
+    return {
+      h1: heading(1),
+      h2: heading(2),
+      h3: heading(3),
+      h4: heading(4),
+      h5: heading(5),
+      h6: heading(6),
+      a: (props: AnchorHTMLAttributes<HTMLAnchorElement>) => {
+        if (typeof props.children === "string" && /^citation:(.+)$/.test(props.children)) {
+          return <ArtifactLink {...props} />;
+        }
+        const { className, ...rest } = props;
+        const resolvedHref = anchorResolver.resolveHref(
+          props.href,
+          extractTextFromChildren(props.children),
+        );
+        if (resolvedHref === null) {
+          return (
+            <span
+              className={cn(
+                "text-primary/80 decoration-dotted underline underline-offset-2 cursor-not-allowed",
+                className,
+              )}
+              title="未在当前 Markdown 中找到对应章节"
+            >
+              {props.children}
+            </span>
+          );
+        }
+        return <ArtifactLink {...rest} className={className} href={resolvedHref ?? props.href} />;
+      },
+    };
+  }, [content]);
+
+  useEffect(() => {
     if (language !== "html") {
       setHtmlPreviewUrl(undefined);
       return;
@@ -733,11 +785,11 @@ export function ArtifactFilePreview({
           animated && "animate-[sandbox-preview-enter_320ms_ease-out]",
         )}
       >
-        <Streamdown
-          className="size-full"
-          {...streamdownPlugins}
-          components={{ a: ArtifactLink }}
-        >
+        <Streamdown
+          className="size-full"
+          {...streamdownPlugins}
+          components={markdownComponents}
+        >
           {content ?? ""}
         </Streamdown>
         {activeCursor && (