@nocobase/app-plugin-mail 1.0.0-beta.11 → 1.0.0-beta.12

package/dist/client/pages/mail-workspace-page.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { PageContainer } from '../components/page-container.js';
 import { PageHeader } from '../components/page-header.js';
-import { prepareReplyContent } from '../lib/mail-reply-content.js';
+import { prepareMailReply } from '../prepare-mail-reply.js';
 import { mailErrorDescription } from '../lib/mail-error-description.js';
 import { useMailWorkspaceData } from '../hooks/use-mail-workspace-data.js';
 import { createForwardQuote, readDraftComposerBody, } from '../lib/mail-forward-content.js';
 import { EMPTY_COMPOSER, } from '../lib/mail-composer-state.js';
-import { ChevronLeft, ChevronRight, Inbox, PenLine, RefreshCw, Search, } from 'lucide-react';
+import { ChevronLeft, ChevronRight, Mailbox, Inbox, PenLine, RefreshCw, Search, } from 'lucide-react';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useTranslation } from '@nocobase/i18n/client';
 import { resolveAppUrl } from '@nocobase/app-client';
@@ -14,6 +14,8 @@ import { MailWorkspaceComposer } from '../components/mail-workspace-composer.js'
 import { MailboxSidebar, MailConversationView, MailMessageList, MAIL_UNREAD_COUNT_CHANGED_EVENT, } from '../components/index.js';
 import { Button } from '../components/ui/button.js';
 import { Input } from '../components/ui/input.js';
+import { Sheet, SheetContent, SheetHeader, SheetTitle, } from '../components/ui/sheet.js';
+import { cn } from '../lib/utils.js';
 import { getMailFolderDisplayName, getMailFolderSections, getVirtualMailFolders, } from '../lib/mail-folders.js';
 import { mailErrorMessage, } from '../mail-client.js';
 import { useMailClient } from '../runtime.js';
@@ -21,7 +23,7 @@ import { mailSyncDateMonthsAgo } from '../../shared/mail-sync-date.js';
 import { MAIL_VIRTUAL_FOLDER_IDS } from '../../shared/mail.js';
 import { MAIL_PLUGIN_NS } from '../namespace.js';
 const LAST_COMPOSE_ACCOUNT_KEY_PREFIX = 'nocobase:mail:last-compose-account:v1:';
-export default function MailWorkspacePage({ title, description, templateVariables = {}, accountsHref, } = {}) {
+export default function MailWorkspacePage({ title, description, accountsHref, headerActions, templateVariables = {}, } = {}) {
     const { t } = useTranslation(MAIL_PLUGIN_NS);
     const mail = useMailClient();
     const [accounts, setAccounts] = useState([]);
@@ -46,6 +48,24 @@ export default function MailWorkspacePage({ title, description, templateVariable
     const [debouncedQuery, setDebouncedQuery] = useState('');
     const [composeAccountId, setComposeAccountId] = useState('');
     const [composerRequest, setComposerRequest] = useState();
+    const [navigationOpen, setNavigationOpen] = useState(false);
+    const workspaceRef = useRef(null);
+    const navigationButtonRef = useRef(null);
+    const conversationBackRef = useRef(null);
+    const selectedRowRef = useRef(null);
+    useEffect(() => {
+        if (!navigationOpen ||
+            !navigationButtonRef.current ||
+            typeof ResizeObserver === 'undefined')
+            return;
+        // CSS owns the breakpoint; observing its trigger also handles root font changes.
+        const observer = new ResizeObserver(() => {
+            if (!navigationButtonRef.current?.getClientRects().length)
+                setNavigationOpen(false);
+        });
+        observer.observe(navigationButtonRef.current);
+        return () => observer.disconnect();
+    }, [navigationOpen]);
     useEffect(() => {
         syncRunsRef.current = syncRuns;
     }, [syncRuns]);
@@ -70,6 +90,14 @@ export default function MailWorkspacePage({ title, description, templateVariable
         setError,
         onFocus: () => loadAccounts(false),
     });
+    const selectedMessageKey = selected
+        ? JSON.stringify([selected.accountId, selected.id])
+        : undefined;
+    useEffect(() => {
+        if (selectedMessageKey &&
+            navigationButtonRef.current?.getClientRects().length)
+            conversationBackRef.current?.focus({ preventScroll: true });
+    }, [selectedMessageKey]);
     const currentAccount = accounts.find((account) => account.id === accountId);
     const currentProviderCapabilities = findProviderCapabilities(currentAccount, providers);
     const composeAccount = accounts.find((account) => account.id === composeAccountId);
@@ -436,6 +464,11 @@ export default function MailWorkspacePage({ title, description, templateVariable
     const syncLabel = isAllAccounts
         ? t('workspace.syncAll', { defaultValue: 'Sync all mailboxes' })
         : t('workspace.incrementalRefresh', { defaultValue: 'Sync mailbox' });
+    const closeMailboxNavigation = () => {
+        setNavigationOpen(false);
+        if (navigationOpen)
+            clearSelection();
+    };
     const mailboxNavigation = (_jsx(MailboxSidebar, { accountId: accountId, accounts: accounts, customLabels: customLabels, folderId: folderId, folderAccountId: folderAccountId, folders: folders, accountFolderGroups: accountFolderGroups, labelId: labelId, labels: {
             account: t('dev.account', { defaultValue: 'Account' }),
             allAccounts: t('workspace.allAccounts', {
@@ -449,6 +482,7 @@ export default function MailWorkspacePage({ title, description, templateVariable
             folderNames,
             systemFolderNames,
         }, onAccountChange: (value) => {
+            closeMailboxNavigation();
             if (value === accountId)
                 return;
             cancelRequests();
@@ -462,6 +496,7 @@ export default function MailWorkspacePage({ title, description, templateVariable
             setLabelId(undefined);
             setSmartView('all');
         }, onFolderChange: (value, ownerAccountId) => {
+            closeMailboxNavigation();
             if (value === folderId && ownerAccountId === folderAccountId)
                 return;
             cancelRequests();
@@ -470,6 +505,7 @@ export default function MailWorkspacePage({ title, description, templateVariable
             setLabelId(undefined);
             setSmartView('all');
         }, onLabelChange: (value) => {
+            closeMailboxNavigation();
             if (value === labelId)
                 return;
             cancelRequests();
@@ -478,6 +514,7 @@ export default function MailWorkspacePage({ title, description, templateVariable
             setFolderAccountId(undefined);
             setSmartView('all');
         }, onSmartViewChange: (value) => {
+            closeMailboxNavigation();
             if (value === smartView)
                 return;
             cancelRequests();
@@ -513,11 +550,13 @@ export default function MailWorkspacePage({ title, description, templateVariable
                                         ? t('workspace.syncing', {
                                             defaultValue: 'Synchronizing…',
                                         })
-                                        : syncLabel })] })] }) }), _jsxs("div", { className: 'flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden rounded-xl border bg-background', children: [_jsx("div", { className: 'shrink-0 border-b p-4', children: _jsxs("label", { className: 'relative block w-full min-w-0 sm:w-64', children: [_jsx(Search, { "aria-hidden": 'true', className: 'absolute top-1/2 left-3 size-4 -translate-y-1/2 text-muted-foreground' }), _jsx(Input, { "aria-label": t('workspace.search', {
-                                        defaultValue: 'Search mail',
-                                    }), className: 'pl-9', onChange: (event) => setQuery(event.target.value), placeholder: t('workspace.search', {
-                                        defaultValue: 'Search mail',
-                                    }), value: query })] }) }), error ? (_jsxs("div", { role: 'alert', className: 'flex items-center gap-3 border-b bg-destructive/5 px-4 py-2 text-sm text-destructive', children: [_jsx("span", { className: 'flex-1', children: error }), _jsx(Button, { onClick: () => {
+                                        : syncLabel })] }), accountsHref && accounts.length > 0 ? (_jsx(Button, { render: _jsx("a", { href: resolveAppUrl(accountsHref) }), nativeButton: false, role: 'link', variant: 'outline', children: t('navigation.accounts', { defaultValue: 'Mail accounts' }) })) : null, headerActions] }) }), _jsxs("div", { ref: workspaceRef, "data-slot": 'mail-workspace', className: '@container/mail flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden rounded-xl border bg-background', children: [_jsxs("div", { className: 'flex shrink-0 flex-wrap items-center gap-2 border-b p-4', children: [accounts.length > 0 ? (_jsxs(Button, { ref: navigationButtonRef, variant: 'outline', className: '@min-[56rem]/mail:hidden', "aria-haspopup": 'dialog', "aria-expanded": navigationOpen, onClick: () => setNavigationOpen(true), children: [_jsx(Mailbox, { "aria-hidden": 'true', className: 'size-4' }), t('workspace.mailboxNavigation', {
+                                        defaultValue: 'Mailboxes and folders',
+                                    })] })) : null, _jsxs("label", { className: 'relative block w-full min-w-0 @min-[32rem]/mail:w-64', children: [_jsx(Search, { "aria-hidden": 'true', className: 'absolute top-1/2 left-3 size-4 -translate-y-1/2 text-muted-foreground' }), _jsx(Input, { "aria-label": t('workspace.search', {
+                                            defaultValue: 'Search mail',
+                                        }), className: 'pl-9', onChange: (event) => setQuery(event.target.value), placeholder: t('workspace.search', {
+                                            defaultValue: 'Search mail',
+                                        }), value: query })] })] }), error ? (_jsxs("div", { role: 'alert', className: 'flex items-center gap-3 border-b bg-destructive/5 px-4 py-2 text-sm text-destructive', children: [_jsx("span", { className: 'flex-1', children: error }), _jsx(Button, { onClick: () => {
                                     loadAccounts();
                                     setReloadVersion((version) => version + 1);
                                 }, variant: 'ghost', children: t('workspace.retry', { defaultValue: 'Try again' }) })] })) : null, notice ? (_jsxs("div", { role: 'status', className: 'flex items-center gap-3 border-b bg-primary/5 px-4 py-2 text-sm', children: [_jsx("span", { className: 'flex-1', children: notice }), _jsx(Button, { variant: 'ghost', onClick: () => setNotice(undefined), children: t('workspace.dismiss', { defaultValue: 'Dismiss' }) })] })) : null, loadingAccounts && accounts.length === 0 ? (_jsxs("div", { role: 'status', className: 'flex min-h-64 flex-1 items-center justify-center gap-2 text-sm text-muted-foreground', children: [_jsx(RefreshCw, { "aria-hidden": 'true', className: 'size-4 animate-spin' }), t('workspace.loading', { defaultValue: 'Loading messages…' })] })) : accounts.length === 0 ? (_jsx("div", { className: 'grid flex-1 place-items-center p-8', children: _jsxs("div", { className: 'max-w-md space-y-4 text-center', children: [_jsx("span", { className: 'mx-auto grid size-14 place-items-center rounded-2xl bg-muted', children: _jsx(Inbox, { "aria-hidden": 'true', className: 'size-6 text-muted-foreground' }) }), _jsxs("div", { children: [_jsx("h2", { className: 'text-lg font-semibold text-foreground', children: t('workspace.noAccountsTitle', {
@@ -526,7 +565,14 @@ export default function MailWorkspacePage({ title, description, templateVariable
                                                 defaultValue: 'Connect a mail account to sync messages, search conversations, and send from this workspace.',
                                             }) })] }), accountsHref ? (_jsxs(Button, { render: _jsx("a", { href: resolveAppUrl(accountsHref) }), nativeButton: false, role: 'link', children: [_jsx(PenLine, { "aria-hidden": 'true', className: 'size-4' }), t('workspace.connectAccount', {
                                             defaultValue: 'Connect mail account',
-                                        })] })) : null] }) })) : (_jsxs("div", { className: 'grid min-h-0 flex-1 grid-cols-[13rem_20rem_minmax(0,1fr)] overflow-hidden', children: [_jsx("div", { className: 'min-h-0', children: mailboxNavigation }), _jsxs("div", { className: 'flex min-h-0 flex-col border-r', children: [_jsx("div", { className: 'flex shrink-0 items-center justify-between gap-3 border-b bg-muted/20 px-4 py-3', children: _jsx("h2", { className: 'truncate text-sm font-semibold', children: viewTitle }) }), _jsx(MailMessageList, { accountNames: accountNames, availableLabels: customLabels, labels: {
+                                        })] })) : null] }) })) : (_jsxs("div", { className: 'grid min-h-0 min-w-0 flex-1 grid-cols-1 overflow-hidden @min-[56rem]/mail:grid-cols-[13rem_20rem_minmax(0,1fr)]', children: [_jsx("div", { "data-slot": 'mail-navigation-pane', className: 'hidden min-h-0 @min-[56rem]/mail:block', children: mailboxNavigation }), _jsxs("div", { "data-slot": 'mail-list-pane', onClickCapture: (event) => {
+                                    if (!(event.target instanceof Element))
+                                        return;
+                                    const row = event.target.closest('button');
+                                    const list = event.currentTarget.querySelector('section');
+                                    if (row instanceof HTMLButtonElement && list?.contains(row))
+                                        selectedRowRef.current = row;
+                                }, className: cn('min-h-0 min-w-0 flex-col @min-[56rem]/mail:flex @min-[56rem]/mail:border-r', selected ? 'hidden' : 'flex'), children: [_jsx("div", { className: 'flex shrink-0 items-center justify-between gap-3 border-b bg-muted/20 px-4 py-3', children: _jsx("h2", { className: 'truncate text-sm font-semibold', children: viewTitle }) }), _jsx(MailMessageList, { accountNames: accountNames, availableLabels: customLabels, labels: {
                                             loading: t('workspace.loading', {
                                                 defaultValue: 'Loading messages…',
                                             }),
@@ -569,168 +615,176 @@ export default function MailWorkspacePage({ title, description, templateVariable
                                                             defaultValue: 'Next page',
                                                         }), title: t('workspace.nextPage', {
                                                             defaultValue: 'Next page',
-                                                        }), type: 'button', onClick: () => changeMessagePage(pageIndex + 1), children: _jsx(ChevronRight, { "aria-hidden": 'true', className: 'size-3.5' }) })] })] })] }), _jsx("div", { className: 'flex min-h-0 min-w-0 flex-col', children: _jsx(MailConversationView, { availableLabels: selectedMessageCanUseLabels ? customLabels : [], actions: selectedMessageAccount?.status === 'active'
-                                        ? {
-                                            archive: selectedMessageCanMove
-                                                ? (message) => {
-                                                    const archive = foldersByAccountId
-                                                        .get(message.accountId)
-                                                        ?.find((folder) => folder.type === 'archive');
-                                                    if (archive)
-                                                        mutateMessage(mail.moveMessage({
-                                                            accountId: message.accountId,
-                                                            messageId: message.id,
-                                                            providerFolderId: archive.providerFolderId,
-                                                        }), true);
-                                                }
-                                                : undefined,
-                                            delete: (message) => deleteWorkspaceMessage(message),
-                                            canDelete: (message) => Boolean(!message.scheduledSend &&
-                                                (selectedMessageProviderCapabilities?.moveMessage ||
-                                                    isMessageInTrash(message, foldersByAccountId) ||
-                                                    message.providerMessageId.startsWith('local-draft:'))),
-                                            downloadAttachment: (message, attachment) => {
-                                                void downloadAttachment(mail, message, attachment).catch((cause) => setError(mailErrorMessage(cause, t('workspace.downloadFailed', {
-                                                    defaultValue: 'Unable to download attachment.',
-                                                }))));
-                                            },
-                                            reply: (message) => {
-                                                if (preparingReplyRef.current || composerRequest)
-                                                    return;
-                                                preparingReplyRef.current = true;
-                                                void prepareReplyContent(mail, message)
-                                                    .then(({ message: source, quote, uploads }) => {
-                                                    openComposer({
-                                                        ...EMPTY_COMPOSER,
-                                                        mode: 'reply',
-                                                        forwardQuote: quote,
-                                                        relatedMessageId: source.id,
-                                                        to: source.replyTo.length
-                                                            ? source.replyTo
-                                                                .map((address) => address.address)
-                                                                .join(', ')
-                                                            : (source.from?.address ?? ''),
-                                                        subject: replySubject(source.subject),
-                                                    }, [], source.accountId, uploads);
-                                                })
-                                                    .catch(requestError)
-                                                    .finally(() => {
-                                                    preparingReplyRef.current = false;
-                                                });
-                                            },
-                                            forward: (message) => openComposer({
-                                                ...EMPTY_COMPOSER,
-                                                mode: 'forward',
-                                                relatedMessageId: message.id,
-                                                subject: forwardSubject(message.subject),
-                                                forwardQuote: createForwardQuote(message),
-                                                forwardBodyIncluded: true,
-                                            }, [], message.accountId),
-                                            cancelScheduled: (message) => editScheduledDraft(message, () => { }),
-                                            editDraft: selectedMessageCanDraft
-                                                ? (message) => editScheduledDraft(message, (message) => openComposer({
+                                                        }), type: 'button', onClick: () => changeMessagePage(pageIndex + 1), children: _jsx(ChevronRight, { "aria-hidden": 'true', className: 'size-3.5' }) })] })] })] }), _jsxs("div", { "data-slot": 'mail-conversation-pane', className: cn('min-h-0 min-w-0 flex-col @min-[56rem]/mail:flex', selected ? 'flex' : 'hidden'), children: [_jsxs(Button, { ref: conversationBackRef, variant: 'ghost', className: 'm-2 shrink-0 self-start @min-[56rem]/mail:hidden', onClick: () => {
+                                            clearSelection();
+                                            window.requestAnimationFrame(() => {
+                                                if (selectedRowRef.current?.isConnected)
+                                                    selectedRowRef.current.focus({ preventScroll: true });
+                                            });
+                                        }, children: [_jsx(ChevronLeft, { "aria-hidden": 'true', className: 'size-4' }), t('workspace.backToMessages', {
+                                                defaultValue: 'Back to message list',
+                                            })] }), _jsx(MailConversationView, { availableLabels: selectedMessageCanUseLabels ? customLabels : [], actions: selectedMessageAccount?.status === 'active'
+                                            ? {
+                                                archive: selectedMessageCanMove
+                                                    ? (message) => {
+                                                        const archive = foldersByAccountId
+                                                            .get(message.accountId)
+                                                            ?.find((folder) => folder.type === 'archive');
+                                                        if (archive)
+                                                            mutateMessage(mail.moveMessage({
+                                                                accountId: message.accountId,
+                                                                messageId: message.id,
+                                                                providerFolderId: archive.providerFolderId,
+                                                            }), true);
+                                                    }
+                                                    : undefined,
+                                                delete: (message) => deleteWorkspaceMessage(message),
+                                                canDelete: (message) => Boolean(!message.scheduledSend &&
+                                                    (selectedMessageProviderCapabilities?.moveMessage ||
+                                                        isMessageInTrash(message, foldersByAccountId) ||
+                                                        message.providerMessageId.startsWith('local-draft:'))),
+                                                downloadAttachment: (message, attachment) => {
+                                                    void downloadAttachment(mail, message, attachment).catch((cause) => setError(mailErrorMessage(cause, t('workspace.downloadFailed', {
+                                                        defaultValue: 'Unable to download attachment.',
+                                                    }))));
+                                                },
+                                                reply: (message) => {
+                                                    if (preparingReplyRef.current || composerRequest)
+                                                        return;
+                                                    preparingReplyRef.current = true;
+                                                    void prepareMailReply(mail, message)
+                                                        .then((reply) => {
+                                                        openComposer(reply.value, reply.attachments, reply.accountId, reply.uploads);
+                                                    })
+                                                        .catch(requestError)
+                                                        .finally(() => {
+                                                        preparingReplyRef.current = false;
+                                                    });
+                                                },
+                                                forward: (message) => openComposer({
                                                     ...EMPTY_COMPOSER,
-                                                    mode: 'edit',
-                                                    draftMessageId: message.id,
-                                                    draftRevision: message.draftRevision,
-                                                    draftSource: message.draftSource,
-                                                    fromAddress: message.from?.address,
-                                                    to: formatAddressList(message.to),
-                                                    cc: formatAddressList(message.cc),
-                                                    bcc: formatAddressList(message.bcc),
-                                                    subject: message.subject,
-                                                    ...readDraftComposerBody(message),
-                                                    draftConflict: message.draftConflict,
-                                                }, message.attachments, message.accountId))
-                                                : undefined,
-                                            toggleRead: (message) => mutateMessage(setMessageRead(message, !message.read)),
-                                            toggleStarred: (message) => mutateMessage(mail.updateMessage({
-                                                accountId: message.accountId,
-                                                messageId: message.id,
-                                                starred: !message.starred,
-                                            })),
-                                            toggleTodo: (message) => mutateMessage(mail.updateMessage({
-                                                accountId: message.accountId,
-                                                messageId: message.id,
-                                                todo: !message.todo,
-                                            })),
-                                            saveNote: (message, note) => mutateMessage(mail.updateMessage({
-                                                accountId: message.accountId,
-                                                messageId: message.id,
-                                                note: note.trim() || null,
-                                            })),
-                                            toggleLabel: selectedMessageCanUseLabels
-                                                ? (message, labelId, assigned) => mutateMessage(mail.updateMessageLabels({
+                                                    mode: 'forward',
+                                                    relatedMessageId: message.id,
+                                                    subject: forwardSubject(message.subject),
+                                                    forwardQuote: createForwardQuote(message),
+                                                    forwardBodyIncluded: true,
+                                                }, [], message.accountId),
+                                                cancelScheduled: (message) => editScheduledDraft(message, () => { }),
+                                                editDraft: selectedMessageCanDraft
+                                                    ? (message) => editScheduledDraft(message, (message) => openComposer({
+                                                        ...EMPTY_COMPOSER,
+                                                        mode: 'edit',
+                                                        draftMessageId: message.id,
+                                                        draftRevision: message.draftRevision,
+                                                        draftSource: message.draftSource,
+                                                        fromAddress: message.from?.address,
+                                                        to: formatAddressList(message.to),
+                                                        cc: formatAddressList(message.cc),
+                                                        bcc: formatAddressList(message.bcc),
+                                                        subject: message.subject,
+                                                        ...readDraftComposerBody(message),
+                                                        draftConflict: message.draftConflict,
+                                                    }, message.attachments, message.accountId))
+                                                    : undefined,
+                                                toggleRead: (message) => mutateMessage(setMessageRead(message, !message.read)),
+                                                toggleStarred: (message) => mutateMessage(mail.updateMessage({
                                                     accountId: message.accountId,
                                                     messageId: message.id,
-                                                    addLabelIds: assigned ? [labelId] : [],
-                                                    removeLabelIds: assigned ? [] : [labelId],
-                                                }))
-                                                : undefined,
-                                        }
-                                        : undefined, actionLabels: {
-                                        archive: t('workspace.archive', { defaultValue: 'Archive' }),
-                                        delete: selectedMessageInTrash
-                                            ? t('workspace.permanentlyDelete', {
-                                                defaultValue: 'Permanently delete',
-                                            })
-                                            : t('workspace.delete', { defaultValue: 'Delete' }),
-                                        download: t('workspace.download', {
-                                            defaultValue: 'Download',
-                                        }),
-                                        reply: t('workspace.reply', { defaultValue: 'Reply' }),
-                                        forward: t('workspace.forward', { defaultValue: 'Forward' }),
-                                        editDraft: t('workspace.editDraft', {
-                                            defaultValue: 'Edit draft',
-                                        }),
-                                        markRead: t('workspace.markRead', {
-                                            defaultValue: 'Mark read',
-                                        }),
-                                        markUnread: t('workspace.markUnread', {
-                                            defaultValue: 'Mark unread',
-                                        }),
-                                        star: t('workspace.star', { defaultValue: 'Star' }),
-                                        unstar: t('workspace.unstar', {
-                                            defaultValue: 'Remove star',
-                                        }),
-                                        collapseMessage: t('workspace.collapseMessage', {
-                                            defaultValue: 'Collapse message',
-                                        }),
-                                        expandMessage: t('workspace.expandMessage', {
-                                            defaultValue: 'Expand message',
-                                        }),
-                                    }, labels: {
-                                        attachmentCount: (count) => t('workspace.attachmentCount', {
-                                            count,
-                                            defaultValue: '{{count}} attachments',
-                                        }),
-                                        conversation: (count) => t('workspace.conversation', {
-                                            count,
-                                            defaultValue: '{{count}} messages in this conversation',
-                                        }),
-                                        loadMore: t('workspace.loadEarlier', {
-                                            defaultValue: 'Load earlier messages',
-                                        }),
-                                        noSubject: t('workspace.noSubject', {
-                                            defaultValue: '(no subject)',
-                                        }),
-                                        selectMessage: t('workspace.selectMessage', {
-                                            defaultValue: 'Select a message to read it.',
-                                        }),
-                                        unknownSender: t('workspace.unknownSender', {
-                                            defaultValue: 'Unknown sender',
-                                        }),
-                                        labels: t('workspace.labels', { defaultValue: 'Labels' }),
-                                        note: t('workspace.note', { defaultValue: 'Note' }),
-                                        notePlaceholder: t('workspace.notePlaceholder', {
-                                            defaultValue: 'Add a private note…',
-                                        }),
-                                        saveNote: t('workspace.saveNote', {
-                                            defaultValue: 'Save note',
-                                        }),
-                                        todo: t('workspace.todo', { defaultValue: 'To do' }),
-                                        more: t('workspace.more', { defaultValue: 'More actions' }),
-                                    }, loading: loadingConversation, messages: conversation, nextCursor: conversationCursor, onLoadMore: loadMoreConversation, subject: selected?.subject }) })] })), composerRequest ? (_jsx(MailWorkspaceComposer, { onSelectAccount: rememberComposeAccount, request: composerRequest, accounts: accounts, providers: providers, templateVariables: templateVariables, onClose: () => setComposerRequest(undefined), onComplete: (result, rejectedRecipients, operationError) => {
+                                                    starred: !message.starred,
+                                                })),
+                                                toggleTodo: (message) => mutateMessage(mail.updateMessage({
+                                                    accountId: message.accountId,
+                                                    messageId: message.id,
+                                                    todo: !message.todo,
+                                                })),
+                                                saveNote: (message, note) => mutateMessage(mail.updateMessage({
+                                                    accountId: message.accountId,
+                                                    messageId: message.id,
+                                                    note: note.trim() || null,
+                                                })),
+                                                toggleLabel: selectedMessageCanUseLabels
+                                                    ? (message, labelId, assigned) => mutateMessage(mail.updateMessageLabels({
+                                                        accountId: message.accountId,
+                                                        messageId: message.id,
+                                                        addLabelIds: assigned ? [labelId] : [],
+                                                        removeLabelIds: assigned ? [] : [labelId],
+                                                    }))
+                                                    : undefined,
+                                            }
+                                            : undefined, actionLabels: {
+                                            archive: t('workspace.archive', { defaultValue: 'Archive' }),
+                                            delete: selectedMessageInTrash
+                                                ? t('workspace.permanentlyDelete', {
+                                                    defaultValue: 'Permanently delete',
+                                                })
+                                                : t('workspace.delete', { defaultValue: 'Delete' }),
+                                            download: t('workspace.download', {
+                                                defaultValue: 'Download',
+                                            }),
+                                            reply: t('workspace.reply', { defaultValue: 'Reply' }),
+                                            forward: t('workspace.forward', { defaultValue: 'Forward' }),
+                                            editDraft: t('workspace.editDraft', {
+                                                defaultValue: 'Edit draft',
+                                            }),
+                                            markRead: t('workspace.markRead', {
+                                                defaultValue: 'Mark read',
+                                            }),
+                                            markUnread: t('workspace.markUnread', {
+                                                defaultValue: 'Mark unread',
+                                            }),
+                                            star: t('workspace.star', { defaultValue: 'Star' }),
+                                            unstar: t('workspace.unstar', {
+                                                defaultValue: 'Remove star',
+                                            }),
+                                            collapseMessage: t('workspace.collapseMessage', {
+                                                defaultValue: 'Collapse message',
+                                            }),
+                                            expandMessage: t('workspace.expandMessage', {
+                                                defaultValue: 'Expand message',
+                                            }),
+                                        }, labels: {
+                                            attachmentCount: (count) => t('workspace.attachmentCount', {
+                                                count,
+                                                defaultValue: '{{count}} attachments',
+                                            }),
+                                            conversation: (count) => t('workspace.conversation', {
+                                                count,
+                                                defaultValue: '{{count}} messages in this conversation',
+                                            }),
+                                            loadMore: t('workspace.loadEarlier', {
+                                                defaultValue: 'Load earlier messages',
+                                            }),
+                                            noSubject: t('workspace.noSubject', {
+                                                defaultValue: '(no subject)',
+                                            }),
+                                            selectMessage: t('workspace.selectMessage', {
+                                                defaultValue: 'Select a message to read it.',
+                                            }),
+                                            unknownSender: t('workspace.unknownSender', {
+                                                defaultValue: 'Unknown sender',
+                                            }),
+                                            labels: t('workspace.labels', { defaultValue: 'Labels' }),
+                                            note: t('workspace.note', { defaultValue: 'Note' }),
+                                            notePlaceholder: t('workspace.notePlaceholder', {
+                                                defaultValue: 'Add a private note…',
+                                            }),
+                                            saveNote: t('workspace.saveNote', {
+                                                defaultValue: 'Save note',
+                                            }),
+                                            todo: t('workspace.todo', { defaultValue: 'To do' }),
+                                            more: t('workspace.more', { defaultValue: 'More actions' }),
+                                        }, loading: loadingConversation, messages: conversation, nextCursor: conversationCursor, onLoadMore: loadMoreConversation, subject: selected?.subject })] })] })), _jsx(Sheet, { open: navigationOpen, onOpenChange: setNavigationOpen, children: _jsxs(SheetContent, { side: 'left', closeLabel: t('workspace.closeNavigation', {
+                                defaultValue: 'Close mailbox navigation',
+                            }), finalFocus: () => navigationButtonRef.current?.getClientRects().length
+                                ? navigationButtonRef.current
+                                : workspaceRef.current?.querySelector('input'), children: [_jsx(SheetHeader, { className: 'pr-14', children: _jsx(SheetTitle, { children: t('workspace.mailboxNavigation', {
+                                            defaultValue: 'Mailboxes and folders',
+                                        }) }) }), _jsx("div", { className: 'min-h-0 flex-1 overflow-y-auto', onClickCapture: (event) => {
+                                        // Current folders can return early inside the reused sidebar itself.
+                                        if (event.target instanceof Element &&
+                                            event.target.closest('button[aria-current="page"]'))
+                                            closeMailboxNavigation();
+                                    }, children: mailboxNavigation })] }) }), composerRequest ? (_jsx(MailWorkspaceComposer, { onSelectAccount: rememberComposeAccount, request: composerRequest, accounts: accounts, providers: providers, templateVariables: templateVariables, onClose: () => setComposerRequest(undefined), onComplete: (result, rejectedRecipients, operationError) => {
                             setReloadVersion((version) => version + 1);
                             const notice = result === 'partial'
                                 ? t('workspace.submissionPartial', {
@@ -813,9 +867,6 @@ function isMessageInTrash(message, foldersByAccountId) {
 function formatAddressList(addresses) {
     return addresses.map((address) => address.address).join(', ');
 }
-function replySubject(subject) {
-    return /^re:/iu.test(subject.trim()) ? subject : `Re: ${subject}`;
-}
 function forwardSubject(subject) {
     return /^fwd?:/iu.test(subject.trim()) ? subject : `Fwd: ${subject}`;
 }