refac

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

@@ -24,7 +24,7 @@
 	export let id = '';
 
 	export let onSave = (e) => {};
-	export let onCode = (e) => {};
+	export let onUpdate = (e) => {};
 	export let onPreview = (e) => {};
 
 	export let save = false;
@@ -340,6 +340,8 @@
 				await drawMermaidDiagram();
 			})();
 		}
+
+		onUpdate(token);
 	};
 
 	$: if (token) {
@@ -352,8 +354,6 @@
 		render();
 	}
 
-	$: onCode({ lang, code });
-
 	$: if (attributes) {
 		onAttributesUpdate();
 	}
@@ -386,10 +386,10 @@
 
 	onMount(async () => {
 		console.log('codeblock', lang, code);
-
-		if (lang) {
-			onCode({ lang, code });
+		if (token) {
+			onUpdate(token);
 		}
+
 		if (document.documentElement.classList.contains('dark')) {
 			mermaid.initialize({
 				startOnLoad: true,

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

@@ -25,7 +25,7 @@
 	export let preview = false;
 	export let floatingButtons = true;
 
-	export let onUpdate = () => {};
+	export let onSave = () => {};
 	export let onSourceClick = () => {};
 	export let onTaskClick = () => {};
 
@@ -164,15 +164,9 @@
 		}, [])}
 		{onSourceClick}
 		{onTaskClick}
-		{onUpdate}
-		onPreview={async (value) => {
-			await artifactCode.set(value);
-			await showControls.set(true);
-			await showArtifacts.set(true);
-			await showOverview.set(false);
-		}}
-		onCode={(value) => {
-			const { lang, code } = value;
+		{onSave}
+		onUpdate={(token) => {
+			const { lang, text: code } = token;
 
 			if (
 				($settings?.detectArtifacts ?? true) &&
@@ -184,6 +178,13 @@
 				showControls.set(true);
 			}
 		}}
+		onPreview={async (value) => {
+			console.log('Preview', value);
+			await artifactCode.set(value);
+			await showControls.set(true);
+			await showArtifacts.set(true);
+			await showOverview.set(false);
+		}}
 	/>
 </div>
 

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

@@ -16,8 +16,9 @@
 
 	export let sourceIds = [];
 
+	export let onSave = () => {};
 	export let onUpdate = () => {};
-	export let onCode = () => {};
+
 	export let onPreview = () => {};
 
 	export let onSourceClick = () => {};
@@ -49,8 +50,8 @@
 		{preview}
 		{onTaskClick}
 		{onSourceClick}
+		{onSave}
 		{onUpdate}
-		{onCode}
 		{onPreview}
 	/>
 {/key}

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

@@ -31,8 +31,8 @@
 	export let save = false;
 	export let preview = false;
 
+	export let onSave: Function = () => {};
 	export let onUpdate: Function = () => {};
-	export let onCode: Function = () => {};
 	export let onPreview: Function = () => {};
 
 	export let onTaskClick: Function = () => {};
@@ -98,15 +98,15 @@
 				{attributes}
 				{save}
 				{preview}
-				{onCode}
-				{onPreview}
 				onSave={(value) => {
-					onUpdate({
+					onSave({
 						raw: token.raw,
 						oldContent: token.text,
 						newContent: value
 					});
 				}}
+				{onUpdate}
+				{onPreview}
 			/>
 		{:else}
 			{token.text}

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

@@ -841,7 +841,7 @@
 										onAddMessages={({ modelId, parentId, messages }) => {
 											addMessages({ modelId, parentId, messages });
 										}}
-										onUpdate={({ raw, oldContent, newContent }) => {
+										onSave={({ raw, oldContent, newContent }) => {
 											history.messages[message.id].content = history.messages[
 												message.id
 											].content.replace(raw, raw.replace(oldContent, newContent));