import React, { useState, useMemo } from 'react'; import { MessageSender } from '../types'; import { FileText, Edit3, Eye, Code, Copy, Check } from 'lucide-react'; import { marked } from 'marked'; import DOMPurify from 'dompurify'; interface NotepadProps { content: string; lastUpdatedBy?: MessageSender | null; isLoading: boolean; } const Notepad: React.FC = ({ content, lastUpdatedBy, isLoading }) => { const [isPreviewMode, setIsPreviewMode] = useState(false); const [isCopied, setIsCopied] = useState(false); const getSenderColor = (sender?: MessageSender | null) => { if (sender === MessageSender.Cognito) return 'text-green-400'; if (sender === MessageSender.Muse) return 'text-purple-400'; return 'text-gray-400'; }; const processedHtml = useMemo(() => { if (isPreviewMode) { const rawHtml = marked.parse(content) as string; return DOMPurify.sanitize(rawHtml); } return ''; }, [content, isPreviewMode]); const handleCopyNotepad = async () => { try { await navigator.clipboard.writeText(content); setIsCopied(true); setTimeout(() => setIsCopied(false), 2000); } catch (err) { console.error('无法复制记事本内容: ', err); // Optionally, display an error message to the user } }; return (

记事本

{isLoading && AI 思考中...}
{isPreviewMode ? (
) : (