refac: citation

src/lib/components/chat/ChatControls/Embeds.svelte

@@ -6,7 +6,7 @@
 
 	export let overlay = false;
 
-	const getSrcUrl = (url: string, chatId?: string, messageId?: string) => {
+	const getSrcUrl = (url: string, chatId?: string, messageId?: string, sourceId: string) => {
 		try {
 			const parsed = new URL(url);
 
@@ -18,6 +18,10 @@
 				parsed.searchParams.set('message_id', messageId);
 			}
 
+			if (sourceId) {
+				parsed.searchParams.set('source_id', sourceId);
+			}
+
 			return parsed.toString();
 		} catch {
 			// Fallback for relative URLs or invalid input
@@ -26,6 +30,7 @@
 
 			if (chatId) parts.push(`chat_id=${encodeURIComponent(chatId)}`);
 			if (messageId) parts.push(`message_id=${encodeURIComponent(messageId)}`);
+			if (sourceId) parts.push(`source_id=${encodeURIComponent(sourceId)}`);
 
 			if (parts.length === 0) return url;
 
@@ -68,7 +73,7 @@
 			{/if}
 
 			<FullHeightIframe
-				src={getSrcUrl($embed?.url ?? '', $embed?.chatId, $embed?.messageId)}
+				src={getSrcUrl($embed?.url ?? '', $embed?.chatId, $embed?.messageId, $embed?.sourceId)}
 				payload={$embed?.source ?? null}
 				iframeClassName="w-full h-full"
 			/>

src/lib/components/chat/Messages/Citations.svelte

@@ -23,12 +23,26 @@
 
 	let selectedCitation: any = null;
 
-	export const showSourceModal = (sourceIdx) => {
-		if (citations[sourceIdx]) {
-			console.log('Showing citation modal for:', citations[sourceIdx]);
+	export const showSourceModal = (sourceId) => {
+		let index;
+		let suffix = null;
 
-			if (citations[sourceIdx]?.source?.embed_url) {
-				const embedUrl = citations[sourceIdx].source.embed_url;
+		if (typeof sourceId === 'string') {
+			const output = sourceId.split('#');
+			index = parseInt(output[0]) - 1;
+
+			if (output.length > 1) {
+				suffix = output[1];
+			}
+		} else {
+			index = sourceId - 1;
+		}
+
+		if (citations[index]) {
+			console.log('Showing citation modal for:', citations[index]);
+
+			if (citations[index]?.source?.embed_url) {
+				const embedUrl = citations[index].source.embed_url;
 				if (embedUrl) {
 					if (readOnly) {
 						// Open in new tab if readOnly
@@ -39,18 +53,19 @@
 						showEmbeds.set(true);
 						embed.set({
 							url: embedUrl,
-							title: citations[sourceIdx]?.source?.name || 'Embedded Content',
-							source: citations[sourceIdx],
+							title: citations[index]?.source?.name || 'Embedded Content',
+							source: citations[index],
 							chatId: chatId,
-							messageId: id
+							messageId: id,
+							sourceId: sourceId
 						});
 					}
 				} else {
-					selectedCitation = citations[sourceIdx];
+					selectedCitation = citations[index];
 					showCitationModal = true;
 				}
 			} else {
-				selectedCitation = citations[sourceIdx];
+				selectedCitation = citations[index];
 				showCitationModal = true;
 			}
 		}

src/lib/components/chat/Messages/Markdown/SourceToken.svelte

@@ -41,7 +41,9 @@
 
 {#if sourceIds}
 	{#if (token?.ids ?? []).length == 1}
-		<Source id={token.ids[0] - 1} title={sourceIds[token.ids[0] - 1]} {onClick} />
+		{@const id = token.ids[0]}
+		{@const identifier = token.citationIdentifiers ? token.citationIdentifiers[0] : id - 1}
+		<Source id={identifier} title={sourceIds[id - 1]} {onClick} />
 	{:else}
 		<LinkPreview.Root openDelay={0} bind:open={openPreview}>
 			<LinkPreview.Trigger>
@@ -65,9 +67,11 @@
 				el={containerElement}
 			>
 				<div class="bg-gray-50 dark:bg-gray-850 rounded-xl p-1 cursor-pointer">
-					{#each token.ids as sourceId}
+					{#each token.citationIdentifiers ?? token.ids as identifier}
+						{@const id =
+							typeof identifier === 'string' ? parseInt(identifier.split('#')[0]) : identifier}
 						<div class="">
-							<Source id={sourceId - 1} title={sourceIds[sourceId - 1]} {onClick} />
+							<Source id={identifier} title={sourceIds[id - 1]} {onClick} />
 						</div>
 					{/each}
 				</div>