@rapidmx/web-client 0.3.0 → 0.4.0

package/dist/apps/shared/search/searchTier2.js

@@ -0,0 +1,38 @@
+import { deriveLocalIndexKey } from "./localIndexKey.js";
+import { getLocalCoverage, initLocalIndex, searchLocal } from "./localIndexRpcClient.js";
+/** Ensures this mailbox's local index connection is open before it's queried - idempotent
+ * (`localIndexWorker.ts`'s own `init()` no-ops for an already-open mailbox), so callers never need to
+ * coordinate with `LocalIndexLifecycle.tsx`'s own unlock-triggered `init()` call; whichever runs first
+ * wins, and the other is a cheap no-op. */
+async function ensureInitialized(mailboxUid, unlocked) {
+    const indexKey = await deriveLocalIndexKey(unlocked.masterKey, mailboxUid);
+    await initLocalIndex({ mailboxUid, indexKey });
+}
+export async function searchLocalIndex(mailboxUid, parsed, unlocked, limit = 50, offset = 0) {
+    if (!unlocked) {
+        return { results: [], hasMore: false };
+    }
+    try {
+        await ensureInitialized(mailboxUid, unlocked);
+        const [page, coverage] = await Promise.all([searchLocal(mailboxUid, parsed, limit, offset), getLocalCoverage(mailboxUid)]);
+        const results = page.hits.map((hit) => ({
+            entityType: "message",
+            entityUid: hit.entityUid,
+            // Negated: bm25()'s own convention is "more negative is a better match" (SQLite), the
+            // opposite of every other score this codebase merges (Postgres ts_rank, OpenSearch _score,
+            // and normalizeServerScores() itself all treat "higher is better"). Negating here, once,
+            // keeps that convention uniform for the caller (apps/www/index.tsx's merge layer) - it never
+            // needs to know this tier's underlying scoring function works backwards from the others.
+            score: -hit.score,
+            snippet: hit.snippet,
+            source: "local",
+            metadataOnly: false,
+        }));
+        return { results, coverage, hasMore: page.hasMore };
+    }
+    catch {
+        // See this function's own doc comment - a broken local index degrades to "nothing to contribute
+        // this time," never a rejected search.
+        return { results: [], hasMore: false };
+    }
+}

package/dist/apps/www/calendar/index.js

@@ -8,7 +8,6 @@ import { DndContext, MouseSensor, TouchSensor, useSensor, useSensors } from "@dn
 import { HiOutlineBars3 } from "react-icons/hi2";
 import { addDays, addMonths, addWeeks, eachDayOfInterval, endOfDay, endOfMonth, endOfWeek, format, startOfDay, startOfMonth, startOfWeek, } from "date-fns";
 import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
-import { colorForFolder } from "@rapidmx/react-shared/calendar/calendarColors.js";
 import { listCalendarEvents } from "@rapidmx/react-shared/calendar/calendarApi.js";
 import { moveOccurrence, resizeOccurrenceEnd } from "@rapidmx/react-shared/calendar/calendarMutations.js";
 import { resolveDragAction } from "@rapidmx/react-shared/calendar/calendarDragIds.js";
@@ -30,10 +29,7 @@ export default function CalendarPage(props) {
 const VIEW_TYPES = ["month", "week", "workWeek", "day", "split"];
 const VIEW_LABELS = { month: "Month", week: "Week", workWeek: "Work Week", day: "Day", split: "Split" };
 function CalendarContent() {
-    const { mailboxUid, folderUid, calendarFolders, mailboxes, reloadFolders } = useCalendarShell();
-    // `CalendarShell` only ever renders this component once `mailboxUid` is set, and always to a value
-    // drawn from `mailboxes` itself (see its own resolution logic) — the lookup below always succeeds.
-    const organizerAddress = mailboxes.find((mb) => mb.uid === mailboxUid).primarySmtpAddress;
+    const { mailboxUid, folderUid, calendarFolders, mailboxCalendars, mailboxes, reloadFolders, colorFor } = useCalendarShell();
     // `PointerSensor` alone activates a drag on the very first touch-move, indistinguishable from a
     // scroll gesture on a touch device. `MouseSensor` (a small `distance` — desktop drags still start
     // immediately on a deliberate movement, no change from before) + `TouchSensor` (a `delay`+`tolerance`
@@ -65,7 +61,7 @@ function CalendarContent() {
         }
     }, []);
     const checkedFolderUids = checkedFolderUidsState ?? new Set(calendarFolders.map((f) => f.uid));
-    const folderColors = useMemo(() => Object.fromEntries(calendarFolders.map((f) => [f.uid, colorForFolder(f)])), [calendarFolders]);
+    const folderColors = useMemo(() => Object.fromEntries(calendarFolders.map((f) => [f.uid, colorFor(f)])), [calendarFolders, colorFor]);
     function toggleCalendar(toggledUid) {
         setCheckedFolderUidsState((prev) => {
             const next = new Set(prev ?? calendarFolders.map((f) => f.uid));
@@ -78,9 +74,8 @@ function CalendarContent() {
             return next;
         });
     }
-    async function handleAddCalendar(name, color) {
-        // `CalendarContent` only renders once `mailboxUid` is resolved — same invariant as `organizerAddress` above.
-        const created = await createFolder({ mailboxUid: mailboxUid, name, type: "calendar", color });
+    async function handleAddCalendar(targetMailboxUid, name, color) {
+        const created = await createFolder({ mailboxUid: targetMailboxUid, name, type: "calendar", color });
         setCheckedFolderUidsState((prev) => new Set([...(prev ?? calendarFolders.map((f) => f.uid)), created.uid]));
         reloadFolders();
     }
@@ -152,7 +147,7 @@ function CalendarContent() {
     const occurrences = useMemo(() => expandAllOccurrences(events, rangeStart, rangeEnd), [events, rangeStart, rangeEnd]);
     const splitColumns = useMemo(() => calendarFolders
         .filter((f) => checkedFolderUids.has(f.uid))
-        .map((f) => ({ folderUid: f.uid, name: f.name, color: colorForFolder(f) })), [calendarFolders, checkedFolderUidsKey]);
+        .map((f) => ({ folderUid: f.uid, name: f.name, color: colorFor(f) })), [calendarFolders, checkedFolderUidsKey, colorFor]);
     function shiftView(direction) {
         setViewDate((d) => view === "month"
             ? addMonths(d, direction)
@@ -217,12 +212,19 @@ function CalendarContent() {
         : view === "week" || view === "workWeek"
             ? `${format(rangeStart, "MMM d")} – ${format(rangeEnd, "MMM d, yyyy")}`
             : format(viewDate, "EEEE, MMMM d, yyyy");
-    const sidebarContent = (_jsxs(_Fragment, { children: [_jsx(MiniDatePicker, { selected: viewDate, onSelect: (date) => setViewDate(startOfDay(date)) }), _jsx(CalendarListSidebar, { calendars: calendarFolders, checkedFolderUids: checkedFolderUids, onToggle: toggleCalendar, onAddCalendar: handleAddCalendar })] }));
+    const modalFolderUid = modal ? (modal.targetFolderUid ?? modal.occurrence?.folderUid ?? folderUid) : undefined;
+    const modalMailboxUid = calendarFolders.find((f) => f.uid === modalFolderUid)?.mailboxUid ?? mailboxUid;
+    const modalMailbox = mailboxes.find((mb) => mb.uid === modalMailboxUid);
+    // Mailboxes a new event can be created in - only those with at least one calendar.
+    const mailboxOptions = useMemo(() => mailboxCalendars
+        .filter((mc) => mc.calendarFolders.length > 0)
+        .map((mc) => ({ mailbox: mc.mailbox, calendars: mc.calendarFolders.map((f) => ({ uid: f.uid, name: f.name })) })), [mailboxCalendars]);
+    const sidebarContent = (_jsxs(_Fragment, { children: [_jsx(MiniDatePicker, { selected: viewDate, onSelect: (date) => setViewDate(startOfDay(date)) }), _jsx(CalendarListSidebar, { mailboxCalendars: mailboxCalendars, checkedFolderUids: checkedFolderUids, onToggle: toggleCalendar, onAddCalendar: handleAddCalendar, colorFor: colorFor })] }));
     return (_jsxs("div", { className: "flex-1 flex min-h-0", children: [_jsx("div", { className: "hidden md:flex w-56 shrink-0 border-r border-border flex-col overflow-y-auto", children: sidebarContent }), _jsx(Drawer, { open: drawerOpen, onClose: () => setDrawerOpen(false), title: "Calendars", children: _jsx("div", { className: "flex flex-col", children: sidebarContent }) }), _jsxs("div", { className: "flex-1 flex flex-col min-h-0", children: [_jsxs("div", { className: "flex items-center gap-3 p-3 border-b border-border shrink-0", children: [_jsx("button", { type: "button", className: "md:hidden w-9 h-9 flex items-center justify-center rounded-sm text-text-muted hover:bg-surface-alt hover:text-text shrink-0", "aria-label": "Open calendars", onClick: () => setDrawerOpen(true), children: _jsx(HiOutlineBars3, { size: 20, "aria-hidden": "true" }) }), _jsx(Button, { type: "button", onClick: () => openNewEvent(), className: "!w-auto shrink-0", children: "+ New event" }), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("button", { type: "button", onClick: () => shiftView(-1), "aria-label": "Previous", className: "w-7 h-7 text-sm rounded-sm hover:bg-surface-alt", children: "\u2039" }), _jsx("button", { type: "button", onClick: goToday, className: "px-2 h-7 text-sm rounded-sm hover:bg-surface-alt", children: "Today" }), _jsx("button", { type: "button", onClick: () => shiftView(1), "aria-label": "Next", className: "w-7 h-7 text-sm rounded-sm hover:bg-surface-alt", children: "\u203A" })] }), _jsx("h1", { className: "hidden md:block text-lg font-bold tracking-tight", children: title }), _jsx("div", { className: "ml-auto flex gap-1 overflow-x-auto", children: VIEW_TYPES.map((v) => (_jsx("button", { type: "button", onClick: () => setView(v), className: [
                                         "px-3 h-7 text-sm rounded-sm whitespace-nowrap",
                                         view === v ? "bg-primary text-white" : "hover:bg-surface-alt",
                                         (v === "workWeek" || v === "split") && "hidden md:inline-block",
                                     ]
                                         .filter(Boolean)
-                                        .join(" "), children: VIEW_LABELS[v] }, v))) })] }), error && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: error }) })), actionError && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: actionError }) })), loading ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "Loading\u2026" })) : (_jsx(DndContext, { sensors: sensors, onDragEnd: handleDragEnd, children: view === "month" ? (_jsx(MonthView, { viewDate: viewDate, occurrences: occurrences, folderColors: folderColors, onSelectDay: handleSelectDay, onSelectEvent: openEvent })) : view === "split" ? (_jsx(SplitDayView, { day: viewDate, columns: splitColumns, occurrences: occurrences, onSelectEvent: openEvent, onSelectSlot: (start, end, targetFolderUid) => openNewEvent(start, end, targetFolderUid) })) : (_jsx(TimeGridView, { days: days, occurrences: occurrences, folderColors: folderColors, onSelectEvent: openEvent, onSelectSlot: openNewEvent })) })), modal && (_jsx(EventModal, { open: true, onClose: closeModal, mailboxUid: mailboxUid, folderUid: modal.targetFolderUid ?? modal.occurrence?.folderUid ?? folderUid, calendars: calendarFolders.map((f) => ({ uid: f.uid, name: f.name })), organizerAddress: organizerAddress, occurrence: modal.occurrence, initialStart: modal.initialStart, initialEnd: modal.initialEnd, onSaved: handleSaved, onDeleted: handleDeleted }))] })] }));
+                                        .join(" "), children: VIEW_LABELS[v] }, v))) })] }), error && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: error }) })), actionError && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: actionError }) })), loading ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "Loading\u2026" })) : (_jsx(DndContext, { sensors: sensors, onDragEnd: handleDragEnd, children: view === "month" ? (_jsx(MonthView, { viewDate: viewDate, occurrences: occurrences, folderColors: folderColors, onSelectDay: handleSelectDay, onSelectEvent: openEvent })) : view === "split" ? (_jsx(SplitDayView, { day: viewDate, columns: splitColumns, occurrences: occurrences, onSelectEvent: openEvent, onSelectSlot: (start, end, targetFolderUid) => openNewEvent(start, end, targetFolderUid) })) : (_jsx(TimeGridView, { days: days, occurrences: occurrences, folderColors: folderColors, onSelectEvent: openEvent, onSelectSlot: openNewEvent })) })), modal && modalMailbox && (_jsx(EventModal, { open: true, onClose: closeModal, mailboxUid: modalMailbox.uid, folderUid: modalFolderUid, calendars: calendarFolders.filter((f) => f.mailboxUid === modalMailbox.uid).map((f) => ({ uid: f.uid, name: f.name })), mailboxOptions: mailboxOptions, organizerAddress: modalMailbox.primarySmtpAddress, occurrence: modal.occurrence, initialStart: modal.initialStart, initialEnd: modal.initialEnd, onSaved: handleSaved, onDeleted: handleDeleted }))] })] }));
 }

package/dist/apps/www/contacts/index.js

@@ -33,7 +33,7 @@ function downloadTextFile(filename, content) {
     URL.revokeObjectURL(url);
 }
 function ContactsContent() {
-    const { folderUid, mailboxUid } = useContactsShell();
+    const { folderUid, mailboxUid, mailboxes } = useContactsShell();
     const { openCompose } = useCompose();
     const isMobile = useIsMobile();
     const [contacts, setContacts] = useState([]);
@@ -49,6 +49,8 @@ function ContactsContent() {
     const [checkedUids, setCheckedUids] = useState(new Set());
     const [selectedUid, setSelectedUid] = useState(null);
     const [mode, setMode] = useState("view");
+    // Set after a contact is created in a different mailbox than the one this list shows.
+    const [savedElsewhere, setSavedElsewhere] = useState(null);
     /** Returns a promise so bulk actions (below) can wait for the refreshed list before re-asserting their
      * own error message — this always clears `error` first (a legitimate reset for a fresh fetch attempt),
      * which would otherwise silently wipe out a bulk action's own just-set failure message before the user
@@ -156,8 +158,15 @@ function ContactsContent() {
         setMode("new");
     }
     function handleSaved(contact) {
-        setSelectedUid(contact.uid);
         setMode("view");
+        if (contact.mailboxUid !== mailboxUid) {
+            // Created in another mailbox (via the form's Mailbox selector) - it won't be in this list.
+            setSelectedUid(null);
+            setSavedElsewhere({ mailboxUid: contact.mailboxUid, displayName: contact.displayName });
+            return;
+        }
+        setSavedElsewhere(null);
+        setSelectedUid(contact.uid);
         void reload();
     }
     function handleCancel() {
@@ -198,9 +207,9 @@ function ContactsContent() {
     }
     function handleEmail() {
         const addresses = checkedContacts.map((c) => c.emails[0]?.address).filter((a) => Boolean(a));
-        // `ContactsShell` only ever renders this component once `mailboxUid` is resolved (see its own
-        // invariant comment) — same non-null pattern as `organizerAddress` in the calendar page.
-        openCompose({ mailboxUid: mailboxUid, to: addresses.join(", ") });
+        // No mailboxUid: a fresh message defaults to the caller's own mailbox, not whichever mailbox's
+        // contacts happen to be open - the compose window's From field can still change it.
+        openCompose({ to: addresses.join(", ") });
     }
     async function handleToggleFavorite() {
         const allFavorited = checkedContacts.every((c) => c.favorite);
@@ -258,5 +267,5 @@ function ContactsContent() {
     return (_jsxs("div", { className: "flex-1 flex min-h-0", children: [_jsx(ContactsSidebar, { mailboxUid: mailboxUid, contacts: contacts, active: view, onSelect: handleSelectView }), _jsxs("div", { className: [
                     "w-full md:w-96 shrink-0 md:border-r border-border md:flex flex-col min-h-0",
                     mode === "new" ? "hidden md:flex" : "flex",
-                ].join(" "), children: [_jsx(ContactsToolbar, { selectedCount: checkedContacts.length, allSelectedFavorited: checkedContacts.length > 0 && checkedContacts.every((c) => c.favorite), onNewContact: handleNew, onEdit: handleToolbarEdit, onDelete: handleBulkDelete, onEmail: handleEmail, onToggleFavorite: handleToggleFavorite, onAddCategory: handleAddCategory, onExportVCard: handleExportVCard, onImportFile: handleImportFile }), _jsx("div", { className: "p-3 border-b border-border", children: _jsx("input", { type: "search", value: query, onChange: (e) => setQuery(e.target.value), placeholder: "Search contacts", "aria-label": "Search contacts", className: INPUT_CLASS }) }), error && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: error }) })), deletedError && isDeletedView && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: deletedError }) })), (isDeletedView ? deletedLoading : loading) ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "Loading\u2026" })) : sorted.length === 0 ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "No contacts found." })) : (_jsx("div", { className: "flex-1 overflow-auto", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { children: _jsxs("tr", { className: "border-b border-border text-left", children: [!isDeletedView && (_jsx("th", { className: "w-8 px-3 py-2", children: _jsx("input", { type: "checkbox", "aria-label": "Select all contacts", checked: allChecked, onChange: toggleCheckAll }) })), _jsx("th", { className: "px-3 py-2", children: _jsxs("button", { type: "button", onClick: () => handleSort("name"), className: "text-xs font-bold uppercase tracking-wide text-text-muted", children: ["Name", sortColumn === "name" ? (sortDesc ? " ▾" : " ▴") : ""] }) }), _jsx("th", { className: "px-3 py-2", children: _jsxs("button", { type: "button", onClick: () => handleSort("info"), className: "text-xs font-bold uppercase tracking-wide text-text-muted", children: ["Contact info", sortColumn === "info" ? (sortDesc ? " ▾" : " ▴") : ""] }) })] }) }), _jsx("tbody", { children: sorted.map((contact) => (_jsxs("tr", { className: ["border-b border-border", contact.uid === selectedUid ? "bg-primary/10" : "hover:bg-surface-alt"].join(" "), children: [!isDeletedView && (_jsx("td", { className: "px-3 py-2", children: _jsx("input", { type: "checkbox", "aria-label": `Select ${contact.displayName}`, checked: checkedUids.has(contact.uid), onChange: () => toggleChecked(contact.uid) }) })), _jsx("td", { className: "px-3 py-2", children: _jsxs("button", { type: "button", onClick: () => handleSelectRow(contact), className: "flex items-center gap-2 text-left", children: [_jsx(ContactAvatar, { displayName: contact.displayName, size: 28 }), _jsxs("span", { className: "truncate font-medium", children: [contact.displayName, contact.favorite && _jsx("span", { "aria-label": "Favorite", children: " \u2605" })] })] }) }), _jsx("td", { className: "px-3 py-2 text-text-muted truncate", children: primaryInfo(contact) })] }, contact.uid))) })] }) }))] }), _jsx("div", { className: ["flex-1 min-w-0 overflow-y-auto p-6 md:block", mode === "new" ? "block" : "hidden"].join(" "), children: mode === "new" && mailboxUid && folderUid ? (_jsx(ContactForm, { mailboxUid: mailboxUid, folderUid: folderUid, onSaved: handleSaved, onCancel: handleCancel })) : mode === "edit" && selected ? (_jsx(ContactForm, { contact: selected, onSaved: handleSaved, onCancel: handleCancel })) : selected ? (_jsx(ContactDetailPane, { contact: selected, onEdit: () => setMode("edit"), onDelete: () => handleDelete(selected) })) : (_jsx("p", { className: "text-sm text-text-muted", children: "Select a contact, or create a new one." })) })] }));
+                ].join(" "), children: [_jsx(ContactsToolbar, { selectedCount: checkedContacts.length, allSelectedFavorited: checkedContacts.length > 0 && checkedContacts.every((c) => c.favorite), onNewContact: handleNew, onEdit: handleToolbarEdit, onDelete: handleBulkDelete, onEmail: handleEmail, onToggleFavorite: handleToggleFavorite, onAddCategory: handleAddCategory, onExportVCard: handleExportVCard, onImportFile: handleImportFile }), _jsx("div", { className: "p-3 border-b border-border", children: _jsx("input", { type: "search", value: query, onChange: (e) => setQuery(e.target.value), placeholder: "Search contacts", "aria-label": "Search contacts", className: INPUT_CLASS }) }), error && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: error }) })), deletedError && isDeletedView && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: deletedError }) })), (isDeletedView ? deletedLoading : loading) ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "Loading\u2026" })) : sorted.length === 0 ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "No contacts found." })) : (_jsx("div", { className: "flex-1 overflow-auto", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { children: _jsxs("tr", { className: "border-b border-border text-left", children: [!isDeletedView && (_jsx("th", { className: "w-8 px-3 py-2", children: _jsx("input", { type: "checkbox", "aria-label": "Select all contacts", checked: allChecked, onChange: toggleCheckAll }) })), _jsx("th", { className: "px-3 py-2", children: _jsxs("button", { type: "button", onClick: () => handleSort("name"), className: "text-xs font-bold uppercase tracking-wide text-text-muted", children: ["Name", sortColumn === "name" ? (sortDesc ? " ▾" : " ▴") : ""] }) }), _jsx("th", { className: "px-3 py-2", children: _jsxs("button", { type: "button", onClick: () => handleSort("info"), className: "text-xs font-bold uppercase tracking-wide text-text-muted", children: ["Contact info", sortColumn === "info" ? (sortDesc ? " ▾" : " ▴") : ""] }) })] }) }), _jsx("tbody", { children: sorted.map((contact) => (_jsxs("tr", { className: ["border-b border-border", contact.uid === selectedUid ? "bg-primary/10" : "hover:bg-surface-alt"].join(" "), children: [!isDeletedView && (_jsx("td", { className: "px-3 py-2", children: _jsx("input", { type: "checkbox", "aria-label": `Select ${contact.displayName}`, checked: checkedUids.has(contact.uid), onChange: () => toggleChecked(contact.uid) }) })), _jsx("td", { className: "px-3 py-2", children: _jsxs("button", { type: "button", onClick: () => handleSelectRow(contact), className: "flex items-center gap-2 text-left", children: [_jsx(ContactAvatar, { displayName: contact.displayName, size: 28 }), _jsxs("span", { className: "truncate font-medium", children: [contact.displayName, contact.favorite && _jsx("span", { "aria-label": "Favorite", children: " \u2605" })] })] }) }), _jsx("td", { className: "px-3 py-2 text-text-muted truncate", children: primaryInfo(contact) })] }, contact.uid))) })] }) }))] }), _jsxs("div", { className: ["flex-1 min-w-0 overflow-y-auto p-6 md:block", mode === "new" ? "block" : "hidden"].join(" "), children: [savedElsewhere && mode !== "new" && (_jsxs("p", { role: "status", className: "mb-4 text-sm py-2 px-3 rounded-sm bg-surface-alt text-text", children: [savedElsewhere.displayName, " was added to", " ", mailboxes.find((mb) => mb.uid === savedElsewhere.mailboxUid)?.displayName ?? "another mailbox", ".", " ", _jsx("a", { href: `/contacts?mailboxUid=${encodeURIComponent(savedElsewhere.mailboxUid)}`, className: "font-medium text-primary-dark hover:underline", children: "View that mailbox\u2019s contacts" })] })), mode === "new" && mailboxUid && folderUid ? (_jsx(ContactForm, { mailboxUid: mailboxUid, folderUid: folderUid, mailboxes: mailboxes, onSaved: handleSaved, onCancel: handleCancel })) : mode === "edit" && selected ? (_jsx(ContactForm, { contact: selected, onSaved: handleSaved, onCancel: handleCancel })) : selected ? (_jsx(ContactDetailPane, { contact: selected, onEdit: () => setMode("edit"), onDelete: () => handleDelete(selected) })) : (_jsx("p", { className: "text-sm text-text-muted", children: "Select a contact, or create a new one." }))] })] }));
 }