'use client'

import React from 'react'
import { useDesignStore } from '@/stores/design-store'
import { FileText } from 'lucide-react'
import DocumentEditor from '@/components/ui/document-editor'

const SimpleDocumentPanel: React.FC = () => {
  const { currentDesign } = useDesignStore()

  return (
    <div className="flex flex-col h-full bg-white">
      {/* Header */}
      {/* <div className="border-b border-gray-200 p-4">
        <div className="flex items-center gap-2">
          <FileText className="h-5 w-5 text-gray-700" />
          <h2 className="text-lg font-semibold text-gray-900">
            Document
          </h2>
        </div>
        
        {currentDesign && (
          <p className="text-sm text-gray-600 mt-1">
            Notes for {currentDesign.name}
          </p>
        )}
      </div> */}

      {/* Document Editor */}
      <div className="flex-1">
        <DocumentEditor key={currentDesign?.id || 'no-design'} />
      </div>
    </div>
  )
}

export default SimpleDocumentPanel