import styles from '../DrawPDFFields/style.module.scss'
import { PdfPage } from '../../types/drawing.ts'
import { MarkConfigDetails, MarkLocation } from '../../types/mark.ts'
import PdfMarkItem from './PdfMarkItem.tsx'
import { useState } from 'react';
interface PdfPageProps {
  page: PdfPage
  markConfigDetails: MarkConfigDetails[]
}

const PdfPageItem = ({ page, markConfigDetails }: PdfPageProps) => {
  const [currentMark, setCurrentMark] = useState<MarkLocation | null>(null);

  return (
    <div
      style={{
        border: '1px solid #c4c4c4',
        marginBottom: '10px'
      }}
      className={styles.pdfImageWrapper}
    >
      <img draggable="false" style={{width: '100%'}} src={page.image} />
      {markConfigDetails.map((detail, i) => (
        <PdfMarkItem key={i} markLocation={detail.markLocation} />
      ))}
    </div>
  )
}

export default PdfPageItem