refactor: extract DiffView into its own file from Editor.tsx
This commit is contained in:
45
src/components/DiffView.tsx
Normal file
45
src/components/DiffView.tsx
Normal file
@@ -0,0 +1,45 @@
|
||||
import { cn } from '@/lib/utils'
|
||||
|
||||
interface DiffViewProps {
|
||||
diff: string
|
||||
}
|
||||
|
||||
export function DiffView({ diff }: DiffViewProps) {
|
||||
if (!diff) {
|
||||
return (
|
||||
<div className="flex h-full items-center justify-center text-sm text-muted-foreground">
|
||||
No changes to display
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const lines = diff.split('\n')
|
||||
|
||||
return (
|
||||
<div className="font-mono text-[13px] leading-relaxed py-3">
|
||||
{lines.map((line, i) => {
|
||||
let lineClass = 'text-secondary-foreground'
|
||||
if (line.startsWith('+') && !line.startsWith('+++')) {
|
||||
lineClass = 'bg-[rgba(76,175,80,0.12)] text-[#4caf50]'
|
||||
} else if (line.startsWith('-') && !line.startsWith('---')) {
|
||||
lineClass = 'bg-[rgba(244,67,54,0.12)] text-[#f44336]'
|
||||
} else if (line.startsWith('@@')) {
|
||||
lineClass = 'bg-[rgba(33,150,243,0.08)] text-primary italic'
|
||||
} else if (line.startsWith('diff') || line.startsWith('index') || line.startsWith('---') || line.startsWith('+++') || line.startsWith('new file')) {
|
||||
lineClass = 'bg-muted text-muted-foreground font-semibold'
|
||||
}
|
||||
|
||||
return (
|
||||
<div key={i} className={cn("flex min-h-[22px] px-4", lineClass)}>
|
||||
<span className="w-10 shrink-0 text-right pr-3 text-muted-foreground select-none">
|
||||
{i + 1}
|
||||
</span>
|
||||
<span className="flex-1 whitespace-pre-wrap break-all px-2">
|
||||
{line || '\u00A0'}
|
||||
</span>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -6,6 +6,7 @@ import { BlockNoteView } from '@blocknote/mantine'
|
||||
import '@blocknote/mantine/style.css'
|
||||
import type { VaultEntry, GitCommit } from '../types'
|
||||
import { Inspector, type FrontmatterValue } from './Inspector'
|
||||
import { DiffView } from './DiffView'
|
||||
import { ResizeHandle } from './ResizeHandle'
|
||||
import { useEditorTheme } from '../hooks/useTheme'
|
||||
import { cn } from '@/lib/utils'
|
||||
@@ -145,45 +146,7 @@ function expandWikilinksInContent(content: any[]): any[] {
|
||||
return result
|
||||
}
|
||||
|
||||
function DiffView({ diff }: { diff: string }) {
|
||||
if (!diff) {
|
||||
return (
|
||||
<div className="flex h-full items-center justify-center text-sm text-muted-foreground">
|
||||
No changes to display
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const lines = diff.split('\n')
|
||||
|
||||
return (
|
||||
<div className="font-mono text-[13px] leading-relaxed py-3">
|
||||
{lines.map((line, i) => {
|
||||
let lineClass = 'text-secondary-foreground'
|
||||
if (line.startsWith('+') && !line.startsWith('+++')) {
|
||||
lineClass = 'bg-[rgba(76,175,80,0.12)] text-[#4caf50]'
|
||||
} else if (line.startsWith('-') && !line.startsWith('---')) {
|
||||
lineClass = 'bg-[rgba(244,67,54,0.12)] text-[#f44336]'
|
||||
} else if (line.startsWith('@@')) {
|
||||
lineClass = 'bg-[rgba(33,150,243,0.08)] text-primary italic'
|
||||
} else if (line.startsWith('diff') || line.startsWith('index') || line.startsWith('---') || line.startsWith('+++') || line.startsWith('new file')) {
|
||||
lineClass = 'bg-muted text-muted-foreground font-semibold'
|
||||
}
|
||||
|
||||
return (
|
||||
<div key={i} className={cn("flex min-h-[22px] px-4", lineClass)}>
|
||||
<span className="w-10 shrink-0 text-right pr-3 text-muted-foreground select-none">
|
||||
{i + 1}
|
||||
</span>
|
||||
<span className="flex-1 whitespace-pre-wrap break-all px-2">
|
||||
{line || '\u00A0'}
|
||||
</span>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
// DiffView extracted to ./DiffView.tsx
|
||||
|
||||
/** Inner component that creates/manages BlockNote for a single tab */
|
||||
function BlockNoteTab({ content, entries, onNavigateWikilink }: { content: string; entries: VaultEntry[]; onNavigateWikilink: (target: string) => void }) {
|
||||
|
||||
Reference in New Issue
Block a user