- {content ?? ""}
+ ) => {
+ if (!href) {
+ return {children};
+ }
+
+ // Check if it's a citation link
+ const citation = citationMap.get(href);
+ if (citation) {
+ return (
+
+ {children}
+
+ );
+ }
+
+ // Check if it's an external link (http/https)
+ const isExternalLink =
+ href.startsWith("http://") || href.startsWith("https://");
+
+ if (isExternalLink) {
+ return (
+ {children}
+ );
+ }
+
+ // Internal/anchor link
+ return (
+
+ {children}
+
+ );
+ },
+ }}
+ >
+ {cleanContent ?? ""}
+
);
}
@@ -230,3 +309,106 @@ export function ArtifactFilePreview({
}
return null;
}
+
+/**
+ * Citation link component for artifact preview (with full citation data)
+ */
+function ArtifactCitationLink({
+ citation,
+ href,
+ children,
+}: {
+ citation: Citation;
+ href: string;
+ children: React.ReactNode;
+}) {
+ const domain = extractDomainFromUrl(href);
+
+ return (
+
+
+
+
+
+ {/* Uploaded files outside the message bubble */}
+
+ ) => {
+ if (!href) {
+ return {children};
+ }
+
+ // Check if this link matches a citation
+ const citation = citationMap.get(href);
+ if (citation) {
+ return (
+
+ {children}
+
+ );
+ }
+
+ // Regular external link
+ return (
+
+ {children}
+
+ );
+ },
+ img: ({ src, alt }: React.ImgHTMLAttributes) => {
+ if (!src) return null;
+ if (typeof src !== "string") {
+ return (
+ 
+ );
+ }
+ let url = src;
+ if (src.startsWith("/mnt/")) {
+ url = resolveArtifactURL(src, thread_id);
+ }
+ return (
+
+ 
+
+ );
+ },
+ }}
+ >
+ {cleanContent}
+
+
+ )}
+
+ );
+ }
+
+ // Default rendering for non-human messages or human messages without files
return (
+ {files.map((file, index) => (
+
+ );
+}
+
+/**
+ * Single uploaded file card component (Claude-style)
+ * Shows image thumbnail for image files, file card for others
+ */
+function UploadedFileCard({
+ file,
+ threadId,
+}: {
+ file: UploadedFile;
+ threadId: string;
+}) {
+ const typeLabel = getFileTypeLabel(file.filename);
+ const isImage = isImageFile(file.filename);
+
+ // Don't render if threadId is invalid
+ if (!threadId) {
+ return null;
+ }
+
+ // Build URL - browser will handle encoding automatically
+ const imageUrl = resolveArtifactURL(file.path, threadId);
+
+ // For image files, show thumbnail
+ if (isImage) {
+ return (
+
+
+
+ );
+}
+
+/**
+ * Citations list component that displays all sources at the top
+ */
+function CitationsList({ citations }: { citations: Citation[] }) {
+ if (citations.length === 0) return null;
+
+ return (
+
+
+
+
+ {typeLabel}
+
+ {file.size}
+
+
+
+ );
+}
+
+/**
+ * Single citation badge in the citations list
+ */
+function CitationBadge({ citation }: { citation: Citation }) {
+ const domain = extractDomainFromUrl(citation.url);
+
+ return (
+
+
+
+ {citations.map((citation) => (
+
+
+
+
+
+
- {threads.map((thread) => {
- const isActive = pathOfThread(thread.thread_id) === pathname;
- return (
-
-
-
+ * {"id": "cite-1", "title": "Page Title", "url": "https://example.com", "snippet": "Description"}
+ * {"id": "cite-2", "title": "Another Page", "url": "https://example2.com", "snippet": "Description"}
+ *
+ *
+ * @param content - The raw message content that may contain a citations block
+ * @returns Object containing parsed citations array and content with citations block removed
+ */
+export function parseCitations(content: string): ParseCitationsResult {
+ if (!content) {
+ return { citations: [], cleanContent: content };
+ }
+
+ // Match ALL citations blocks anywhere in content (not just at the start)
+ const citationsRegex = /([\s\S]*?)<\/citations>/g;
+ const citations: Citation[] = [];
+ const seenUrls = new Set(); // Deduplicate by URL
+ let cleanContent = content;
+
+ let match;
+ while ((match = citationsRegex.exec(content)) !== null) {
+ const citationsBlock = match[1] ?? "";
+
+ // Parse each line as JSON
+ const lines = citationsBlock.split("\n");
+ for (const line of lines) {
+ const trimmed = line.trim();
+ if (trimmed?.startsWith("{")) {
+ try {
+ const citation = JSON.parse(trimmed) as Citation;
+ // Validate required fields and deduplicate
+ if (citation.id && citation.url && !seenUrls.has(citation.url)) {
+ seenUrls.add(citation.url);
+ citations.push({
+ id: citation.id,
+ title: citation.title || "",
+ url: citation.url,
+ snippet: citation.snippet || "",
+ });
+ }
+ } catch {
+ // Skip invalid JSON lines - this can happen during streaming
+ }
+ }
+ }
+ }
+
+ // Remove ALL citations blocks from content (both complete and incomplete)
+ cleanContent = content.replace(/[\s\S]*?<\/citations>/g, "").trim();
+
+ // Also remove incomplete citations blocks (during streaming)
+ // Match without closing tag or followed by anything until end of string
+ if (cleanContent.includes("")) {
+ cleanContent = cleanContent.replace(/[\s\S]*$/g, "").trim();
+ }
+
+ return { citations, cleanContent };
+}
+
+/**
+ * Build a map from URL to Citation for quick lookup
+ *
+ * @param citations - Array of citations
+ * @returns Map with URL as key and Citation as value
+ */
+export function buildCitationMap(
+ citations: Citation[],
+): Map {
+ const map = new Map();
+ for (const citation of citations) {
+ map.set(citation.url, citation);
+ }
+ return map;
+}
+
+/**
+ * Extract the domain name from a URL for display
+ *
+ * @param url - Full URL string
+ * @returns Domain name or the original URL if parsing fails
+ */
+export function extractDomainFromUrl(url: string): string {
+ try {
+ const urlObj = new URL(url);
+ // Remove 'www.' prefix if present
+ return urlObj.hostname.replace(/^www\./, "");
+ } catch {
+ return url;
+ }
+}
+
+/**
+ * Check if content is still receiving the citations block (streaming)
+ * This helps determine if we should wait before parsing
+ *
+ * @param content - The current content being streamed
+ * @returns true if citations block appears to be incomplete
+ */
+export function isCitationsBlockIncomplete(content: string): boolean {
+ if (!content) {
+ return false;
+ }
+
+ // Check if we have an opening tag but no closing tag
+ const hasOpenTag = content.includes("");
+ const hasCloseTag = content.includes(" ");
+
+ return hasOpenTag && !hasCloseTag;
+}
diff --git a/frontend/src/core/i18n/locales/en-US.ts b/frontend/src/core/i18n/locales/en-US.ts
index 94a13af..21c78f5 100644
--- a/frontend/src/core/i18n/locales/en-US.ts
+++ b/frontend/src/core/i18n/locales/en-US.ts
@@ -11,6 +11,8 @@ export const enUS: Translations = {
home: "Home",
settings: "Settings",
delete: "Delete",
+ rename: "Rename",
+ share: "Share",
openInNewWindow: "Open in new window",
close: "Close",
more: "More",
@@ -24,6 +26,8 @@ export const enUS: Translations = {
loading: "Loading...",
code: "Code",
preview: "Preview",
+ cancel: "Cancel",
+ save: "Save",
},
// Welcome
@@ -38,6 +42,7 @@ export const enUS: Translations = {
copyToClipboard: "Copy to clipboard",
copiedToClipboard: "Copied to clipboard",
failedToCopyToClipboard: "Failed to copy to clipboard",
+ linkCopied: "Link copied to clipboard",
},
// Input Box
diff --git a/frontend/src/core/i18n/locales/types.ts b/frontend/src/core/i18n/locales/types.ts
index efba270..cccf73c 100644
--- a/frontend/src/core/i18n/locales/types.ts
+++ b/frontend/src/core/i18n/locales/types.ts
@@ -9,6 +9,8 @@ export interface Translations {
home: string;
settings: string;
delete: string;
+ rename: string;
+ share: string;
openInNewWindow: string;
close: string;
more: string;
@@ -22,6 +24,8 @@ export interface Translations {
loading: string;
code: string;
preview: string;
+ cancel: string;
+ save: string;
};
// Welcome
@@ -35,6 +39,7 @@ export interface Translations {
copyToClipboard: string;
copiedToClipboard: string;
failedToCopyToClipboard: string;
+ linkCopied: string;
};
// Input Box
diff --git a/frontend/src/core/i18n/locales/zh-CN.ts b/frontend/src/core/i18n/locales/zh-CN.ts
index 78ee548..5bd4c74 100644
--- a/frontend/src/core/i18n/locales/zh-CN.ts
+++ b/frontend/src/core/i18n/locales/zh-CN.ts
@@ -11,6 +11,8 @@ export const zhCN: Translations = {
home: "首页",
settings: "设置",
delete: "删除",
+ rename: "重命名",
+ share: "分享",
openInNewWindow: "在新窗口打开",
close: "关闭",
more: "更多",
@@ -24,6 +26,8 @@ export const zhCN: Translations = {
loading: "加载中...",
code: "代码",
preview: "预览",
+ cancel: "取消",
+ save: "保存",
},
// Welcome
@@ -38,6 +42,7 @@ export const zhCN: Translations = {
copyToClipboard: "复制到剪贴板",
copiedToClipboard: "已复制到剪贴板",
failedToCopyToClipboard: "复制到剪贴板失败",
+ linkCopied: "链接已复制到剪贴板",
},
// Input Box
diff --git a/frontend/src/core/messages/utils.ts b/frontend/src/core/messages/utils.ts
index 13e9d6d..c60bf35 100644
--- a/frontend/src/core/messages/utils.ts
+++ b/frontend/src/core/messages/utils.ts
@@ -243,3 +243,58 @@ export function findToolCallResult(toolCallId: string, messages: Message[]) {
}
return undefined;
}
+
+/**
+ * Represents an uploaded file parsed from the tag
+ */
+export interface UploadedFile {
+ filename: string;
+ size: string;
+ path: string;
+}
+
+/**
+ * Result of parsing uploaded files from message content
+ */
+export interface ParsedUploadedFiles {
+ files: UploadedFile[];
+ cleanContent: string;
+}
+
+/**
+ * Parse tag from message content and extract file information.
+ * Returns the list of uploaded files and the content with the tag removed.
+ */
+export function parseUploadedFiles(content: string): ParsedUploadedFiles {
+ // Match ... tag
+ const uploadedFilesRegex = /([\s\S]*?)<\/uploaded_files>/;
+ const match = content.match(uploadedFilesRegex);
+
+ if (!match) {
+ return { files: [], cleanContent: content };
+ }
+
+ const uploadedFilesContent = match[1];
+ const cleanContent = content.replace(uploadedFilesRegex, "").trim();
+
+ // Check if it's "No files have been uploaded yet."
+ if (uploadedFilesContent.includes("No files have been uploaded yet.")) {
+ return { files: [], cleanContent };
+ }
+
+ // Parse file list
+ // Format: - filename (size)\n Path: /path/to/file
+ const fileRegex = /- ([^\n(]+)\s*\(([^)]+)\)\s*\n\s*Path:\s*([^\n]+)/g;
+ const files: UploadedFile[] = [];
+ let fileMatch;
+
+ while ((fileMatch = fileRegex.exec(uploadedFilesContent)) !== null) {
+ files.push({
+ filename: fileMatch[1].trim(),
+ size: fileMatch[2].trim(),
+ path: fileMatch[3].trim(),
+ });
+ }
+
+ return { files, cleanContent };
+}
diff --git a/frontend/src/core/threads/hooks.ts b/frontend/src/core/threads/hooks.ts
index aa98a72..dc41d8b 100644
--- a/frontend/src/core/threads/hooks.ts
+++ b/frontend/src/core/threads/hooks.ts
@@ -73,6 +73,12 @@ export function useSubmitThread({
const callback = useCallback(
async (message: PromptInputMessage) => {
const text = message.text.trim();
+
+ console.log('[useSubmitThread] Submitting message:', {
+ text,
+ hasFiles: !!message.files?.length,
+ filesCount: message.files?.length || 0
+ });
// Upload files first if any
if (message.files && message.files.length > 0) {
@@ -186,3 +192,43 @@ export function useDeleteThread() {
},
});
}
+
+export function useRenameThread() {
+ const queryClient = useQueryClient();
+ const apiClient = getAPIClient();
+ return useMutation({
+ mutationFn: async ({
+ threadId,
+ title,
+ }: {
+ threadId: string;
+ title: string;
+ }) => {
+ await apiClient.threads.update(threadId, {
+ metadata: { title },
+ });
+ },
+ onSuccess(_, { threadId, title }) {
+ queryClient.setQueriesData(
+ {
+ queryKey: ["threads", "search"],
+ exact: false,
+ },
+ (oldData: Array) => {
+ return oldData.map((t) => {
+ if (t.thread_id === threadId) {
+ return {
+ ...t,
+ metadata: {
+ ...t.metadata,
+ title,
+ },
+ };
+ }
+ return t;
+ });
+ },
+ );
+ },
+ });
+}
diff --git a/frontend/src/styles/globals.css b/frontend/src/styles/globals.css
index 1fb06f3..d4c5c20 100644
--- a/frontend/src/styles/globals.css
+++ b/frontend/src/styles/globals.css
@@ -1,5 +1,6 @@
@import "tailwindcss";
@import "tw-animate-css";
+@import "katex/dist/katex.min.css";
@source "../node_modules/streamdown/dist/index.js";
-
- {titleOfThread(thread)}
-
- {env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY !== "true" && (
-
-
-
+
+
+ {env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY !== "true"
+ ? t.sidebar.recentChats
+ : t.sidebar.demoChats}
+
+
+
+
+
+
+
+
+ {/* Rename Dialog */}
+
+
);
}
diff --git a/frontend/src/core/citations/index.ts b/frontend/src/core/citations/index.ts
new file mode 100644
index 0000000..bf3a9eb
--- /dev/null
+++ b/frontend/src/core/citations/index.ts
@@ -0,0 +1,8 @@
+export {
+ parseCitations,
+ buildCitationMap,
+ extractDomainFromUrl,
+ isCitationsBlockIncomplete,
+} from "./utils";
+
+export type { Citation, ParseCitationsResult } from "./utils";
diff --git a/frontend/src/core/citations/utils.ts b/frontend/src/core/citations/utils.ts
new file mode 100644
index 0000000..aadd0e1
--- /dev/null
+++ b/frontend/src/core/citations/utils.ts
@@ -0,0 +1,131 @@
+/**
+ * Citation data structure representing a source reference
+ */
+export interface Citation {
+ id: string;
+ title: string;
+ url: string;
+ snippet: string;
+}
+
+/**
+ * Result of parsing citations from content
+ */
+export interface ParseCitationsResult {
+ citations: Citation[];
+ cleanContent: string;
+}
+
+/**
+ * Parse citations block from message content.
+ *
+ * The citations block format:
+ *
+ {threads.map((thread) => {
+ const isActive = pathOfThread(thread.thread_id) === pathname;
+ return (
+
+
+
-
- );
- })}
+
+ handleRenameClick(
+ thread.thread_id,
+ titleOfThread(thread),
+ )
+ }
+ >
+
+ handleShare(thread.thread_id)}
+ >
+
+ handleDelete(thread.thread_id)}
+ >
+
+
+
+ )}
+
+
+
+ );
+ })}
+
+
+ {titleOfThread(thread)}
+
+ {env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY !== "true" && (
+
+
+
+
+
+
-
- handleDelete(thread.thread_id)}
- >
-
-
-
- )}
-
-