import React from "react";
import { parseMarkdown } from "../../utils/markdown";
import { useMarkdown } from "../../hooks/useMarkdown";

interface NotePreviewProps {
  content: string;
}

export const NotePreview: React.FC<NotePreviewProps> = ({ content }) => {
  useMarkdown(); // Инициализируем обработчики спойлеров и внешних ссылок

  const htmlContent = parseMarkdown(content);

  return (
    <div className="note-preview-container" style={{ display: "block" }}>
      <div className="note-preview-header">
        <span>Предпросмотр:</span>
      </div>
      <div
        className="note-preview-content"
        dangerouslySetInnerHTML={{ __html: htmlContent }}
      />
    </div>
  );
};