courrier clean 2

This commit is contained in:
alma 2025-04-26 15:03:46 +02:00
parent 24bafdcce4
commit d607cc54bb

View File

@ -237,6 +237,7 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
const [body, setBody] = useState<string>('');
const [userMessage, setUserMessage] = useState<string>('');
const [originalContent, setOriginalContent] = useState<string>('');
const [editingOriginalContent, setEditingOriginalContent] = useState<boolean>(false);
const [showCc, setShowCc] = useState<boolean>(false);
const [showBcc, setShowBcc] = useState<boolean>(false);
const [sending, setSending] = useState<boolean>(false);
@ -249,6 +250,7 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
// Refs
const editorRef = useRef<HTMLDivElement>(null);
const originalContentRef = useRef<HTMLDivElement>(null);
const attachmentInputRef = useRef<HTMLInputElement>(null);
// Initialize the form when replying to or forwarding an email
@ -411,6 +413,19 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
setAttachments(current => current.filter((_, i) => i !== index));
};
// Handle editing of original content
const handleOriginalContentInput = (e: React.FormEvent<HTMLDivElement>) => {
if (originalContentRef.current) {
const content = originalContentRef.current.innerHTML;
setOriginalContent(content);
}
};
// Toggle original content editing
const toggleEditOriginalContent = () => {
setEditingOriginalContent(!editingOriginalContent);
};
// Modified send handler to combine user message with forwarded content
const handleSend = async () => {
if (!to) {
@ -618,17 +633,35 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
}}
/>
{/* Original content display with visual separation - now as plain text for better reliability */}
{/* Original content display with visual separation */}
{type !== 'new' && originalContent && (
<div className="border-t">
<div className="px-4 py-2 bg-gray-50 text-xs font-medium text-gray-500">
{type === 'forward' ? 'Forwarded content (original)' : 'Original message'}
<div className="px-4 py-2 bg-gray-50 text-xs font-medium text-gray-500 flex justify-between items-center">
<span>{type === 'forward' ? 'Forwarded content (original)' : 'Original message'}</span>
<Button
variant="ghost"
size="sm"
onClick={toggleEditOriginalContent}
className="h-6 px-2 text-xs"
>
{editingOriginalContent ? 'Done Editing' : 'Edit Content'}
</Button>
</div>
<div className="p-4 bg-gray-50 border-t overflow-auto max-h-[400px]">
<div
className="forwarded-content text-sm"
dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(originalContent) }}
/>
{editingOriginalContent ? (
<div
ref={originalContentRef}
contentEditable={true}
className="forwarded-content text-sm"
dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(originalContent) }}
onInput={handleOriginalContentInput}
/>
) : (
<div
className="forwarded-content text-sm"
dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(originalContent) }}
/>
)}
</div>
</div>
)}