From fb5c19b6d2b2a71c933afeb8b2fa5908ae174934 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Tue, 12 May 2026 09:57:00 -0700
Subject: [PATCH 1/4] improvement(mothership): align markdown blockquote, img,
 em, del with design tokens

---
 .../message/components/markdown-renderer.tsx  |  2 +-
 .../components/file-viewer/preview-panel.tsx  |  4 ++--
 .../components/chat-content/chat-content.tsx  | 24 +++++++++++++++++++
 .../components/note-block/note-block.tsx      |  2 +-
 4 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/apps/sim/app/chat/components/message/components/markdown-renderer.tsx b/apps/sim/app/chat/components/message/components/markdown-renderer.tsx
index 37059ef523a..b6ec996ddc8 100644
--- a/apps/sim/app/chat/components/message/components/markdown-renderer.tsx
+++ b/apps/sim/app/chat/components/message/components/markdown-renderer.tsx
@@ -115,7 +115,7 @@ const COMPONENTS = {
   ),
 
   blockquote: ({ children }: React.HTMLAttributes<HTMLQuoteElement>) => (
-    <blockquote className='my-4 border-gray-300 border-l-4 py-1 pl-4 font-sans text-gray-700 italic dark:border-gray-600 dark:text-gray-300'>
+    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 font-sans text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
       {children}
     </blockquote>
   ),
diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx
index 79e3d56d007..2f481213e6f 100644
--- a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx
@@ -263,7 +263,7 @@ function CalloutBlock({ type, children }: { type: string; children?: React.React
   const config = CALLOUT_CONFIG[type]
   if (!config) {
     return (
-      <blockquote className='my-4 break-words border-[var(--border-1)] border-l-4 py-1 pl-4 text-[var(--text-tertiary)] italic'>
+      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
         {children}
       </blockquote>
     )
@@ -605,7 +605,7 @@ const STATIC_MARKDOWN_COMPONENTS = {
       return <CalloutBlock type={calloutType}>{children}</CalloutBlock>
     }
     return (
-      <blockquote className='my-4 break-words border-[var(--border-1)] border-l-4 py-1 pl-4 text-[var(--text-tertiary)] italic'>
+      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
         {children}
       </blockquote>
     )
diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
index 0d79bee8d04..e7c940eeb49 100644
--- a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
@@ -222,12 +222,36 @@ const MARKDOWN_COMPONENTS = {
       </code>
     )
   },
+  blockquote({ children }: { children?: React.ReactNode }) {
+    return (
+      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
+        {children}
+      </blockquote>
+    )
+  },
   input({ type, checked }: { type?: string; checked?: boolean }) {
     if (type === 'checkbox') {
       return <Checkbox checked={checked || false} disabled size='sm' className='mt-1.5 shrink-0' />
     }
     return <input type={type} checked={checked} readOnly />
   },
+  em({ children }: { children?: React.ReactNode }) {
+    return <em className='text-[var(--text-primary)] italic'>{children}</em>
+  },
+  del({ children }: { children?: React.ReactNode }) {
+    return <del className='text-[var(--text-tertiary)] line-through'>{children}</del>
+  },
+  img({ src, alt }: { src?: string; alt?: string }) {
+    if (!src) return null
+    return (
+      <img
+        src={src}
+        alt={alt ?? ''}
+        loading='lazy'
+        className='my-4 h-auto max-w-full rounded-lg border border-[var(--divider)]'
+      />
+    )
+  },
 }
 
 interface ChatContentProps {
diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx
index e1cd0e3f132..43f1812a57c 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx
@@ -430,7 +430,7 @@ const NOTE_COMPONENTS = {
     <em className='break-words text-[var(--text-tertiary)]'>{children}</em>
   ),
   blockquote: ({ children }: { children?: React.ReactNode }) => (
-    <blockquote className='my-4 break-words border-[var(--border-1)] border-l-4 py-1 pl-4 text-[var(--text-tertiary)] italic'>
+    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
       {children}
     </blockquote>
   ),

From 01ca881a5b2a985c9d8dc8b4fad1754d559d3742 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Tue, 12 May 2026 10:03:35 -0700
Subject: [PATCH 2/4] fix(mothership): correctly scope blockquote paragraph
 margin reset to first/last child

---
 .../chat/components/message/components/markdown-renderer.tsx  | 2 +-
 .../files/components/file-viewer/preview-panel.tsx            | 4 ++--
 .../message-content/components/chat-content/chat-content.tsx  | 2 +-
 .../w/[workflowId]/components/note-block/note-block.tsx       | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/apps/sim/app/chat/components/message/components/markdown-renderer.tsx b/apps/sim/app/chat/components/message/components/markdown-renderer.tsx
index b6ec996ddc8..e2216eeb81b 100644
--- a/apps/sim/app/chat/components/message/components/markdown-renderer.tsx
+++ b/apps/sim/app/chat/components/message/components/markdown-renderer.tsx
@@ -115,7 +115,7 @@ const COMPONENTS = {
   ),
 
   blockquote: ({ children }: React.HTMLAttributes<HTMLQuoteElement>) => (
-    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 font-sans text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
+    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 font-sans text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
       {children}
     </blockquote>
   ),
diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx
index 2f481213e6f..8f70bf457c4 100644
--- a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx
@@ -263,7 +263,7 @@ function CalloutBlock({ type, children }: { type: string; children?: React.React
   const config = CALLOUT_CONFIG[type]
   if (!config) {
     return (
-      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
+      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
         {children}
       </blockquote>
     )
@@ -605,7 +605,7 @@ const STATIC_MARKDOWN_COMPONENTS = {
       return <CalloutBlock type={calloutType}>{children}</CalloutBlock>
     }
     return (
-      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
+      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
         {children}
       </blockquote>
     )
diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
index e7c940eeb49..c15714a4c0c 100644
--- a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
@@ -224,7 +224,7 @@ const MARKDOWN_COMPONENTS = {
   },
   blockquote({ children }: { children?: React.ReactNode }) {
     return (
-      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
+      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
         {children}
       </blockquote>
     )
diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx
index 43f1812a57c..9d70441b397 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx
@@ -430,7 +430,7 @@ const NOTE_COMPONENTS = {
     <em className='break-words text-[var(--text-tertiary)]'>{children}</em>
   ),
   blockquote: ({ children }: { children?: React.ReactNode }) => (
-    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 first:[&>p]:mt-0 last:[&>p]:mb-0'>
+    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
       {children}
     </blockquote>
   ),

From c79e64418850f277b1844ce891bd40ade3a19498 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Tue, 12 May 2026 10:11:45 -0700
Subject: [PATCH 3/4] improvement(mothership): restore italic on blockquotes

---
 .../chat/components/message/components/markdown-renderer.tsx  | 2 +-
 .../files/components/file-viewer/preview-panel.tsx            | 4 ++--
 .../message-content/components/chat-content/chat-content.tsx  | 2 +-
 .../w/[workflowId]/components/note-block/note-block.tsx       | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/apps/sim/app/chat/components/message/components/markdown-renderer.tsx b/apps/sim/app/chat/components/message/components/markdown-renderer.tsx
index e2216eeb81b..32d49b167b2 100644
--- a/apps/sim/app/chat/components/message/components/markdown-renderer.tsx
+++ b/apps/sim/app/chat/components/message/components/markdown-renderer.tsx
@@ -115,7 +115,7 @@ const COMPONENTS = {
   ),
 
   blockquote: ({ children }: React.HTMLAttributes<HTMLQuoteElement>) => (
-    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 font-sans text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
+    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 font-sans text-[var(--text-primary)] italic [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
       {children}
     </blockquote>
   ),
diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx
index 8f70bf457c4..03ab43d4ade 100644
--- a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx
@@ -263,7 +263,7 @@ function CalloutBlock({ type, children }: { type: string; children?: React.React
   const config = CALLOUT_CONFIG[type]
   if (!config) {
     return (
-      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
+      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] italic [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
         {children}
       </blockquote>
     )
@@ -605,7 +605,7 @@ const STATIC_MARKDOWN_COMPONENTS = {
       return <CalloutBlock type={calloutType}>{children}</CalloutBlock>
     }
     return (
-      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
+      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] italic [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
         {children}
       </blockquote>
     )
diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
index c15714a4c0c..204a56424f4 100644
--- a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
@@ -224,7 +224,7 @@ const MARKDOWN_COMPONENTS = {
   },
   blockquote({ children }: { children?: React.ReactNode }) {
     return (
-      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
+      <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] italic [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
         {children}
       </blockquote>
     )
diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx
index 9d70441b397..16a1291ca07 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx
@@ -430,7 +430,7 @@ const NOTE_COMPONENTS = {
     <em className='break-words text-[var(--text-tertiary)]'>{children}</em>
   ),
   blockquote: ({ children }: { children?: React.ReactNode }) => (
-    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
+    <blockquote className='my-4 break-words border-[var(--divider)] border-l-2 pl-4 text-[var(--text-primary)] italic [&>p]:my-2 [&>p:first-child]:mt-0 [&>p:last-child]:mb-0'>
       {children}
     </blockquote>
   ),

From 28e0eeb650ab652167caf4f2c332d5289df9628d Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Tue, 12 May 2026 10:14:47 -0700
Subject: [PATCH 4/4] fix(mothership): widen img component prop type to satisfy
 Streamdown Components

---
 .../message-content/components/chat-content/chat-content.tsx  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
index 204a56424f4..62157c89eee 100644
--- a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx
@@ -241,8 +241,8 @@ const MARKDOWN_COMPONENTS = {
   del({ children }: { children?: React.ReactNode }) {
     return <del className='text-[var(--text-tertiary)] line-through'>{children}</del>
   },
-  img({ src, alt }: { src?: string; alt?: string }) {
-    if (!src) return null
+  img({ src, alt }: ComponentPropsWithoutRef<'img'>) {
+    if (typeof src !== 'string' || !src) return null
     return (
       <img
         src={src}