feat(citations): inline citation links with [citation:Title](URL)

- Backend: add citation format to lead_agent and general_purpose prompts
- Add CitationLink component (Badge + HoverCard) for citation cards
- MarkdownContent: detect citation: prefix in link text, render CitationLink
- Message/artifact/subtask: use MarkdownContent or Streamdown with CitationLink
- message-list-item: pass img via components prop (remove isHuman/img)
- message-group, subtask-card: drop unused imports; fix import order (lint)

Co-authored-by: Cursor <cursoragent@cursor.com>

frontend/src/components/workspace/messages/markdown-content.tsx

@@ -1,7 +1,7 @@
 "use client";
 
-import type { ImgHTMLAttributes } from "react";
-import type { ReactNode } from "react";
+import { useMemo } from "react";
+import type { HTMLAttributes } from "react";
 
 import {
   MessageResponse,
@@ -9,14 +9,15 @@ import {
 } from "@/components/ai-elements/message";
 import { streamdownPlugins } from "@/core/streamdown";
 
+import { CitationLink } from "../citations/citation-link";
+
 export type MarkdownContentProps = {
   content: string;
   isLoading: boolean;
   rehypePlugins: MessageResponseProps["rehypePlugins"];
   className?: string;
   remarkPlugins?: MessageResponseProps["remarkPlugins"];
-  isHuman?: boolean;
-  img?: (props: ImgHTMLAttributes<HTMLImageElement> & { threadId?: string; maxWidth?: string }) => ReactNode;
+  components?: MessageResponseProps["components"];
 };
 
 /** Renders markdown content. */
@@ -25,10 +26,26 @@ export function MarkdownContent({
   rehypePlugins,
   className,
   remarkPlugins = streamdownPlugins.remarkPlugins,
-  img,
+  components: componentsFromProps,
 }: MarkdownContentProps) {
+  const components = useMemo(() => {
+    return {
+      a: (props: HTMLAttributes<HTMLAnchorElement>) => {
+        if (typeof props.children === "string") {
+          const match = /^citation:(.+)$/.exec(props.children);
+          if (match) {
+            const [, text] = match;
+            return <CitationLink {...props}>{text}</CitationLink>;
+          }
+        }
+        return <a {...props} />;
+      },
+      ...componentsFromProps,
+    };
+  }, [componentsFromProps]);
+
   if (!content) return null;
-  const components = img ? { img } : undefined;
+
   return (
     <MessageResponse
       className={className}

frontend/src/components/workspace/messages/message-group.tsx

@@ -22,7 +22,6 @@ import {
   ChainOfThoughtStep,
 } from "@/components/ai-elements/chain-of-thought";
 import { CodeBlock } from "@/components/ai-elements/code-block";
-import { MessageResponse } from "@/components/ai-elements/message";
 import { Button } from "@/components/ui/button";
 import { useI18n } from "@/core/i18n/hooks";
 import {
@@ -30,7 +29,6 @@ import {
   findToolCallResult,
 } from "@/core/messages/utils";
 import { useRehypeSplitWordsIntoSpans } from "@/core/rehype";
-import { streamdownPlugins } from "@/core/streamdown";
 import { extractTitleFromMarkdown } from "@/core/utils/markdown";
 import { env } from "@/env";
 import { cn } from "@/lib/utils";

frontend/src/components/workspace/messages/message-list-item.tsx

@@ -23,6 +23,7 @@ import { humanMessagePlugins } from "@/core/streamdown";
 import { cn } from "@/lib/utils";
 
 import { CopyButton } from "../copy-button";
+
 import { MarkdownContent } from "./markdown-content";
 
 export function MessageListItem({
@@ -158,14 +159,15 @@ function MessageContent_({
         isLoading={isLoading}
         rehypePlugins={[...rehypePlugins, [rehypeKatex, { output: "html" }]]}
         className="my-3"
-        isHuman={false}
-        img={(props) => (
-          <MessageImage
-            {...props}
-            threadId={thread_id}
-            maxWidth="90%"
-          />
-        )}
+        components={{
+          img: (props) => (
+            <MessageImage
+              {...props}
+              threadId={thread_id}
+              maxWidth="90%"
+            />
+          ),
+        }}
       />
     </AIElementMessageContent>
   );

frontend/src/components/workspace/messages/message-list.tsx

@@ -1,3 +1,4 @@
+import type { Message } from "@langchain/langgraph-sdk";
 import type { UseStream } from "@langchain/langgraph-sdk/react";
 
 import {
@@ -18,15 +19,14 @@ import { useRehypeSplitWordsIntoSpans } from "@/core/rehype";
 import type { Subtask } from "@/core/tasks";
 import { useUpdateSubtask } from "@/core/tasks/context";
 import type { AgentThreadState } from "@/core/threads";
-import type { Message } from "@langchain/langgraph-sdk";
 import { cn } from "@/lib/utils";
 
 import { ArtifactFileList } from "../artifacts/artifact-file-list";
 import { StreamingIndicator } from "../streaming-indicator";
 
+import { MarkdownContent } from "./markdown-content";
 import { MessageGroup } from "./message-group";
 import { MessageListItem } from "./message-list-item";
-import { MarkdownContent } from "./markdown-content";
 import { MessageListSkeleton } from "./skeleton";
 import { SubtaskCard } from "./subtask-card";
 

frontend/src/components/workspace/messages/subtask-card.tsx

@@ -19,14 +19,12 @@ import { ShineBorder } from "@/components/ui/shine-border";
 import { useI18n } from "@/core/i18n/hooks";
 import { hasToolCalls } from "@/core/messages/utils";
 import { useRehypeSplitWordsIntoSpans } from "@/core/rehype";
-import {
-  streamdownPlugins,
-  streamdownPluginsWithWordAnimation,
-} from "@/core/streamdown";
+import { streamdownPluginsWithWordAnimation } from "@/core/streamdown";
 import { useSubtask } from "@/core/tasks/context";
 import { explainLastToolCall } from "@/core/tools/utils";
 import { cn } from "@/lib/utils";
 
+import { CitationLink } from "../citations/citation-link";
 import { FlipDisplay } from "../flip-display";
 
 import { MarkdownContent } from "./markdown-content";
@@ -128,7 +126,10 @@ export function SubtaskCard({
           {task.prompt && (
             <ChainOfThoughtStep
               label={
-                <Streamdown {...streamdownPluginsWithWordAnimation}>
+                <Streamdown 
+                  {...streamdownPluginsWithWordAnimation}
+                  components={{ a: CitationLink }}
+                >
                   {task.prompt}
                 </Streamdown>
               }