Skip to content

Commit 03dd298

Browse files
feat(note-block): add single newline support in preview
Add a preprocessor function that converts single newlines to markdown hard breaks (two trailing spaces + newline) before rendering. This ensures that when users press Enter in the note block editor, the line break shows up in the preview. The function preserves: - Double newlines (paragraph breaks) - Code block formatting (fenced and inline) Co-authored-by: Emir Karabeg <emir-karabeg@users.noreply.github.com>
1 parent 7898f03 commit 03dd298

File tree

1 file changed

+34
-1
lines changed
  • apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block

1 file changed

+34
-1
lines changed

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/note-block/note-block.tsx

Lines changed: 34 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -299,10 +299,43 @@ function getEmbedInfo(url: string): EmbedInfo | null {
299299
return null
300300
}
301301

302+
/**
303+
* Converts single newlines to markdown hard breaks (two trailing spaces + newline).
304+
* This ensures that pressing Enter in the editor creates a visible line break in the preview.
305+
* Preserves double newlines (paragraph breaks) and code block formatting.
306+
*/
307+
function convertNewlinesToBreaks(text: string): string {
308+
// Split by code blocks to preserve their formatting
309+
const parts = text.split(/(```[\s\S]*?```|`[^`\n]+`)/g)
310+
311+
return parts
312+
.map((part, index) => {
313+
// Odd indices are code blocks - don't modify them
314+
if (index % 2 === 1) return part
315+
316+
// For regular text, convert single newlines to hard breaks
317+
// First, temporarily replace double newlines with a placeholder
318+
const placeholder = '\u0000DOUBLE_NEWLINE\u0000'
319+
let processed = part.replace(/\n\n/g, placeholder)
320+
321+
// Add two spaces before single newlines (markdown hard break syntax)
322+
// But only if there aren't already two spaces before the newline
323+
processed = processed.replace(/([^\s\n])(\n)(?!\n)/g, '$1 $2')
324+
325+
// Restore double newlines
326+
processed = processed.replace(new RegExp(placeholder, 'g'), '\n\n')
327+
328+
return processed
329+
})
330+
.join('')
331+
}
332+
302333
/**
303334
* Compact markdown renderer for note blocks with tight spacing
304335
*/
305336
const NoteMarkdown = memo(function NoteMarkdown({ content }: { content: string }) {
337+
const processedContent = convertNewlinesToBreaks(content)
338+
306339
return (
307340
<ReactMarkdown
308341
remarkPlugins={[remarkGfm]}
@@ -468,7 +501,7 @@ const NoteMarkdown = memo(function NoteMarkdown({ content }: { content: string }
468501
),
469502
}}
470503
>
471-
{content}
504+
{processedContent}
472505
</ReactMarkdown>
473506
)
474507
})

0 commit comments

Comments
 (0)