diff --git a/components/layout/mailbox-context-menu.tsx b/components/layout/mailbox-context-menu.tsx
index da5da81b..0f497d96 100644
--- a/components/layout/mailbox-context-menu.tsx
+++ b/components/layout/mailbox-context-menu.tsx
@@ -11,8 +11,10 @@ import {
} from "@/components/ui/context-menu";
import {
CheckCheck,
+ ChevronRight,
MailOpen,
Mails,
+ MoreHorizontal,
Trash2,
FolderPlus,
Pencil,
@@ -39,13 +41,32 @@ function truncateSegment(name: string): string {
: name;
}
-function shortenPath(fullPath: string): string {
- if (fullPath.length <= MAX_PATH_LENGTH) return fullPath;
+function renderPathSegments(segments: string[]): React.ReactNode {
+ return (
+
+ {segments.map((seg, i) => (
+
+ {i > 0 && }
+ {seg === "…" ? : {seg}}
+
+ ))}
+
+ );
+}
+
+function renderShortenedPath(fullPath: string): React.ReactNode {
const segments = fullPath.split(PATH_SEPARATOR);
- if (segments.length <= 2) return segments.map(truncateSegment).join(PATH_SEPARATOR);
- const first = truncateSegment(segments[0]);
- const last = truncateSegment(segments[segments.length - 1]);
- return `${first}${PATH_SEPARATOR}…${PATH_SEPARATOR}${last}`;
+ if (fullPath.length <= MAX_PATH_LENGTH) {
+ return renderPathSegments(segments);
+ }
+ if (segments.length <= 2) {
+ return renderPathSegments(segments.map(truncateSegment));
+ }
+ return renderPathSegments([
+ truncateSegment(segments[0]),
+ "…",
+ truncateSegment(segments[segments.length - 1]),
+ ]);
}
interface MailboxContextMenuProps {
@@ -130,12 +151,11 @@ export function MailboxContextMenu({
const canRemoveItems = mailbox.myRights?.mayRemoveItems !== false;
const fullPath = getMailboxPath(mailbox, mailboxes);
- const displayPath = shortenPath(fullPath);
return (
- {displayPath}
+ {renderShortenedPath(fullPath)}