connect the draft to the thread#1381
Conversation
WalkthroughThe changes introduce draft status indicators and handling in the mail UI, normalize email recipient fields for composing replies, and extend server-side draft parsing to include CC, BCC, and an optional sender email. State management for drafts and replies is improved during thread navigation, and relevant type definitions and schemas are updated accordingly. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant MailList
participant ThreadDisplay
participant ReplyComposer
participant Server
User->>MailList: View mail threads
MailList->>Server: Fetch threads (including drafts)
Server-->>MailList: Threads with latestDraft, cc, bcc, fromEmail
MailList->>User: Show threads, display draft icon if hasDraft
User->>ThreadDisplay: Open thread
ThreadDisplay->>Server: Fetch thread details
Server-->>ThreadDisplay: Thread data with latestDraft
User->>ReplyComposer: Reply or edit draft
ReplyComposer->>Server: Get draft data (to, cc, bcc)
Server-->>ReplyComposer: Draft with normalized recipient arrays
ReplyComposer->>User: Show composer with clean recipient fields
User->>ThreadDisplay: Navigate threads or close
ThreadDisplay->>ThreadDisplay: Clear draft/reply state
Possibly related PRs
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (6)
🚧 Files skipped from review as they are similar to previous changes (6)
⏰ Context from checks skipped due to timeout of 90000ms (1)
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
057d10e to
11d2388
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
apps/mail/components/mail/mail-list.tsx (2)
81-94: Consider optimizing the filtering and sorting logic.The implementation correctly filters out drafts and finds the latest received message. However, the sorting operation runs on every render despite memoization.
Consider this optimization to reduce unnecessary sorting:
const latestReceivedMessage = useMemo(() => { if (!getThreadData?.messages) return getThreadData?.latest; const nonDraftMessages = getThreadData.messages.filter((msg) => !msg.isDraft); if (nonDraftMessages.length === 0) return getThreadData?.latest; - return ( - nonDraftMessages.sort((a, b) => { - const dateA = new Date(a.receivedOn).getTime(); - const dateB = new Date(b.receivedOn).getTime(); - return dateB - dateA; - })[0] || getThreadData?.latest - ); + return nonDraftMessages.reduce((latest, current) => { + const latestTime = new Date(latest.receivedOn).getTime(); + const currentTime = new Date(current.receivedOn).getTime(); + return currentTime > latestTime ? current : latest; + }) || getThreadData?.latest; }, [getThreadData?.messages, getThreadData?.latest]);
505-514: Consider using the translation system for consistency.The draft icon implementation is well-structured with proper conditional rendering and tooltip. However, the tooltip text is hardcoded while other parts of the codebase use the translation system.
Apply this diff to use the translation system:
- <TooltipContent className="p-1 text-xs">Draft</TooltipContent> + <TooltipContent className="p-1 text-xs"> + {t('common.draft')} + </TooltipContent>Note: Ensure the translation key
common.draftexists in your translation files.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
apps/mail/components/mail/mail-list.tsx(4 hunks)apps/mail/components/mail/reply-composer.tsx(2 hunks)apps/mail/components/mail/thread-display.tsx(4 hunks)apps/server/src/lib/driver/google.ts(1 hunks)apps/server/src/lib/driver/types.ts(1 hunks)apps/server/src/lib/schemas.ts(1 hunks)
🔇 Additional comments (13)
apps/server/src/lib/schemas.ts (1)
34-34: LGTM: Schema extension for draft sender email.The addition of the optional nullable
fromEmailfield is consistent with the existing schema pattern and supports the enhanced draft functionality.apps/server/src/lib/driver/types.ts (1)
19-20: LGTM: Interface extension for CC/BCC recipients.The addition of optional
ccandbccstring arrays properly extends the ParsedDraft interface to support complete recipient information.apps/server/src/lib/driver/google.ts (2)
1107-1110: LGTM: CC/BCC extraction from draft headers.The header parsing correctly extracts CC and BCC recipients from the draft message. The simple comma-splitting approach should handle most common cases effectively.
1118-1119: LGTM: Including parsed CC/BCC in draft object.The parsed CC and BCC arrays are properly included in the returned draft object, completing the integration with the extended ParsedDraft interface.
apps/mail/components/mail/reply-composer.tsx (2)
232-245: LGTM: Robust email array normalization utility.The
ensureEmailArrayfunction properly handles multiple input types (undefined, null, string, array) and normalizes them into clean email arrays. The logic for trimming, filtering empty values, and removing angle brackets is appropriate.
261-263: LGTM: Consistent initialization of recipient fields.The use of
ensureEmailArrayforinitialTo,initialCc, andinitialBccensures consistent handling of recipient data from drafts, regardless of the input format.apps/mail/components/mail/thread-display.tsx (3)
175-175: LGTM: Adding latestDraft to thread data.The addition of
latestDraftfrom theuseThreadhook aligns with the enhanced draft handling features, even though it's not used in the visible code segment.
211-214: LGTM: Proper state cleanup during navigation.The consistent clearing of
mode,activeReplyId, anddraftIdwhen navigating between threads or performing actions prevents stale state issues and ensures clean transitions.Also applies to: 238-240, 269-271, 280-282
219-228: LGTM: Updated dependency arrays for state setters.The dependency arrays are properly updated to include the new state setter functions, ensuring correct effect tracking and preventing stale closures.
Also applies to: 245-254, 272-272, 287-287
apps/mail/components/mail/mail-list.tsx (4)
9-16: LGTM: Import changes look correct.The addition of
PencilComposeicon to the imports is properly placed and aligns with the draft indicator functionality.
72-76: LGTM: Thread hook enhancement is well-structured.The destructuring of
latestDraftfrom theuseThreadhook is cleanly implemented and follows the existing pattern.
96-96: LGTM: Clean assignment pattern.The assignment of
latestMessageusing the computedlatestReceivedMessageis straightforward and maintains code readability.
264-267: LGTM: Draft detection logic is correct.The
hasDraftcomputation properly checks for the existence oflatestDraftwith appropriate memoization.
11d2388 to
c7e9d2c
Compare
Merge activity
|
c7e9d2c to
eff4c09
Compare
# Add draft indicator and improve draft handling in mail threads ## Description This PR adds visual indicators for drafts in mail threads and improves draft handling throughout the mail application: 1. Added a pencil icon indicator that appears next to threads containing drafts 2. Improved the display of latest messages by filtering out drafts when showing thread previews 3. Fixed draft handling in reply composer by properly parsing email addresses from drafts 4. Added support for CC and BCC fields when reopening drafts 5. Properly reset draft and reply state when navigating between threads 6. Enhanced the Google Mail Manager to include CC and BCC information from drafts ## Type of Change - [x] 🐛 Bug fix (non-breaking change which fixes an issue) - [x] ✨ New feature (non-breaking change which adds functionality) - [x] 🎨 UI/UX improvement ## Areas Affected - [x] Email Integration (Gmail, IMAP, etc.) - [x] User Interface/Experience <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Draft status is now visually indicated in mail threads with a draft icon. - Draft emails now support CC and BCC recipient fields, which are populated when composing or editing drafts. - The draft data structure now includes an optional sender email address field. - **Bug Fixes** - Email recipient fields (To, CC, BCC) are consistently formatted and cleaned when initializing the email composer. - **Improvements** - Navigating between threads or moving emails clears any draft or reply state to prevent unintended carryover. <!-- end of auto-generated comment: release notes by coderabbit.ai -->

Add draft indicator and improve draft handling in mail threads
Description
This PR adds visual indicators for drafts in mail threads and improves draft handling throughout the mail application:
Type of Change
Areas Affected
Summary by CodeRabbit
New Features
Bug Fixes
Improvements