@churchapps/apphelper 0.4.17 → 0.4.19

package/dist/components/index.js

@@ -8,6 +8,8 @@ export { ImageEditor } from "./ImageEditor";
 export { InputBox } from "./InputBox";
 export { Loading } from "./Loading";
 export { Notes } from "./notes/Notes";
+export { PageHeader } from "./PageHeader";
+export { PersonAvatar } from "./PersonAvatar";
 export { QuestionEdit } from "./QuestionEdit";
 export { SmallButton } from "./SmallButton";
 export { SupportModal } from "./SupportModal";

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}

package/dist/components/notes/AddNote.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AddNote.d.ts","sourceRoot":"","sources":["../../../src/components/notes/AddNote.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAoB,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAK5E,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,kBAAkB,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,oBAAoB,CAAA;CAC9B,CAAC;AAEF,wBAAgB,OAAO,CAAC,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,2CA6EnD"}
+{"version":3,"file":"AddNote.d.ts","sourceRoot":"","sources":["../../../src/components/notes/AddNote.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAoB,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAc5E,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,kBAAkB,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,oBAAoB,CAAA;CAC9B,CAAC;AAEF,wBAAgB,OAAO,CAAC,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,2CA0JnD"}

package/dist/components/notes/AddNote.js

@@ -1,10 +1,10 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useState, useEffect } from "react";
 import { ApiHelper, Locale, PersonHelper } from "../../helpers";
-import { Icon, Stack, TextField } from "@mui/material";
+import { Box, Stack, TextField, IconButton, Paper, CircularProgress, Avatar } from "@mui/material";
+import { Send as SendIcon, Delete as DeleteIcon } from "@mui/icons-material";
 import { ErrorMessages } from "../ErrorMessages";
-import { SmallButton } from "../SmallButton";
 export function AddNote({ context, ...props }) {
     const [message, setMessage] = useState();
     const [errors, setErrors] = React.useState([]);
@@ -12,7 +12,7 @@ export function AddNote({ context, ...props }) {
     const headerText = props.messageId ? "Edit note" : "Add a note";
     useEffect(() => {
         if (props.messageId)
-            ApiHelper.get(`/messages/${props.messageId}`, "MessagingApi").then(n => setMessage(n));
+            ApiHelper.get(`/messages/${props.messageId}`, "MessagingApi").then((n) => setMessage(n));
         else
             setMessage({ conversationId: props.conversationId, content: "" });
         return () => {
@@ -28,7 +28,7 @@ export function AddNote({ context, ...props }) {
     const validate = () => {
         const result = [];
         if (!message.content.trim())
-            result.push(Locale.label("notes.validate.content"));
+            result.push(Locale.label("notes.validate.content", "Please enter a message"));
         setErrors(result);
         return result.length === 0;
     };
@@ -48,8 +48,13 @@ export function AddNote({ context, ...props }) {
                 setMessage(m);
             })
                 .catch((error) => {
-                if (error?.message === "Forbidden")
+                console.error("Error saving message:", error);
+                if (error?.message === "Forbidden") {
                     setErrors(["You can't edit the message sent by others."]);
+                }
+                else {
+                    setErrors([error?.message || "Failed to save message. Please try again."]);
+                }
             })
                 .finally(() => { setIsSubmitting(false); });
         }
@@ -61,6 +66,39 @@ export function AddNote({ context, ...props }) {
     }
     const deleteFunction = props.messageId ? deleteNote : null;
     const image = PersonHelper.getPhotoUrl(context?.person);
-    return (_jsxs(_Fragment, { children: [_jsx(ErrorMessages, { errors: errors }), _jsxs(Stack, { direction: "row", spacing: 1.5, style: { marginTop: 15 }, justifyContent: "end", children: [image ? _jsx("img", { src: image, alt: "user", style: { width: 60, height: 45, borderRadius: 5, marginLeft: 8 } }) : _jsx(Icon, { children: "person" }), _jsxs(Stack, { direction: "column", spacing: 2, style: { width: "100%" }, justifyContent: "end", children: [_jsx("div", { children: _jsx("b", { children: context?.person?.name?.display }) }), _jsx(TextField, { fullWidth: true, name: "noteText", "aria-label": headerText, placeholder: "Add a note", multiline: true, style: { marginTop: 0, border: "none" }, variant: "standard", onChange: handleChange, value: message?.content })] }), _jsxs(Stack, { direction: "column", spacing: 1, justifyContent: "end", children: [_jsx(SmallButton, { icon: "send", onClick: handleSave }), deleteFunction && _jsx(SmallButton, { icon: "delete", onClick: deleteFunction, disabled: isSubmitting })] })] })] }));
+    return (_jsxs(Box, { sx: { width: '100%' }, children: [_jsx(ErrorMessages, { errors: errors }), _jsx(Paper, { variant: "outlined", sx: {
+                    p: 2,
+                    bgcolor: 'grey.50',
+                    borderColor: 'grey.300'
+                }, children: _jsxs(Stack, { direction: "row", spacing: 2, alignItems: "flex-start", children: [_jsx(Avatar, { src: image, alt: context?.person?.name?.display, sx: { width: 48, height: 48 } }), _jsxs(Box, { sx: { flex: 1 }, children: [_jsx(TextField, { fullWidth: true, multiline: true, rows: 2, name: "noteText", "aria-label": headerText, placeholder: props.messageId ? "Edit your message..." : "Type a message...", variant: "standard", value: message?.content || '', onChange: handleChange, disabled: isSubmitting, InputProps: {
+                                        disableUnderline: true,
+                                        sx: {
+                                            fontSize: '1rem',
+                                            '& textarea': {
+                                                resize: 'vertical',
+                                                minHeight: '40px'
+                                            }
+                                        }
+                                    }, sx: {
+                                        bgcolor: 'white',
+                                        borderRadius: 1,
+                                        p: 1,
+                                        border: '1px solid',
+                                        borderColor: 'grey.300',
+                                        '&:hover': {
+                                            borderColor: 'grey.400'
+                                        },
+                                        '&.Mui-focused': {
+                                            borderColor: 'primary.main'
+                                        }
+                                    } }), _jsxs(Box, { sx: { display: 'flex', justifyContent: 'flex-end', mt: 1, gap: 0.5 }, children: [deleteFunction && (_jsx(IconButton, { size: "small", onClick: deleteFunction, disabled: isSubmitting, sx: { color: 'error.main' }, children: _jsx(DeleteIcon, { fontSize: "small" }) })), _jsx(IconButton, { size: "small", color: "primary", onClick: handleSave, disabled: isSubmitting || !message?.content?.trim(), sx: {
+                                                bgcolor: 'primary.main',
+                                                color: 'white',
+                                                '&:hover': { bgcolor: 'primary.dark' },
+                                                '&:disabled': {
+                                                    bgcolor: 'action.disabledBackground',
+                                                    color: 'action.disabled'
+                                                }
+                                            }, children: isSubmitting ? _jsx(CircularProgress, { size: 18, color: "inherit" }) : _jsx(SendIcon, { fontSize: "small" }) })] })] })] }) })] }));
 }
 //# sourceMappingURL=AddNote.js.map

package/dist/components/notes/AddNote.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddNote.js","sourceRoot":"","sources":["../../../src/components/notes/AddNote.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"AddNote.js","sourceRoot":"","sources":["../../../src/components/notes/AddNote.tsx"],"names":[],"mappings":"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"}

package/dist/components/notes/Note.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Note.d.ts","sourceRoot":"","sources":["../../../src/components/notes/Note.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAE5E,UAAU,KAAK;IACb,OAAO,EAAE,gBAAgB,CAAC;IAC1B,YAAY,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,oBAAoB,CAAC;CAC/B;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAmChC,CAAC"}
+{"version":3,"file":"Note.d.ts","sourceRoot":"","sources":["../../../src/components/notes/Note.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAG5E,UAAU,KAAK;IACb,OAAO,EAAE,gBAAgB,CAAC;IAC1B,YAAY,EAAE,CAAC,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,oBAAoB,CAAC;CAC/B;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuDhC,CAAC"}

package/dist/components/notes/Note.js

@@ -1,17 +1,17 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Icon, IconButton, Stack, Box } from "@mui/material";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon, IconButton, Stack, Box, Typography } from "@mui/material";
 import { useState, useEffect } from "react";
-import { DateHelper, PersonHelper } from "../../helpers";
+import { DateHelper } from "../../helpers";
+import { PersonAvatar } from "../PersonAvatar";
 export const Note = (props) => {
     const [message, setMessage] = useState(null);
     useEffect(() => setMessage(props.message), [props.message]);
     if (message === null)
         return null;
-    const photoUrl = PersonHelper.getPhotoUrl(message.person);
     let datePosted = new Date(message.timeUpdated || message.timeSent);
     const displayDuration = DateHelper.getDisplayDuration(datePosted);
-    const isEdited = message.timeUpdated && message.timeUpdated !== message.timeSent && _jsx(_Fragment, { children: "(edited)" });
+    const isEdited = message.timeUpdated && message.timeUpdated !== message.timeSent;
     const contents = message.content?.split("\n");
-    return (_jsxs("div", { className: "note", children: [_jsx("div", { className: "postedBy", children: _jsx("img", { src: photoUrl, alt: "avatar" }) }), _jsx(Box, { sx: { width: "100%" }, className: "note-contents", children: _jsxs(Stack, { direction: "row", justifyContent: "space-between", children: [_jsxs("div", { children: [_jsx("b", { children: message.person?.name?.display }), " \u00B7 ", _jsxs("span", { className: "text-grey", children: [displayDuration, isEdited] }), contents.map((c, i) => c ? _jsx("p", { children: c }, i) : _jsx("br", {}))] }), _jsx("div", { children: (message?.id && message.personId === props.context?.person.id) && (_jsx(IconButton, { "aria-label": "editNote", onClick: () => props.showEditNote(message.id), children: _jsx(Icon, { style: { color: "#03a9f4" }, children: "edit" }) })) })] }) })] }));
+    return (_jsxs(Box, { sx: { display: 'flex', gap: 2, mb: 2, p: 1, '&:hover': { bgcolor: 'action.hover', borderRadius: 1 } }, children: [_jsx(PersonAvatar, { person: message.person, size: "small" }), _jsx(Box, { sx: { flex: 1 }, children: _jsxs(Stack, { direction: "row", justifyContent: "space-between", alignItems: "flex-start", children: [_jsxs(Box, { sx: { flex: 1 }, children: [_jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, sx: { mb: 0.5 }, children: [_jsx(Typography, { variant: "subtitle2", fontWeight: "bold", children: message.person?.name?.display }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: displayDuration }), isEdited && (_jsx(Typography, { variant: "caption", color: "text.secondary", children: "(edited)" }))] }), _jsx(Box, { children: contents.map((c, i) => c ? (_jsx(Typography, { variant: "body2", sx: { mb: 0.5 }, children: c }, i)) : (_jsx(Box, { sx: { height: '1em' } }, i))) })] }), (message?.id && message.personId === props.context?.person.id) && (_jsx(IconButton, { size: "small", "aria-label": "editNote", onClick: () => props.showEditNote(message.id), sx: { opacity: 0.7, '&:hover': { opacity: 1 } }, children: _jsx(Icon, { fontSize: "small", children: "edit" }) }))] }) })] }));
 };
 //# sourceMappingURL=Note.js.map

package/dist/components/notes/Note.js.map

@@ -1 +1 @@
-{"version":3,"file":"Note.js","sourceRoot":"","sources":["../../../src/components/notes/Note.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAc,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AASxD,MAAM,CAAC,MAAM,IAAI,GAAoB,CAAC,KAAK,EAAE,EAAE;IAC7C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAmB,IAAI,CAAC,CAAC;IAE/D,SAAS,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAE5D,IAAI,OAAO,KAAK,IAAI;QAAE,OAAO,IAAI,CAAC;IAClC,MAAM,QAAQ,GAAG,YAAY,CAAC,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IAC1D,IAAI,UAAU,GAAG,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,QAAQ,CAAC,CAAC;IACnE,MAAM,eAAe,GAAG,UAAU,CAAC,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAElE,MAAM,QAAQ,GAAG,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,WAAW,KAAK,OAAO,CAAC,QAAQ,IAAI,yCAAa,CAAC;IAClG,MAAM,QAAQ,GAAG,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;IAC9C,OAAO,CACL,eAAK,SAAS,EAAC,MAAM,aACnB,cAAK,SAAS,EAAC,UAAU,YACvB,cAAK,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAC,QAAQ,GAAG,GAC/B,EACN,KAAC,GAAG,IAAC,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,SAAS,EAAC,eAAe,YACnD,MAAC,KAAK,IAAC,SAAS,EAAC,KAAK,EAAC,cAAc,EAAC,eAAe,aACnD,0BACE,sBAAI,OAAO,CAAC,MAAM,EAAE,IAAI,EAAE,OAAO,GAAK,cAAG,gBAAM,SAAS,EAAC,WAAW,aAAE,eAAe,EAAE,QAAQ,IAAQ,EACtG,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,sBAAY,CAAC,IAAL,CAAC,CAAS,CAAC,CAAC,CAAC,cAAM,CAAC,IACpD,EACN,wBACG,CAAC,OAAO,EAAE,EAAE,IAAI,OAAO,CAAC,QAAQ,KAAK,KAAK,CAAC,OAAO,EAAE,MAAM,CAAC,EAAE,CAAC,IAAI,CACjE,KAAC,UAAU,kBAAY,UAAU,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,EAAE,CAAC,YAC7E,KAAC,IAAI,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,qBAAa,GACnC,CACd,GACG,IACA,GAEJ,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"Note.js","sourceRoot":"","sources":["../../../src/components/notes/Note.tsx"],"names":[],"mappings":"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"}

package/dist/components/notes/Notes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Notes.d.ts","sourceRoot":"","sources":["../../../src/components/notes/Notes.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAoB,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAE7E,UAAU,KAAK;IAEb,cAAc,EAAE,MAAM,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;IAC3C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,EAAE,oBAAoB,CAAC;IAC9B,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,KAAK,2CAmDjC"}
+{"version":3,"file":"Notes.d.ts","sourceRoot":"","sources":["../../../src/components/notes/Notes.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAoB,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAE7E,UAAU,KAAK;IAEb,cAAc,EAAE,MAAM,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;IAC3C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,EAAE,oBAAoB,CAAC;IAC9B,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,KAAK,2CA8LjC"}

package/dist/components/notes/Notes.js

@@ -7,17 +7,70 @@ import { ApiHelper, ArrayHelper, Locale } from "../../helpers";
 export function Notes(props) {
     const [messages, setMessages] = React.useState(null);
     const [editMessageId, setEditMessageId] = React.useState(null);
+    const [isInitialLoad, setIsInitialLoad] = React.useState(true);
+    const [previousMessageCount, setPreviousMessageCount] = React.useState(0);
+    // Add CSS for custom scrollbar styling
+    React.useEffect(() => {
+        const styleId = 'notes-scrollbar-styles';
+        if (!document.getElementById(styleId)) {
+            const style = document.createElement('style');
+            style.id = styleId;
+            style.textContent = `
+        .notes-scroll-container {
+          scrollbar-width: thin;
+          scrollbar-color: rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.1);
+        }
+        .notes-scroll-container::-webkit-scrollbar {
+          width: 12px;
+          background: transparent;
+        }
+        .notes-scroll-container::-webkit-scrollbar-track {
+          background: rgba(0, 0, 0, 0.1);
+          border-radius: 6px;
+          margin: 4px;
+        }
+        .notes-scroll-container::-webkit-scrollbar-thumb {
+          background: rgba(0, 0, 0, 0.3);
+          border-radius: 6px;
+          border: 2px solid transparent;
+          background-clip: content-box;
+        }
+        .notes-scroll-container::-webkit-scrollbar-thumb:hover {
+          background: rgba(0, 0, 0, 0.5);
+          background-clip: content-box;
+        }
+        .notes-scroll-container::-webkit-scrollbar-corner {
+          background: transparent;
+        }
+      `;
+            document.head.appendChild(style);
+        }
+    }, []);
     const loadNotes = async () => {
-        const messages = (props.conversationId) ? await ApiHelper.get("/messages/conversation/" + props.conversationId, "MessagingApi") : [];
-        if (messages.length > 0) {
-            const peopleIds = ArrayHelper.getIds(messages, "personId");
-            const people = await ApiHelper.get("/people/basic?ids=" + peopleIds.join(","), "MembershipApi");
-            messages.forEach(n => {
-                n.person = ArrayHelper.getOne(people, "id", n.personId);
-            });
+        try {
+            const messages = (props.conversationId) ? await ApiHelper.get("/messages/conversation/" + props.conversationId, "MessagingApi") : [];
+            if (messages.length > 0) {
+                const peopleIds = ArrayHelper.getIds(messages, "personId");
+                const people = await ApiHelper.get("/people/basic?ids=" + peopleIds.join(","), "MembershipApi");
+                messages.forEach(n => {
+                    n.person = ArrayHelper.getOne(people, "id", n.personId);
+                });
+            }
+            setMessages(messages);
+            setEditMessageId(null);
+            // Mark as no longer initial load after first load
+            if (isInitialLoad) {
+                setIsInitialLoad(false);
+            }
+        }
+        catch (error) {
+            console.error("❌ Failed to load messages for conversation:", props.conversationId, error);
+            // Don't clear messages on error - keep showing existing messages
+            // Only set isInitialLoad to false if this was the first load attempt
+            if (isInitialLoad) {
+                setIsInitialLoad(false);
+            }
         }
-        setMessages(messages);
-        setEditMessageId(null);
     };
     const getNotes = () => {
         if (!messages)
@@ -33,26 +86,73 @@ export function Notes(props) {
     };
     const getNotesWrapper = () => {
         const notes = getNotes();
-        if (props.maxHeight)
-            return _jsx("div", { id: "notesScroll", style: { maxHeight: props.maxHeight, overflowY: "scroll" }, children: notes });
+        if (props.maxHeight) {
+            return (_jsx("div", { id: "notesScroll", style: {
+                    flex: 1,
+                    minHeight: 0,
+                    overflowY: "auto",
+                    overflowX: "hidden",
+                    padding: "8px 12px",
+                    scrollBehavior: "smooth",
+                    height: "100%"
+                }, className: "notes-scroll-container", "data-testid": "message-scroll-area", children: _jsx("div", { style: {
+                        display: "flex",
+                        flexDirection: "column",
+                        gap: "8px",
+                        minHeight: "min-content"
+                    }, children: notes }) }));
+        }
         else
             return notes;
     };
     React.useEffect(() => { loadNotes(); }, [props.conversationId, props.refreshKey]); //eslint-disable-line
+    // Simply reload notes when refreshKey changes
+    // This is triggered by the parent component when WebSocket messages arrive
+    // Auto-scroll to bottom only when new messages are added (not on initial load)
     React.useEffect(() => {
-        if (props.maxHeight && messages?.length > 0) {
-            setTimeout(() => {
-                const element = window?.document?.getElementById("notesScroll");
-                if (element)
-                    element.scrollTop = element.scrollHeight;
-            }, 100);
+        if (props.maxHeight && messages?.length > 0 && !isInitialLoad) {
+            const currentMessageCount = messages.length;
+            // Only auto-scroll if messages were added
+            if (currentMessageCount > previousMessageCount) {
+                // Use requestAnimationFrame for smoother scrolling
+                requestAnimationFrame(() => {
+                    const element = window?.document?.getElementById("notesScroll");
+                    if (element) {
+                        element.scrollTop = element.scrollHeight;
+                    }
+                });
+            }
+            setPreviousMessageCount(currentMessageCount);
+        }
+        else if (messages?.length > 0 && isInitialLoad) {
+            // On initial load, just set the previous count without scrolling
+            setPreviousMessageCount(messages.length);
         }
-    }, [messages, props.maxHeight]);
-    let result = _jsxs(_Fragment, { children: [getNotesWrapper(), messages && (_jsx(AddNote, { context: props.context, conversationId: props.conversationId, onUpdate: loadNotes, createConversation: props.createConversation, messageId: editMessageId }))] });
+    }, [messages, props.maxHeight, isInitialLoad, previousMessageCount]);
+    let result = props.maxHeight ? (_jsxs("div", { style: {
+            height: "100%",
+            display: "flex",
+            flexDirection: "column",
+            overflow: "hidden",
+            minHeight: 0
+        }, children: [_jsx("div", { style: {
+                    flex: 1,
+                    minHeight: 0,
+                    display: "flex",
+                    flexDirection: "column",
+                    overflow: "hidden"
+                }, children: getNotesWrapper() }), messages && (_jsx("div", { style: {
+                    flexShrink: 0,
+                    borderTop: "1px solid #e0e0e0",
+                    backgroundColor: "#fafafa",
+                    padding: "12px",
+                    minHeight: "auto",
+                    maxHeight: "200px"
+                }, children: _jsx(AddNote, { context: props.context, conversationId: props.conversationId, onUpdate: loadNotes, createConversation: props.createConversation, messageId: editMessageId }) }))] })) : (_jsxs(_Fragment, { children: [getNotesWrapper(), messages && (_jsx(AddNote, { context: props.context, conversationId: props.conversationId, onUpdate: loadNotes, createConversation: props.createConversation, messageId: editMessageId }))] }));
     if (props.noDisplayBox)
         return result;
     else
-        return (_jsx(DisplayBox, { id: "notesBox", "data-testid": "notes-box", headerIcon: "sticky_note_2", headerText: Locale.label("notes.notes"), children: result }));
+        return (_jsx(DisplayBox, { id: "notesBox", "data-testid": "notes-box", headerIcon: "sticky_note_2", headerText: Locale.label("notes.notes", "Notes"), children: result }));
 }
 ;
 //# sourceMappingURL=Notes.js.map

package/dist/components/notes/Notes.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notes.js","sourceRoot":"","sources":["../../../src/components/notes/Notes.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Notes.js","sourceRoot":"","sources":["../../../src/components/notes/Notes.tsx"],"names":[],"mappings":"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"}

package/dist/components/wrapper/ChurchList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChurchList.d.ts","sourceRoot":"","sources":["../../../src/components/wrapper/ChurchList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,wBAAwB,EAAE,oBAAoB,EAAe,MAAM,qBAAqB,CAAC;AAMlG,MAAM,WAAW,KAAK;IAAG,YAAY,EAAE,wBAAwB,EAAE,CAAC;IAAC,iBAAiB,EAAE,wBAAwB,CAAC;IAAC,OAAO,EAAE,oBAAoB,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE;AAEtK,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAgCtC,CAAC"}
+{"version":3,"file":"ChurchList.d.ts","sourceRoot":"","sources":["../../../src/components/wrapper/ChurchList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,wBAAwB,EAAE,oBAAoB,EAAe,MAAM,qBAAqB,CAAC;AAMlG,MAAM,WAAW,KAAK;IAAG,YAAY,EAAE,wBAAwB,EAAE,CAAC;IAAC,iBAAiB,EAAE,wBAAwB,CAAC;IAAC,OAAO,EAAE,oBAAoB,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE;AAEtK,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwEtC,CAAC"}

package/dist/components/wrapper/ChurchList.js

@@ -1,16 +1,49 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from "react";
+import React, { useState } from "react";
 import { ArrayHelper } from "@churchapps/helpers";
-import { ApiHelper } from "../../helpers/ApiHelper";
+import { ApiHelper } from "@churchapps/helpers";
 import { UserHelper } from "../../helpers/UserHelper";
 import { NavItem } from "./NavItem";
 import { Locale } from "../../helpers";
 export const ChurchList = props => {
-    const [userChurches, setUserChurches] = useState(UserHelper.userChurches.filter(uc => uc.apis.length > 0));
+    const [userChurches, setUserChurches] = useState(() => {
+        try {
+            // Handle both array and single object cases
+            let churches = props.userChurches;
+            if (!Array.isArray(churches)) {
+                churches = churches ? [churches] : [];
+            }
+            return churches.filter(uc => uc && uc.apis && uc.apis.length > 0);
+        }
+        catch (error) {
+            console.error('Error filtering userChurches:', error);
+            return [];
+        }
+    });
+    // Update local state when props change
+    React.useEffect(() => {
+        try {
+            // Handle both array and single object cases
+            let churches = props.userChurches;
+            if (!Array.isArray(churches)) {
+                churches = churches ? [churches] : [];
+            }
+            setUserChurches(churches.filter(uc => uc && uc.apis && uc.apis.length > 0));
+        }
+        catch (error) {
+            console.error('Error updating userChurches:', error);
+            setUserChurches([]);
+        }
+    }, [props.userChurches]);
     const handleDelete = async (uc) => {
-        const label = Locale.label("wrapper.sureRemoveChurch").replace("{}", uc.church.name?.toUpperCase());
-        if (window.confirm(label)) {
+        // Helper function to get label with fallback
+        const getLabel = (key, fallback) => {
+            const label = Locale.label(key);
+            return label && label !== key ? label : fallback;
+        };
+        const confirmMessage = getLabel("wrapper.sureRemoveChurch", "Are you sure you wish to delete this church? You will no longer be a member of {}.").replace("{}", uc.church.name?.toUpperCase());
+        if (window.confirm(confirmMessage)) {
             await ApiHelper.delete(`/userchurch/record/${props.context.user.id}/${uc.church.id}/${uc.person.id}`, "MembershipApi");
             await ApiHelper.delete(`/rolemembers/self/${uc.church.id}/${props.context.user.id}`, "MembershipApi");
             // remove the same from userChurches
@@ -20,11 +53,16 @@ export const ChurchList = props => {
             props?.onDelete();
         }
     };
+    // Helper function to get label with fallback
+    const getLabel = (key, fallback) => {
+        const label = Locale.label(key);
+        return label && label !== key ? label : fallback;
+    };
     let result = [];
     userChurches.forEach(uc => {
         const userChurch = uc;
         const churchName = uc.church.name;
-        result.push(_jsx(NavItem, { selected: (uc.church.id === props.currentUserChurch.church.id) && true, onClick: () => UserHelper.selectChurch(props.context, userChurch.church.id, null), label: churchName || "Unknown", icon: "church", deleteIcon: uc.church.id !== props.currentUserChurch.church.id ? "delete" : null, deleteLabel: Locale.label("wrapper.deleteChurch"), deleteFunction: () => { handleDelete(uc); } }, userChurch.church.id));
+        result.push(_jsx(NavItem, { selected: (uc.church.id === props.currentUserChurch.church.id) && true, onClick: () => UserHelper.selectChurch(props.context, userChurch.church.id, null), label: churchName || "Unknown", icon: "church", deleteIcon: uc.church.id !== props.currentUserChurch.church.id ? "delete" : null, deleteLabel: getLabel("wrapper.deleteChurch", "Delete"), deleteFunction: () => { handleDelete(uc); } }, userChurch.church.id));
     });
     return _jsx(_Fragment, { children: result });
 };

package/dist/components/wrapper/ChurchList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChurchList.js","sourceRoot":"","sources":["../../../src/components/wrapper/ChurchList.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ChurchList.js","sourceRoot":"","sources":["../../../src/components/wrapper/ChurchList.tsx"],"names":[],"mappings":"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"}

package/dist/components/wrapper/NewPrivateMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NewPrivateMessage.d.ts","sourceRoot":"","sources":["../../../src/components/wrapper/NewPrivateMessage.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAyB,eAAe,EAAE,uBAAuB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAI5H,UAAU,KAAK;IACb,OAAO,EAAE,oBAAoB,CAAC;IAC9B,eAAe,EAAE,CAAC,EAAE,EAAE,uBAAuB,KAAK,IAAI,CAAA;IACtD,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,cAAc,CAAC,EAAE,eAAe,CAAA;CACjC;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAsG7C,CAAA"}
+{"version":3,"file":"NewPrivateMessage.d.ts","sourceRoot":"","sources":["../../../src/components/wrapper/NewPrivateMessage.tsx"],"names":[],"mappings":"AA2BA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAyB,eAAe,EAAE,uBAAuB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAI5H,UAAU,KAAK;IACb,OAAO,EAAE,oBAAoB,CAAC;IAC9B,eAAe,EAAE,CAAC,EAAE,EAAE,uBAAuB,KAAK,IAAI,CAAA;IACtD,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,cAAc,CAAC,EAAE,eAAe,CAAA;CACjC;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuN7C,CAAA"}

package/dist/components/wrapper/NewPrivateMessage.js

@@ -1,20 +1,15 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, TextField, TableRow, TableCell, Table, TableBody } from "@mui/material";
-import React, { useEffect } from "react";
-import { ApiHelper, Locale, PersonHelper } from "../../helpers";
+import { Button, TextField, Paper, Box, Typography, Stack, IconButton, List, ListItemAvatar, ListItemText, ListItemButton, InputAdornment, Divider, Skeleton, useTheme } from "@mui/material";
+import { ArrowBack as ArrowBackIcon, PersonSearch as PersonSearchIcon } from "@mui/icons-material";
+import React, { useEffect, useState } from "react";
+import { ApiHelper, Locale } from "../../helpers";
 import { AddNote } from "../notes/AddNote";
-import { SmallButton } from "../SmallButton";
+import { PersonAvatar } from "../PersonAvatar";
 export const NewPrivateMessage = (props) => {
     const [searchText, setSearchText] = React.useState("");
     const [searchResults, setSearchResults] = React.useState([]);
     const [selectedPerson, setSelectedPerson] = React.useState(null);
-    const handleSubmit = (e) => {
-        if (e !== null)
-            e.preventDefault();
-        let term = escape(searchText.trim());
-        ApiHelper.get("/people/search?term=" + term, "MembershipApi").then(data => setSearchResults(data));
-    };
     const handleChange = (e) => {
         setSearchText(e.currentTarget.value);
     };
@@ -38,19 +33,11 @@ export const NewPrivateMessage = (props) => {
         }
         setSelectedPerson(person);
     };
-    const getPeople = () => {
-        let result = [];
-        for (let i = 0; i < searchResults.length; i++) {
-            const p = searchResults[i];
-            result.push(_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("img", { src: PersonHelper.getPhotoUrl(p), alt: "avatar" }) }), _jsx(TableCell, { children: _jsx("a", { href: "about:blank", onClick: (e) => { e.preventDefault(); handlePersonSelected(p); }, children: p.name.display }) })] }, p.id));
-        }
-        return result;
-    };
     const handleNoteAdded = () => {
         handlePersonSelected(selectedPerson);
     };
     const createConversation = async () => {
-        const conv = { allowAnonymousPosts: false, contentType: "privateMessage", contentId: props.context.person.id, title: props.context.person.name.display + " " + Locale.label("wrapper.privateMessage"), visibility: "hidden" };
+        const conv = { allowAnonymousPosts: false, contentType: "privateMessage", contentId: props.context.person.id, title: props.context.person.name.display + " " + Locale.label("wrapper.privateMessage", "Private Message"), visibility: "hidden" };
         const result = await ApiHelper.post("/conversations", [conv], "MessagingApi");
         const pm = {
             fromPersonId: props.context.person.id,
@@ -64,10 +51,30 @@ export const NewPrivateMessage = (props) => {
         if (props.selectedPerson)
             handlePersonSelected(props.selectedPerson);
     }, [props.selectedPerson]);
+    const theme = useTheme();
+    const [isSearching, setIsSearching] = useState(false);
+    const handleSearchSubmit = async (e) => {
+        if (e !== null)
+            e.preventDefault();
+        if (!searchText.trim())
+            return;
+        setIsSearching(true);
+        let term = escape(searchText.trim());
+        const data = await ApiHelper.get("/people/search?term=" + term, "MembershipApi");
+        setSearchResults(data);
+        setIsSearching(false);
+    };
     if (!selectedPerson)
-        return (_jsxs("div", { style: { paddingLeft: 10, paddingRight: 10 }, children: [_jsx("span", { style: { float: "right" }, children: _jsx(SmallButton, { icon: "chevron_left", text: "Back", onClick: props.onBack }) }), _jsx("b", { children: Locale.label("wrapper.newPrivateMessage") }), _jsx("div", { children: Locale.label("wrapper.searchForPerson") }), _jsx(TextField, { fullWidth: true, label: "Name", id: "searchText", "data-testid": "search-input", name: "searchText", type: "text", placeholder: "Name", value: searchText, onChange: handleChange, onKeyDown: (e) => { e.stopPropagation(); }, InputProps: { endAdornment: _jsx(Button, { variant: "contained", id: "searchButton", "data-testid": "search-button", onClick: handleSubmit, children: Locale.label("common.search") }) } }), _jsx("br", {}), _jsx(Table, { id: "smallPeopleTable", size: "small", children: _jsx(TableBody, { children: getPeople() }) })] }));
+        return (_jsxs(Paper, { elevation: 0, sx: { height: '100%', display: 'flex', flexDirection: 'column' }, children: [_jsx(Box, { sx: { p: 2, borderBottom: 1, borderColor: 'divider' }, children: _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 2, children: [_jsx(IconButton, { onClick: props.onBack, children: _jsx(ArrowBackIcon, {}) }), _jsx(Typography, { variant: "h6", component: "h2", children: Locale.label("wrapper.newPrivateMessage", "New Private Message") })] }) }), _jsx(Box, { sx: { p: 3 }, children: _jsxs(Stack, { spacing: 3, children: [_jsxs(Box, { children: [_jsx(Typography, { variant: "body1", color: "textSecondary", gutterBottom: true, children: Locale.label("wrapper.searchForPerson", "Search for a person to message") }), _jsx(TextField, { fullWidth: true, placeholder: "Search by name...", id: "searchText", "data-testid": "search-input", value: searchText, onChange: handleChange, onKeyDown: (e) => {
+                                            e.stopPropagation();
+                                            if (e.key === 'Enter')
+                                                handleSearchSubmit(null);
+                                        }, InputProps: {
+                                            startAdornment: (_jsx(InputAdornment, { position: "start", children: _jsx(PersonSearchIcon, { color: "action" }) })),
+                                            endAdornment: (_jsx(InputAdornment, { position: "end", children: _jsx(Button, { variant: "contained", size: "small", onClick: handleSearchSubmit, disabled: !searchText.trim() || isSearching, children: Locale.label("common.search", "Search") }) }))
+                                        }, sx: { mt: 1 } })] }), isSearching && (_jsx(Box, { children: [...Array(3)].map((_, index) => (_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', mb: 2 }, children: [_jsx(Skeleton, { variant: "circular", width: 48, height: 48, sx: { mr: 2 } }), _jsx(Skeleton, { variant: "text", width: "60%", height: 24 })] }, index))) })), !isSearching && searchResults.length > 0 && (_jsxs(Box, { children: [_jsxs(Typography, { variant: "subtitle2", color: "textSecondary", gutterBottom: true, children: [searchResults.length, " ", searchResults.length === 1 ? 'person' : 'people', " found"] }), _jsx(List, { sx: { bgcolor: 'background.paper', borderRadius: 1 }, children: searchResults.map((person, index) => (_jsxs(React.Fragment, { children: [_jsxs(ListItemButton, { onClick: () => handlePersonSelected(person), sx: { py: 2 }, children: [_jsx(ListItemAvatar, { children: _jsx(PersonAvatar, { person: person, size: "small" }) }), _jsx(ListItemText, { primary: person.name.display, secondary: person.contactInfo?.email || '' })] }), index < searchResults.length - 1 && _jsx(Divider, {})] }, person.id))) })] })), !isSearching && searchText && searchResults.length === 0 && (_jsxs(Box, { sx: { textAlign: 'center', py: 4 }, children: [_jsx(PersonSearchIcon, { sx: { fontSize: 48, color: 'grey.400', mb: 2 } }), _jsx(Typography, { variant: "h6", color: "textSecondary", children: "No people found" }), _jsx(Typography, { variant: "body2", color: "textSecondary", children: "Try searching with a different name" })] }))] }) })] }));
     else {
-        return (_jsxs("div", { style: { paddingLeft: 10, paddingRight: 10 }, children: [_jsx("span", { style: { float: "right" }, children: _jsx(SmallButton, { icon: "chevron_left", text: "Back", onClick: props.onBack }) }), _jsx("b", { children: Locale.label("wrapper.newPrivateMessage") }), _jsxs("div", { children: ["To: ", selectedPerson.name.display] }), _jsx(AddNote, { context: props.context, conversationId: null, onUpdate: handleNoteAdded, createConversation: createConversation })] }));
+        return (_jsxs(Paper, { elevation: 0, sx: { height: '100%', display: 'flex', flexDirection: 'column' }, children: [_jsx(Box, { sx: { p: 2, borderBottom: 1, borderColor: 'divider' }, children: _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 2, children: [_jsx(IconButton, { onClick: props.onBack, children: _jsx(ArrowBackIcon, {}) }), _jsx(Typography, { variant: "h6", component: "h2", children: Locale.label("wrapper.newPrivateMessage", "New Private Message") })] }) }), _jsxs(Box, { sx: { p: 3 }, children: [_jsxs(Stack, { direction: "row", spacing: 2, alignItems: "center", sx: { mb: 3 }, children: [_jsx(PersonAvatar, { person: selectedPerson, size: "medium" }), _jsxs(Box, { children: [_jsx(Typography, { variant: "subtitle1", fontWeight: "medium", children: selectedPerson.name.display }), selectedPerson.contactInfo?.email && (_jsx(Typography, { variant: "body2", color: "textSecondary", children: selectedPerson.contactInfo.email }))] })] }), _jsx(Divider, { sx: { mb: 3 } }), _jsx(AddNote, { context: props.context, conversationId: null, onUpdate: handleNoteAdded, createConversation: createConversation })] })] }));
     }
 };
 //# sourceMappingURL=NewPrivateMessage.js.map