improvement(files): keep the diff parser out of the editor bundle

Author: TheodoreSpeaks

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/code-block.tsx

@@ -12,7 +12,7 @@ import { Check, ChevronDown, Code, Duplicate, Eye, Wrap } from '@sim/emcn/icons'
 import type { ReactNodeViewProps } from '@tiptap/react'
 import { NodeViewContent, NodeViewWrapper, ReactNodeViewRenderer } from '@tiptap/react'
 import { DASHBOARD_EMBED_LANGUAGE } from '@/lib/dashboards/embed-language'
-import { DIFF_EMBED_LANGUAGE } from '@/lib/diff/unified'
+import { DIFF_EMBED_LANGUAGE } from '@/lib/diff/embed-language'
 import { MarkdownStreamingContext } from '@/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/markdown-streaming-context'
 import { looksLikeMermaid, MermaidDiagram } from '../mermaid-diagram'
 import { MarkdownCodeBlock } from './code-block-schema'

apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-editor.css

@@ -283,8 +283,7 @@
   overflow-x: auto;
 }
 
-/* A rendered Mermaid diagram sits on the workflow canvas surface: flat page background, a hairline
-   frame, centered. */
+/* A rendered Mermaid diagram matches the workflow canvas surface. */
 .rich-markdown-prose .mermaid-diagram-frame {
   display: flex;
   justify-content: center;

apps/sim/components/diff/diff-embed.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { type ComponentType, type ReactNode, useMemo } from 'react'
+import type { ComponentType, ReactNode } from 'react'
 import { cn } from '@sim/emcn'
 import { ArrowUpRight, Database, File } from '@sim/emcn/icons'
 import { getErrorMessage } from '@sim/utils/errors'
@@ -223,7 +223,6 @@ function ExcerptCard({ heading, diff, side }: ExcerptCardProps) {
   )
 }
 
-/** An edit, line by line: tinted rows with word-level changes. */
 function CodeDiff({ diff, heading }: CodeDiffProps) {
   const Icon = heading.icon
   return (
@@ -262,7 +261,7 @@ function parse(
 export function DiffEmbed({ source, isStreaming }: DiffEmbedProps) {
   const params = useParams()
   const workspaceId = typeof params.workspaceId === 'string' ? params.workspaceId : null
-  const parsed = useMemo(() => parse(source), [source])
+  const parsed = parse(source)
   const diff = parsed.diff
   const comparison = Boolean(
     diff?.oldSource && diff.newSource && !sameSource(diff.oldSource, diff.newSource)

apps/sim/lib/diff/embed-language.ts

@@ -0,0 +1,2 @@
+/** The fence language that renders a unified diff in markdown; kept apart from the parser. */
+export const DIFF_EMBED_LANGUAGE = 'diff'

apps/sim/lib/diff/unified.test.ts

@@ -47,6 +47,16 @@ describe('parseUnifiedDiff', () => {
     })
   })
 
+  it('names each side of a two-document comparison', () => {
+    const diff = parseUnifiedDiff(
+      '--- sim:knowledge/kb/old\n+++ sim:knowledge/kb/new\n-Refunds are available within 14 days.\n+Annual plans can be refunded within 30 days.'
+    )
+    expect([diff.oldSource, diff.newSource]).toEqual([
+      { kind: 'knowledge', knowledgeBaseId: 'kb', documentId: 'old' },
+      { kind: 'knowledge', knowledgeBaseId: 'kb', documentId: 'new' },
+    ])
+  })
+
   it.each([
     ['a knowledge source without a document', '--- sim:knowledge/kb_1\n-x\n+y', 'sim:knowledge/'],
     ['a line without a marker', '@@ x @@\n-a\nplain', 'Line 3'],
@@ -55,16 +65,3 @@ describe('parseUnifiedDiff', () => {
     expect(() => parseUnifiedDiff(text)).toThrow(message)
   })
 })
-
-describe('two-document comparisons', () => {
-  const diff = parseUnifiedDiff(
-    '--- sim:knowledge/kb/old\n+++ sim:knowledge/kb/new\n-Refunds are available within 14 days.\n+Annual plans can be refunded within 30 days.'
-  )
-
-  it('names each side', () => {
-    expect([diff.oldSource, diff.newSource]).toEqual([
-      { kind: 'knowledge', knowledgeBaseId: 'kb', documentId: 'old' },
-      { kind: 'knowledge', knowledgeBaseId: 'kb', documentId: 'new' },
-    ])
-  })
-})

apps/sim/lib/diff/unified.ts

@@ -1,6 +1,3 @@
-/** The fence language that renders a unified diff in markdown; kept apart from the parser. */
-export const DIFF_EMBED_LANGUAGE = 'diff'
-
 /** A workspace resource a diff was taken from, named in its `---` / `+++` header lines. */
 export type DiffSource =
   | { kind: 'file'; fileId: string }