courrier refactor rebuild preview
This commit is contained in:
parent
a2a088cf0f
commit
3c4151335b
@ -6,9 +6,14 @@ import { Button } from '@/components/ui/button';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { ScrollArea } from '@/components/ui/scroll-area';
|
||||
import { sanitizeHtml } from '@/lib/utils/email-formatter';
|
||||
import { Avatar } from '@/components/ui/avatar';
|
||||
import { AvatarFallback, AvatarImage } from '@/components/ui/avatar';
|
||||
import { Avatar, AvatarFallback } from '@/components/ui/avatar';
|
||||
import { AvatarImage } from '@/components/ui/avatar';
|
||||
import { Card } from '@/components/ui/card';
|
||||
import { formatDate } from '@/lib/date';
|
||||
import { cn } from '@/lib/utils';
|
||||
import { CalendarIcon, PaperclipIcon } from 'lucide-react';
|
||||
import Link from 'next/link';
|
||||
import { formatEmailContent } from '@/lib/email-formatter';
|
||||
|
||||
interface EmailAddress {
|
||||
name: string;
|
||||
@ -82,16 +87,13 @@ export default function EmailPreview({ email, loading = false, onReply }: EmailP
|
||||
};
|
||||
|
||||
// Get sender initials for avatar
|
||||
const getSenderInitials = (sender: EmailAddress | undefined) => {
|
||||
if (!sender) return 'U';
|
||||
if (sender.name) {
|
||||
const parts = sender.name.split(' ');
|
||||
if (parts.length > 1) {
|
||||
return `${parts[0][0]}${parts[parts.length - 1][0]}`.toUpperCase();
|
||||
}
|
||||
return sender.name[0].toUpperCase();
|
||||
}
|
||||
return sender.address[0].toUpperCase();
|
||||
const getSenderInitials = (name: string) => {
|
||||
return name
|
||||
.split(" ")
|
||||
.map((n) => n[0])
|
||||
.join("")
|
||||
.toUpperCase()
|
||||
.slice(0, 2);
|
||||
};
|
||||
|
||||
// Display loading state
|
||||
@ -119,6 +121,9 @@ export default function EmailPreview({ email, loading = false, onReply }: EmailP
|
||||
|
||||
const sender = email.from && email.from.length > 0 ? email.from[0] : undefined;
|
||||
|
||||
// Format email content for display
|
||||
const formattedContent = formatEmailContent(email.content, 'preview');
|
||||
|
||||
return (
|
||||
<Card className="flex flex-col h-full overflow-hidden border-0 shadow-none">
|
||||
{/* Email header */}
|
||||
@ -128,7 +133,7 @@ export default function EmailPreview({ email, loading = false, onReply }: EmailP
|
||||
|
||||
<div className="flex items-start gap-3 mb-4">
|
||||
<Avatar className="h-10 w-10">
|
||||
<AvatarFallback>{getSenderInitials(sender)}</AvatarFallback>
|
||||
<AvatarFallback>{getSenderInitials(sender?.name || '')}</AvatarFallback>
|
||||
</Avatar>
|
||||
|
||||
<div className="flex-1 min-w-0">
|
||||
@ -201,9 +206,16 @@ export default function EmailPreview({ email, loading = false, onReply }: EmailP
|
||||
<div className="px-6 py-5">
|
||||
{email.content ? (
|
||||
<div
|
||||
className="email-content-display prose prose-sm max-w-none"
|
||||
className={cn(
|
||||
"email-content-display prose prose-sm max-w-none",
|
||||
!email.flags?.seen && "font-medium"
|
||||
)}
|
||||
style={{
|
||||
overflowWrap: 'break-word',
|
||||
wordBreak: 'break-word'
|
||||
}}
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: sanitizeHtml(email.content)
|
||||
__html: formattedContent
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
|
||||
Loading…
Reference in New Issue
Block a user