mirror of
https://github.com/amitwh/markdown-converter.git
synced 2026-08-02 18:10:18 +05:30
feat(renderer): EditorPane with empty state and CodeMirror rendering
This commit is contained in:
@@ -0,0 +1,25 @@
|
||||
import { CodeMirrorEditor } from './CodeMirrorEditor';
|
||||
import { useEditorStore } from '@/stores/editor-store';
|
||||
|
||||
export function EditorPane() {
|
||||
const { buffers, activeId } = useEditorStore();
|
||||
const buf = activeId ? buffers.get(activeId) : null;
|
||||
|
||||
if (!buf) {
|
||||
return (
|
||||
<div className="flex h-full items-center justify-center bg-background text-muted-foreground">
|
||||
<p>No file open. Use File → Open to start.</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="h-full">
|
||||
<CodeMirrorEditor
|
||||
key={buf.id}
|
||||
bufferId={buf.id}
|
||||
initialContent={buf.content}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,38 @@
|
||||
import { describe, it, expect, beforeEach, vi } from 'vitest';
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import { ThemeProvider } from '@/components/theme-provider';
|
||||
import { EditorPane } from '@/components/editor/EditorPane';
|
||||
import { useEditorStore } from '@/stores/editor-store';
|
||||
import { CodeMirrorEditor } from '@/components/editor/CodeMirrorEditor';
|
||||
|
||||
vi.mock('@/components/editor/CodeMirrorEditor', () => ({
|
||||
CodeMirrorEditor: ({ initialContent }: { initialContent: string }) => (
|
||||
<div data-testid="codemirror-mock">{initialContent}</div>
|
||||
),
|
||||
}));
|
||||
|
||||
describe('EditorPane', () => {
|
||||
beforeEach(() => {
|
||||
useEditorStore.setState({ buffers: new Map(), activeId: null });
|
||||
});
|
||||
|
||||
it('renders the empty state when no buffer is open', () => {
|
||||
render(
|
||||
<ThemeProvider defaultTheme="dark" attribute="class">
|
||||
<EditorPane />
|
||||
</ThemeProvider>
|
||||
);
|
||||
expect(screen.getByText(/no file open/i)).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders the editor when a buffer is open', () => {
|
||||
useEditorStore.getState().openBuffer('b1', '/x.md', '# hello');
|
||||
render(
|
||||
<ThemeProvider defaultTheme="dark" attribute="class">
|
||||
<EditorPane />
|
||||
</ThemeProvider>
|
||||
);
|
||||
expect(screen.getByTestId('codemirror-mock')).toBeInTheDocument();
|
||||
expect(screen.getByTestId('codemirror-mock')).toHaveTextContent('# hello');
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user