fix(chat): include fenced code in copied messages

Author: j15z

apps/sim/app/workspace/[workspaceId]/components/message-actions/message-actions.test.ts

@@ -0,0 +1,98 @@
+import { describe, expect, it } from 'vitest'
+import { toPlainText } from '@/app/workspace/[workspaceId]/components/message-actions/message-actions'
+
+describe('toPlainText', () => {
+  it('preserves language-tagged fenced code in copied messages', () => {
+    const message = [
+      "Sure — here's a useful example:",
+      '',
+      '```python',
+      'import time',
+      'from functools import wraps',
+      '',
+      'def retry(fn):',
+      '    def wrapper(*args, **kwargs):',
+      '        marker = `<thinking>keep this code</thinking>`',
+      '        return fn(*args, **kwargs)',
+      '```',
+    ].join('\n')
+
+    expect(toPlainText(message)).toBe(
+      [
+        "Sure — here's a useful example:",
+        '',
+        'import time',
+        'from functools import wraps',
+        '',
+        'def retry(fn):',
+        '    def wrapper(*args, **kwargs):',
+        '        marker = `<thinking>keep this code</thinking>`',
+        '        return fn(*args, **kwargs)',
+      ].join('\n')
+    )
+  })
+
+  it.each([
+    ['tilde', '~~~typescript', '~~~'],
+    ['longer closing', '```typescript', '````'],
+  ])('preserves code in %s fences', (_name, openingFence, closingFence) => {
+    const message = ['Before', '', openingFence, 'const value = **raw**', closingFence, '', 'After']
+
+    expect(toPlainText(message.join('\n'))).toBe(
+      ['Before', '', 'const value = **raw**', '', 'After'].join('\n')
+    )
+  })
+
+  it.each(['```python', '~~~python'])(
+    'preserves an unclosed %s fenced code block through the end of the message',
+    (openingFence) => {
+      const message = [
+        'Before',
+        '',
+        openingFence,
+        'def example(*args, **kwargs):',
+        '    return `raw`',
+      ]
+
+      expect(toPlainText(message.join('\n'))).toBe(
+        ['Before', '', 'def example(*args, **kwargs):', '    return `raw`'].join('\n')
+      )
+    }
+  )
+
+  it('preserves multiple code blocks while cleaning surrounding message content', () => {
+    const message = [
+      '**Before** `inline`',
+      '',
+      '<credential>remove this UI payload</credential>',
+      '',
+      '```typescript',
+      'const marker = `<thinking>keep this code</thinking>`',
+      '```',
+      '',
+      'Between **blocks**',
+      '',
+      '~~~python',
+      'def example():',
+      '    return *args, **kwargs',
+      '~~~',
+      '',
+      'After',
+    ].join('\n')
+
+    expect(toPlainText(message)).toBe(
+      [
+        'Before inline',
+        '',
+        'const marker = `<thinking>keep this code</thinking>`',
+        '',
+        'Between blocks',
+        '',
+        'def example():',
+        '    return *args, **kwargs',
+        '',
+        'After',
+      ].join('\n')
+    )
+  })
+})

apps/sim/app/workspace/[workspaceId]/components/message-actions/message-actions.tsx

@@ -24,24 +24,47 @@ import { useForkMothershipChat } from '@/hooks/queries/mothership-chats'
 import { useFolderStore } from '@/stores/folders/store'
 
 const SPECIAL_TAGS = 'thinking|options|usage_upgrade|credential|mothership-error|file|question'
+const FENCED_CODE_BLOCK_PATTERN =
+  /^ {0,3}(`{3,})[^\r\n]*\r?\n([\s\S]*?)(?:^ {0,3}\1`*[ \t]*\r?$|(?![\s\S]))|^ {0,3}(~{3,})[^\r\n]*\r?\n([\s\S]*?)(?:^ {0,3}\3~*[ \t]*\r?$|(?![\s\S]))/gm
+const CODE_BLOCK_PLACEHOLDER_PATTERN = /\u0000code-block-(\d+)\u0000/g
+
+export function toPlainText(raw: string): string {
+  const codeBlocks: string[] = []
+  const contentWithCodePlaceholders = raw.replace(
+    FENCED_CODE_BLOCK_PATTERN,
+    (
+      _match: string,
+      _backtickFence: string | undefined,
+      backtickCode: string | undefined,
+      _tildeFence: string | undefined,
+      tildeCode: string | undefined
+    ) => {
+      const code = backtickCode ?? tildeCode ?? ''
+      const index = codeBlocks.push(code.replace(/\r?\n$/, '')) - 1
+      return `\u0000code-block-${index}\u0000`
+    }
+  )
+  const contentWithoutSpecialTags = contentWithCodePlaceholders.replace(
+    new RegExp(`<\\/?(${SPECIAL_TAGS})(?:>[\\s\\S]*?<\\/(${SPECIAL_TAGS})>|>)`, 'g'),
+    ''
+  )
 
-function toPlainText(raw: string): string {
   return (
-    raw
-      // Strip special tags and their contents
-      .replace(new RegExp(`<\\/?(${SPECIAL_TAGS})(?:>[\\s\\S]*?<\\/(${SPECIAL_TAGS})>|>)`, 'g'), '')
+    contentWithoutSpecialTags
       // Strip markdown
       .replace(/^#{1,6}\s+/gm, '')
       .replace(/\*\*(.+?)\*\*/g, '$1')
       .replace(/\*(.+?)\*/g, '$1')
-      .replace(/`{3}[\s\S]*?`{3}/g, '')
       .replace(/`(.+?)`/g, '$1')
       .replace(/\[([^\]]+)\]\([^)]+\)/g, '$1')
       .replace(/^[>\-*]\s+/gm, '')
       .replace(/!\[[^\]]*\]\([^)]+\)/g, '')
       // Normalize whitespace
       .replace(/\n{3,}/g, '\n\n')
       .trim()
+      .replace(CODE_BLOCK_PLACEHOLDER_PATTERN, (_match: string, index: string) => {
+        return codeBlocks[Number(index)] ?? ''
+      })
   )
 }