'use client';

import { Suspense } from 'react';
import { EditorSidebar } from './editor-sidebar';
import { SimpleEditor } from '@/components/tiptap-templates/simple/simple-editor';
import { EditorProvider } from '@/components/articles/context';

export function EditorLayout() {
	return (
		<EditorProvider>
			<div className="flex h-screen bg-background">
				{/* 右侧编辑器内容区 */}
				<div className="flex-1 flex flex-col overflow-hidden">
					<div className="flex-1 overflow-auto">
						<SimpleEditor />
					</div>
				</div>
				{/* 左侧侧边栏 */}
				<Suspense fallback={<div className="w-80 bg-muted animate-pulse" />}>
					<EditorSidebar />
				</Suspense>
			</div>
		</EditorProvider>
	);
}