refac: error message separate from content

src/lib/components/chat/Chat.svelte

@@ -681,8 +681,7 @@
 
 									if (responseMessage.content == '') {
 										responseMessage.error = true;
-										responseMessage.content =
-											'Oops! No text generated from Ollama, Please try again.';
+										responseMessage.errorContent = 'Oops! No text generated from Ollama, Please try again.';
 									}
 
 									responseMessage.context = data.context ?? null;
@@ -754,22 +753,22 @@
 				console.log(error);
 				if ('detail' in error) {
 					toast.error(error.detail);
-					responseMessage.content = error.detail;
+					responseMessage.errorContent = error.detail;
 				} else {
 					toast.error(error.error);
-					responseMessage.content = error.error;
+					responseMessage.errorContent = error.error;
 				}
 			} else {
 				toast.error(
 					$i18n.t(`Uh-oh! There was an issue connecting to {{provider}}.`, { provider: 'Ollama' })
 				);
-				responseMessage.content = $i18n.t(`Uh-oh! There was an issue connecting to {{provider}}.`, {
+				responseMessage.errorContent = $i18n.t(`Uh-oh! There was an issue connecting to {{provider}}.`, {
 					provider: 'Ollama'
 				});
 			}
 
 			responseMessage.error = true;
-			responseMessage.content = $i18n.t(`Uh-oh! There was an issue connecting to {{provider}}.`, {
+			responseMessage.errorContent = $i18n.t(`Uh-oh! There was an issue connecting to {{provider}}.`, {
 				provider: 'Ollama'
 			});
 			responseMessage.done = true;
@@ -1036,7 +1035,7 @@
 		}
 
 		responseMessage.error = true;
-		responseMessage.content =
+		responseMessage.errorContent =
 			$i18n.t(`Uh-oh! There was an issue connecting to {{provider}}.`, {
 				provider: model.name ?? model.id
 			}) +

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

@@ -451,7 +451,27 @@
 						</div>
 					{:else}
 						<div class="w-full">
-							{#if message?.error === true}
+							{#if message.content === '' && !message.error}
+								<Skeleton />
+							{:else if !message.error || message.errorContent}
+								{#each tokens as token, tokenIdx}
+									{#if token.type === 'code'}
+										<CodeBlock
+											id={`${message.id}-${tokenIdx}`}
+											lang={token?.lang ?? ''}
+											code={revertSanitizedResponseContent(token?.text ?? '')}
+										/>
+									{:else}
+										{@html marked.parse(token.raw, {
+											...defaults,
+											gfm: true,
+											breaks: true,
+											renderer
+										})}
+									{/if}
+								{/each}
+							{/if}
+							{#if message.error === true}
 								<div
 									class="flex mt-2 mb-4 space-x-2 border px-4 py-3 border-red-800 bg-red-800/30 font-medium rounded-lg"
 								>
@@ -471,28 +491,9 @@
 									</svg>
 
 									<div class=" self-center">
-										{message.content}
+										{message.errorContent ?? message.content}
 									</div>
 								</div>
-							{:else if message.content === ''}
-								<Skeleton />
-							{:else}
-								{#each tokens as token, tokenIdx}
-									{#if token.type === 'code'}
-										<CodeBlock
-											id={`${message.id}-${tokenIdx}`}
-											lang={token?.lang ?? ''}
-											code={revertSanitizedResponseContent(token?.text ?? '')}
-										/>
-									{:else}
-										{@html marked.parse(token.raw, {
-											...defaults,
-											gfm: true,
-											breaks: true,
-											renderer
-										})}
-									{/if}
-								{/each}
 							{/if}
 
 							{#if message.citations}