diff --git a/components/email/email-list.tsx b/components/email/email-list.tsx index 124cad97..50f5aae5 100644 --- a/components/email/email-list.tsx +++ b/components/email/email-list.tsx @@ -3,7 +3,7 @@ import { Email, ThreadGroup } from "@/lib/jmap/types"; import { ThreadListItem } from "./thread-list-item"; import { EmailContextMenu } from "./email-context-menu"; -import { cn, formatDateTime } from "@/lib/utils"; +import { cn } from "@/lib/utils"; import { Trash2, Mail, MailX, MailOpen, Loader2, SearchX, AlertTriangle, CalendarClock } from "lucide-react"; import { useState, useEffect, useRef, useCallback, useMemo } from "react"; import { Button } from "@/components/ui/button"; @@ -121,7 +121,6 @@ export function EmailList({ const density = useSettingsStore((state) => state.density); const showPreview = useSettingsStore((state) => state.showPreview); const mailLayout = useSettingsStore((state) => state.mailLayout); - const timeFormat = useSettingsStore((state) => state.timeFormat); const isFocusedMailLayout = mailLayout === 'focus'; const footerHasMore = hasMore ?? hasMoreEmails; const footerIsLoadingMore = isLoadingMoreItems ?? isLoadingMore; @@ -482,14 +481,6 @@ export function EmailList({ onSetColorTag={onSetColorTag} onMarkAsSpam={onMarkAsSpam ? (email) => onMarkAsSpam(email) : undefined} /> - {isScheduledView && thread.latestEmail.isScheduled && ( -
- - - {thread.latestEmail.scheduledSendAt ? formatDateTime(thread.latestEmail.scheduledSendAt, timeFormat) : ''} - -
- )} ); })} diff --git a/components/email/thread-list-item.tsx b/components/email/thread-list-item.tsx index aafd03f2..68b17c40 100644 --- a/components/email/thread-list-item.tsx +++ b/components/email/thread-list-item.tsx @@ -1,11 +1,11 @@ "use client"; import React, { useCallback } from "react"; -import { formatDate, stripInvisibleLeading } from "@/lib/utils"; +import { formatDate, formatDateTime, stripInvisibleLeading } from "@/lib/utils"; import { Email, ThreadGroup } from "@/lib/jmap/types"; import { cn } from "@/lib/utils"; import { Avatar } from "@/components/ui/avatar"; -import { Paperclip, Star, Circle, ChevronRight, ChevronDown, Loader2, MessageSquare, CheckSquare, Square, Reply, Forward } from "lucide-react"; +import { Paperclip, Star, Circle, ChevronRight, ChevronDown, Loader2, MessageSquare, CheckSquare, Square, Reply, Forward, CalendarClock } from "lucide-react"; import { useSettingsStore, KEYWORD_PALETTE } from "@/stores/settings-store"; import { useUIStore } from "@/stores/ui-store"; import { useEmailStore } from "@/stores/email-store"; @@ -67,6 +67,7 @@ const SingleEmailItem = React.forwardRef( const emailKeywords = useSettingsStore((state) => state.emailKeywords); const density = useSettingsStore((state) => state.density); const mailLayout = useSettingsStore((state) => state.mailLayout); + const timeFormat = useSettingsStore((state) => state.timeFormat); const showAvatarsInJunk = useSettingsStore((state) => state.showAvatarsInJunk); const hideJunkAvatarImages = currentMailboxRole === 'junk' && !showAvatarsInJunk; const isUnifiedView = useEmailStore((state) => state.isUnifiedView); @@ -76,6 +77,9 @@ const SingleEmailItem = React.forwardRef( const isFocusedMailLayout = mailLayout === 'focus'; const trimmedPreview = stripInvisibleLeading(email.preview ?? ''); const inlinePreview = showPreview && trimmedPreview ? ` ${trimmedPreview}` : ''; + const scheduledSendLabel = email.isScheduled && email.scheduledSendAt + ? formatDateTime(email.scheduledSendAt, timeFormat) + : null; // Resolve color tags using keyword definitions; unknown tags fall back to gray const tagIds = getEmailColorTags(email.keywords); @@ -241,12 +245,22 @@ const SingleEmailItem = React.forwardRef( {resolvedKeywordDefs.map((kd) => ( ))} - - {formatDate(email.receivedAt)} - + {scheduledSendLabel ? ( + + + {scheduledSendLabel} + + ) : ( + + {formatDate(email.receivedAt)} + + )} ) : ( @@ -299,14 +313,24 @@ const SingleEmailItem = React.forwardRef( {kd.label} ))} - - {formatDate(email.receivedAt)} - + {scheduledSendLabel ? ( + + + {scheduledSendLabel} + + ) : ( + + {formatDate(email.receivedAt)} + + )} @@ -376,12 +400,16 @@ export const ThreadListItem = React.forwardRef state.showPreview); const density = useSettingsStore((state) => state.density); const mailLayout = useSettingsStore((state) => state.mailLayout); + const timeFormat = useSettingsStore((state) => state.timeFormat); const showAvatarsInJunk = useSettingsStore((state) => state.showAvatarsInJunk); const isMobile = useUIStore((state) => state.isMobile); const { latestEmail, participantNames, hasUnread, hasStarred, hasAttachment, hasAnswered, hasForwarded, emailCount } = thread; const isFocusedMailLayout = mailLayout === 'focus'; const trimmedPreview = stripInvisibleLeading(latestEmail.preview ?? ''); const inlinePreview = showPreview && trimmedPreview ? ` ${trimmedPreview}` : ''; + const scheduledSendLabel = latestEmail.isScheduled && latestEmail.scheduledSendAt + ? formatDateTime(latestEmail.scheduledSendAt, timeFormat) + : null; const { selectedMailbox, mailboxes, selectedEmailIds, toggleEmailSelection, selectRangeEmails, clearSelection, isUnifiedView } = useEmailStore(); const getAccountById = useAccountStore((state) => state.getAccountById); @@ -647,12 +675,22 @@ export const ThreadListItem = React.forwardRef )} - - {formatDate(latestEmail.receivedAt)} - + {scheduledSendLabel ? ( + + + {scheduledSendLabel} + + ) : ( + + {formatDate(latestEmail.receivedAt)} + + )} ) : ( @@ -717,14 +755,24 @@ export const ThreadListItem = React.forwardRef )} - - {formatDate(latestEmail.receivedAt)} - + {scheduledSendLabel ? ( + + + {scheduledSendLabel} + + ) : ( + + {formatDate(latestEmail.receivedAt)} + + )}