@micha.bigler/ui-core-micha 2.15.0 → 2.16.0

package/dist/messaging/Composer.js

@@ -0,0 +1,120 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Alert, Button, Checkbox, Dialog, DialogActions, DialogContent, DialogTitle, FormControlLabel, IconButton, Stack, TextField, Typography } from '@mui/material';
+import AttachFileIcon from '@mui/icons-material/AttachFile';
+import CampaignOutlinedIcon from '@mui/icons-material/CampaignOutlined';
+import PollOutlinedIcon from '@mui/icons-material/PollOutlined';
+import { useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { extractApiErrorMessage, useMessaging } from './MessagingProvider';
+function newRequestId() { var _a, _b; return ((_b = (_a = globalThis.crypto) === null || _a === void 0 ? void 0 : _a.randomUUID) === null || _b === void 0 ? void 0 : _b.call(_a)) || `message-${Date.now()}-${Math.random().toString(36).slice(2)}`; }
+/**
+ * A provider-backed, independently mountable REST composer.
+ *
+ * `allowAnnouncement` and `linkTarget`: whether announcement composing (jg's
+ * `AnnouncementDialog` — title + body + a deep-link target) is offered here at
+ * all is a host decision (the server enforces who may actually post one; the
+ * client only offers the affordance). `linkTarget`'s VALUE is inherently
+ * app-specific navigation context (jg pre-fills it from the currently open
+ * event-info section) that ucm cannot compute itself, so the host supplies it.
+ */
+export function Composer({ conversationId, replyTarget = null, onReplyTargetChange, allowAnnouncement = false, linkTarget }) {
+    var _a;
+    const { t } = useTranslation();
+    const { sendMessage, sendAttachments, createConversationPoll } = useMessaging();
+    const [body, setBody] = useState('');
+    const [files, setFiles] = useState([]);
+    const [error, setError] = useState(null);
+    const [failed, setFailed] = useState(null);
+    const [sending, setSending] = useState(false);
+    const [pollOpen, setPollOpen] = useState(false);
+    const [pollQuestion, setPollQuestion] = useState('');
+    const [pollOptions, setPollOptions] = useState(['', '']);
+    const [allowMultiple, setAllowMultiple] = useState(false);
+    const [announcementOpen, setAnnouncementOpen] = useState(false);
+    const [announcementTitle, setAnnouncementTitle] = useState('');
+    const [announcementBody, setAnnouncementBody] = useState('');
+    const inputRef = useRef(null);
+    const submit = async (requestId = newRequestId(), retry = false) => {
+        if (!body.trim() && !files.length)
+            return;
+        setSending(true);
+        setError(null);
+        const payload = { kind: 'chat', body: body.trim() || undefined, reply_to: (replyTarget === null || replyTarget === void 0 ? void 0 : replyTarget.id) || undefined, client_request_id: requestId };
+        try {
+            if (files.length) {
+                const formData = new FormData();
+                files.forEach((file) => formData.append('files[]', file));
+                if (payload.body)
+                    formData.append('body', payload.body);
+                if (payload.reply_to)
+                    formData.append('reply_to', String(payload.reply_to));
+                formData.append('client_request_id', requestId);
+                await sendAttachments(conversationId, formData, { clientRequestId: requestId, retry, optimisticMessage: { body: payload.body, reply_to: payload.reply_to, attachments: files.map((file, index) => ({ id: `local-${requestId}-${index}`, filename: file.name, content_type: file.type })) } });
+            }
+            else
+                await sendMessage(conversationId, payload, { clientRequestId: requestId, retry });
+            setBody('');
+            setFiles([]);
+            setFailed(null);
+            onReplyTargetChange === null || onReplyTargetChange === void 0 ? void 0 : onReplyTargetChange(null);
+        }
+        catch (sendError) {
+            const message = extractApiErrorMessage(sendError);
+            setError(files.length ? t('MessagingComposer.UPLOAD_ERROR', { message }) : t('MessagingComposer.SEND_ERROR', { message }));
+            setFailed({ requestId, retry: true });
+        }
+        finally {
+            setSending(false);
+        }
+    };
+    const submitPoll = async () => {
+        const options = pollOptions.map((option) => option.trim()).filter(Boolean);
+        if (!pollQuestion.trim() || options.length < 2) {
+            setError(t('MessagingPoll.CREATE_VALIDATION'));
+            return;
+        }
+        setSending(true);
+        setError(null);
+        try {
+            await createConversationPoll(conversationId, { question: pollQuestion.trim(), options, allow_multiple: allowMultiple }, { clientRequestId: newRequestId() });
+            setPollQuestion('');
+            setPollOptions(['', '']);
+            setAllowMultiple(false);
+            setPollOpen(false);
+        }
+        catch (pollError) {
+            setError(t('MessagingPoll.CREATE_ERROR', { message: extractApiErrorMessage(pollError) }));
+        }
+        finally {
+            setSending(false);
+        }
+    };
+    const submitAnnouncement = async () => {
+        if (!announcementTitle.trim()) {
+            setError(t('MessagingAnnouncement.VALIDATION'));
+            return;
+        }
+        setSending(true);
+        setError(null);
+        const requestId = newRequestId();
+        try {
+            await sendMessage(conversationId, {
+                kind: 'announcement',
+                title: announcementTitle.trim(),
+                body: announcementBody.trim() || undefined,
+                link_target: linkTarget || undefined,
+                client_request_id: requestId,
+            }, { clientRequestId: requestId });
+            setAnnouncementTitle('');
+            setAnnouncementBody('');
+            setAnnouncementOpen(false);
+        }
+        catch (announcementError) {
+            setError(t('MessagingAnnouncement.ERROR', { message: extractApiErrorMessage(announcementError) }));
+        }
+        finally {
+            setSending(false);
+        }
+    };
+    return _jsxs(Stack, { component: "form", spacing: 1, onSubmit: (event) => { event.preventDefault(); submit(); }, "aria-label": t('MessagingComposer.LABEL'), children: [replyTarget && _jsx(Alert, { severity: "info", onClose: () => onReplyTargetChange === null || onReplyTargetChange === void 0 ? void 0 : onReplyTargetChange(null), children: t('MessagingComposer.REPLYING_TO', { sender: ((_a = replyTarget.sender) === null || _a === void 0 ? void 0 : _a.display_name) || t('MessagingThread.UNKNOWN_SENDER') }) }), error && _jsx(Alert, { severity: "error", role: "alert", children: error }), files.length > 0 && _jsx(Typography, { variant: "caption", children: t('MessagingComposer.FILES_SELECTED', { count: files.length }) }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "flex-end", children: [_jsx("input", { ref: inputRef, hidden: true, type: "file", multiple: true, onChange: (event) => setFiles(Array.from(event.target.files || [])) }), _jsx(IconButton, { type: "button", "aria-label": t('MessagingComposer.ADD_ATTACHMENT'), onClick: () => { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, children: _jsx(AttachFileIcon, {}) }), _jsx(IconButton, { type: "button", "aria-label": t('MessagingPoll.CREATE'), onClick: () => setPollOpen(true), children: _jsx(PollOutlinedIcon, {}) }), allowAnnouncement && _jsx(IconButton, { type: "button", "aria-label": t('MessagingAnnouncement.CREATE'), onClick: () => setAnnouncementOpen(true), children: _jsx(CampaignOutlinedIcon, {}) }), _jsx(TextField, { fullWidth: true, multiline: true, minRows: 2, value: body, onChange: (event) => setBody(event.target.value), label: t('MessagingComposer.MESSAGE'), disabled: sending }), _jsx(Button, { type: "submit", variant: "contained", disabled: sending || (!body.trim() && !files.length), children: t('MessagingComposer.SEND') })] }), failed && _jsx(Button, { type: "button", onClick: () => submit(failed.requestId, true), disabled: sending, children: t('MessagingComposer.RETRY') }), _jsxs(Dialog, { open: pollOpen, onClose: () => !sending && setPollOpen(false), fullWidth: true, maxWidth: "sm", children: [_jsx(DialogTitle, { children: t('MessagingPoll.CREATE') }), _jsx(DialogContent, { children: _jsxs(Stack, { spacing: 1, sx: { pt: 1 }, children: [_jsx(TextField, { label: t('MessagingPoll.QUESTION'), value: pollQuestion, onChange: (event) => setPollQuestion(event.target.value), autoFocus: true }), pollOptions.map((option, index) => _jsx(TextField, { label: t('MessagingPoll.OPTION', { count: index + 1 }), value: option, onChange: (event) => setPollOptions((current) => current.map((value, optionIndex) => optionIndex === index ? event.target.value : value)) }, index)), _jsx(Button, { type: "button", onClick: () => setPollOptions((current) => [...current, '']), children: t('MessagingPoll.ADD_OPTION') }), _jsx(FormControlLabel, { control: _jsx(Checkbox, { checked: allowMultiple, onChange: (event) => setAllowMultiple(event.target.checked) }), label: t('MessagingPoll.ALLOW_MULTIPLE') })] }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: () => setPollOpen(false), children: t('MessagingPoll.CANCEL') }), _jsx(Button, { variant: "contained", onClick: submitPoll, disabled: sending, children: t('MessagingPoll.CREATE') })] })] }), allowAnnouncement && _jsxs(Dialog, { open: announcementOpen, onClose: () => !sending && setAnnouncementOpen(false), fullWidth: true, maxWidth: "sm", children: [_jsx(DialogTitle, { children: t('MessagingAnnouncement.CREATE') }), _jsx(DialogContent, { children: _jsxs(Stack, { spacing: 1, sx: { pt: 1 }, children: [_jsx(TextField, { label: t('MessagingAnnouncement.TITLE'), value: announcementTitle, onChange: (event) => setAnnouncementTitle(event.target.value), autoFocus: true }), _jsx(TextField, { label: t('MessagingAnnouncement.BODY'), value: announcementBody, onChange: (event) => setAnnouncementBody(event.target.value), multiline: true, minRows: 2 })] }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: () => setAnnouncementOpen(false), children: t('MessagingAnnouncement.CANCEL') }), _jsx(Button, { variant: "contained", onClick: submitAnnouncement, disabled: sending, children: t('MessagingAnnouncement.SEND') })] })] })] });
+}

package/dist/messaging/ConversationLaunchers.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { Alert, Button, Stack } from '@mui/material';
+import { useTranslation } from 'react-i18next';
+import { useMessaging } from './MessagingProvider';
+/**
+ * Host apps provide launchable scopes. This component owns the REST transition
+ * that turns one into a normalized conversation, but deliberately does not
+ * discover groups itself: that is app-specific scope-picker data.
+ */
+export function ConversationLaunchers({ groupLaunchers = [], broadcastLauncher, autoOpenBroadcast = false, onOpen }) {
+    const { t } = useTranslation();
+    const { openGroupConversation, openBroadcastConversation } = useMessaging();
+    const [error, setError] = useState(null);
+    const autoOpened = useRef(false);
+    const open = async (kind, payload) => {
+        setError(null);
+        try {
+            const conversation = kind === 'broadcast'
+                ? await openBroadcastConversation(payload)
+                : await openGroupConversation(payload);
+            onOpen === null || onOpen === void 0 ? void 0 : onOpen(conversation);
+        }
+        catch (_a) {
+            setError(t('MessagingLaunchers.OPEN_ERROR'));
+        }
+    };
+    useEffect(() => {
+        var _a;
+        if (!autoOpenBroadcast || !broadcastLauncher || autoOpened.current)
+            return;
+        autoOpened.current = true;
+        open('broadcast', (_a = broadcastLauncher.payload) !== null && _a !== void 0 ? _a : broadcastLauncher);
+    }, [autoOpenBroadcast, broadcastLauncher]); // one intentional auto-open per mounted launcher
+    return (_jsxs(Stack, { spacing: 1, children: [broadcastLauncher && !autoOpenBroadcast && (_jsx(Button, { variant: "outlined", onClick: () => { var _a; return open('broadcast', (_a = broadcastLauncher.payload) !== null && _a !== void 0 ? _a : broadcastLauncher); }, children: broadcastLauncher.label || t('MessagingLaunchers.OPEN_BROADCAST') })), groupLaunchers.map((launcher) => {
+                var _a;
+                return (_jsx(Button, { variant: "outlined", onClick: () => { var _a; return open('group', (_a = launcher.payload) !== null && _a !== void 0 ? _a : launcher); }, children: launcher.label || t('MessagingLaunchers.OPEN_GROUP') }, (_a = launcher.id) !== null && _a !== void 0 ? _a : launcher.label));
+            }), error && _jsx(Alert, { severity: "error", children: error })] }));
+}

package/dist/messaging/ConversationList.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
+import { Archive, Campaign, Groups, MoreVert, NotificationsOff, Person } from '@mui/icons-material';
+import { Badge, Box, Button, CircularProgress, IconButton, List, ListItemButton, ListItemText, Menu, MenuItem, Stack, Typography } from '@mui/material';
+import { useTranslation } from 'react-i18next';
+import { useMessaging } from './MessagingProvider';
+import { ConversationLaunchers } from './ConversationLaunchers';
+function titleOf(conversation, t) { var _a, _b; return conversation.title || ((_a = conversation.other_user) === null || _a === void 0 ? void 0 : _a.display_name) || ((_b = conversation.other_user) === null || _b === void 0 ? void 0 : _b.username) || t('MessagingList.UNTITLED'); }
+function ordered(conversations) {
+    return [...conversations].sort((left, right) => new Date(right.last_message_at || 0) - new Date(left.last_message_at || 0));
+}
+// jg's ConversationList renders a distinct icon per conversation kind so a
+// user can identify type/person at a glance (getConversationAvatar); that
+// glanceable identification is a feature, not layout, so it's reproduced
+// here rather than left as a generic archive-status glyph.
+function KindIcon({ conversation }) {
+    if (conversation.kind === 'broadcast')
+        return _jsx(Campaign, { fontSize: "small" });
+    if (conversation.kind === 'group' || conversation.kind === 'managed' || conversation.kind === 'object_thread')
+        return _jsx(Groups, { fontSize: "small" });
+    return _jsx(Person, { fontSize: "small" });
+}
+/** A standalone, provider-backed list; scope picker metadata is supplied as launcher props. */
+export function ConversationList({ onOpen, groupLaunchers, broadcastLauncher, autoOpenBroadcast = false, includeArchived = false }) {
+    const { t } = useTranslation();
+    const { cache, activeConversationId, loadMoreConversations, setConversationArchived, setConversationPreferences } = useMessaging();
+    const [menuConversation, setMenuConversation] = useState(null);
+    const [menuAnchor, setMenuAnchor] = useState(null);
+    const [loadingMore, setLoadingMore] = useState(false);
+    const [error, setError] = useState(null);
+    const conversations = useMemo(() => ordered(Object.values(cache.conversations).filter((item) => includeArchived || !item.archived_at && !item.archived)), [cache.conversations, includeArchived]);
+    const unreadFor = (conversation) => { var _a, _b, _c; return (_c = (_a = conversation.unread_count) !== null && _a !== void 0 ? _a : (_b = cache.unread.by_conversation) === null || _b === void 0 ? void 0 : _b[conversation.id]) !== null && _c !== void 0 ? _c : 0; };
+    // Once opened, the broadcast conversation becomes a normal, recency-sorted
+    // row with real unread/preview state — hide the static launcher so it isn't
+    // shown twice (button + list row) with the button's stale, unread-less copy.
+    const broadcastAlreadyOpened = useMemo(() => Object.values(cache.conversations).some((item) => item.kind === 'broadcast'), [cache.conversations]);
+    const loadMore = async () => {
+        setLoadingMore(true);
+        setError(null);
+        try {
+            await loadMoreConversations();
+        }
+        catch (_a) {
+            setError(t('MessagingList.LOAD_ERROR'));
+        }
+        finally {
+            setLoadingMore(false);
+        }
+    };
+    const closeMenu = () => { setMenuConversation(null); setMenuAnchor(null); };
+    const archive = async () => {
+        try {
+            await setConversationArchived(menuConversation.id, true);
+        }
+        catch (_a) {
+            setError(t('MessagingList.ARCHIVE_ERROR'));
+        }
+        closeMenu();
+    };
+    const toggleMute = async () => {
+        try {
+            await setConversationPreferences(menuConversation.id, { muted: !menuConversation.muted });
+        }
+        catch (_a) {
+            setError(t('MessagingList.PREFERENCES_ERROR'));
+        }
+        closeMenu();
+    };
+    return (_jsxs(Stack, { spacing: 1, children: [_jsx(ConversationLaunchers, { groupLaunchers: groupLaunchers, broadcastLauncher: broadcastAlreadyOpened ? null : broadcastLauncher, autoOpenBroadcast: autoOpenBroadcast && !broadcastAlreadyOpened, onOpen: onOpen }), error && _jsx(Typography, { color: "error", role: "alert", children: error }), !conversations.length ? _jsx(Box, { sx: { py: 3, textAlign: 'center' }, children: _jsx(Typography, { color: "text.secondary", children: t('MessagingList.EMPTY') }) }) : (_jsx(List, { disablePadding: true, "aria-label": t('MessagingList.LABEL'), children: conversations.map((conversation) => {
+                    var _a;
+                    const unread = unreadFor(conversation);
+                    const archived = Boolean(conversation.archived || conversation.archived_at);
+                    return _jsxs(ListItemButton, { selected: conversation.id === activeConversationId, onClick: () => onOpen === null || onOpen === void 0 ? void 0 : onOpen(conversation), sx: { minHeight: 64, opacity: archived ? 0.6 : 1 }, children: [_jsx(Badge, { color: "error", badgeContent: unread || null, max: 99, sx: { mr: 2 }, children: archived ? _jsx(Archive, { fontSize: "small", color: "disabled" }) : _jsx(KindIcon, { conversation: conversation }) }), _jsx(ListItemText, { primary: titleOf(conversation, t), secondary: ((_a = conversation.last_message) === null || _a === void 0 ? void 0 : _a.body) || t('MessagingList.NO_MESSAGES'), primaryTypographyProps: { fontWeight: unread ? 700 : 400, noWrap: true }, secondaryTypographyProps: { noWrap: true } }), _jsx(IconButton, { "aria-label": t('MessagingList.ACTIONS'), onClick: (event) => { event.stopPropagation(); setMenuAnchor(event.currentTarget); setMenuConversation(conversation); }, children: _jsx(MoreVert, {}) })] }, conversation.id);
+                }) })), cache.cursors.conversations && _jsx(Button, { onClick: loadMore, disabled: loadingMore, children: loadingMore ? _jsx(CircularProgress, { size: 18 }) : t('MessagingList.LOAD_MORE') }), _jsxs(Menu, { anchorEl: menuAnchor, open: Boolean(menuConversation), onClose: closeMenu, children: [_jsxs(MenuItem, { onClick: toggleMute, children: [_jsx(NotificationsOff, { fontSize: "small", sx: { mr: 1 } }), (menuConversation === null || menuConversation === void 0 ? void 0 : menuConversation.muted) ? t('MessagingList.UNMUTE') : t('MessagingList.MUTE')] }), _jsxs(MenuItem, { onClick: archive, children: [_jsx(Archive, { fontSize: "small", sx: { mr: 1 } }), t('MessagingList.ARCHIVE')] })] })] }));
+}

package/dist/messaging/MessageBubble.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Paper, Stack, Typography } from '@mui/material';
+import { useTranslation } from 'react-i18next';
+import { AttachmentList } from './AttachmentList';
+import { ReactionBar } from './ReactionBar';
+import { PollCard } from './PollCard';
+function senderName(message) {
+    var _a, _b, _c;
+    return ((_a = message.sender) === null || _a === void 0 ? void 0 : _a.display_name) || ((_b = message.sender) === null || _b === void 0 ? void 0 : _b.username) || message.sender_name || ((_c = message.sender) === null || _c === void 0 ? void 0 : _c.name);
+}
+/** Provider-backed timeline collaborator; it deliberately has no mutation controls. */
+export function MessageBubble({ message, replyTo, onReply, children }) {
+    const { t } = useTranslation();
+    const deleted = Boolean(message.deleted_at);
+    const attachments = message.attachments || [];
+    return (_jsx(Paper, { component: "article", variant: "outlined", sx: { p: 1.25, maxWidth: 'min(100%, 680px)' }, "aria-label": t('MessagingThread.MESSAGE'), children: _jsxs(Stack, { spacing: 0.75, children: [replyTo && _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('MessagingThread.REPLY_TO', { sender: senderName(replyTo) || t('MessagingThread.UNKNOWN_SENDER') }) }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "baseline", children: [_jsx(Typography, { variant: "subtitle2", children: senderName(message) || t('MessagingThread.UNKNOWN_SENDER') }), message.created_at && _jsx(Typography, { variant: "caption", color: "text.secondary", children: new Date(message.created_at).toLocaleString() }), message.edited_at && !deleted && _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('MessagingThread.EDITED') })] }), !deleted && message.kind === 'announcement' && message.title && _jsx(Typography, { variant: "subtitle1", fontWeight: 700, children: message.title }), _jsx(Typography, { sx: { whiteSpace: 'pre-wrap' }, children: deleted ? t('MessagingThread.DELETED') : (message.kind === 'announcement' ? message.body : (message.body || message.title)) || '' }), !deleted && _jsxs(Stack, { spacing: 0.75, children: [attachments.length > 0 && _jsx(AttachmentList, { attachments: attachments }), _jsx(ReactionBar, { message: message }), message.poll && _jsx(PollCard, { message: message })] }), !deleted && onReply && _jsx(Button, { type: "button", size: "small", onClick: () => onReply(message), children: t('MessagingThread.REPLY') }), children] }) }));
+}

package/dist/messaging/MessagingProvider.js

@@ -0,0 +1,317 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useCallback, useContext, useEffect, useMemo, useReducer, useRef } from 'react';
+import { AuthContext } from '../auth/AuthContext';
+import { archiveConversation, createBroadcastConversation, createGroupConversation, getReadStatus, getUnreadCount, listConversations, listMessages, listThread, patchConversationPreferences, createMessage, uploadAttachments, getAttachment, getAttachmentThumbnail, addReaction, removeReaction, createPoll, votePoll, closePoll, getConversationConfig, patchConversationConfig, } from './api';
+import { useRealtime } from '../notifications/realtime';
+const MessagingContext = createContext(null);
+export const MESSAGING_ENVELOPE = 'messaging';
+const EMPTY_CACHE = { conversations: {}, messages: {}, threads: {}, polls: {}, reactions: {}, receipts: {}, unread: { unread_count: 0, by_conversation: {} }, cursors: { conversations: null, messages: {}, threads: {} } };
+const DEFAULT_API = {
+    listConversations, listMessages, listThread, getReadStatus, getUnreadCount, archiveConversation,
+    patchConversationPreferences, createGroupConversation, createBroadcastConversation,
+    createMessage, uploadAttachments, getAttachment, getAttachmentThumbnail,
+    addReaction, removeReaction, createPoll, votePoll, closePoll, getConversationConfig, patchConversationConfig,
+};
+function idOf(item) { var _a, _b, _c; return (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.id) !== null && _a !== void 0 ? _a : item === null || item === void 0 ? void 0 : item.conversation_id) !== null && _b !== void 0 ? _b : item === null || item === void 0 ? void 0 : item.message_id) !== null && _c !== void 0 ? _c : item === null || item === void 0 ? void 0 : item.poll_id; }
+function mergeById(slice, item) { const id = idOf(item); return id == null ? slice : Object.assign(Object.assign({}, slice), { [id]: Object.assign(Object.assign({}, slice[id]), item) }); }
+function resultsOf(response) { return (response === null || response === void 0 ? void 0 : response.results) || []; }
+function clientRequestIdOf(message) { return message === null || message === void 0 ? void 0 : message.client_request_id; }
+/**
+ * dcm's DRF validation errors aren't always {detail}: ConversationAttachmentView
+ * translates a rejected upload into a field-keyed {"files": [...]} body (the
+ * MSG-2 chunk-4 fix — see django-core-micha messaging/views.py), while other
+ * endpoints use {detail}. Check every shape a caller might actually receive
+ * before falling back to the generic axios error message.
+ */
+export function extractApiErrorMessage(error) {
+    var _a;
+    const data = (_a = error === null || error === void 0 ? void 0 : error.response) === null || _a === void 0 ? void 0 : _a.data;
+    if (typeof (data === null || data === void 0 ? void 0 : data.detail) === 'string')
+        return data.detail;
+    if (typeof (data === null || data === void 0 ? void 0 : data.message) === 'string')
+        return data.message;
+    if (Array.isArray(data === null || data === void 0 ? void 0 : data.files))
+        return data.files.join(' ');
+    if (data && typeof data === 'object') {
+        const firstArray = Object.values(data).find((value) => Array.isArray(value) && value.length);
+        if (firstArray)
+            return firstArray.join(' ');
+    }
+    return error === null || error === void 0 ? void 0 : error.message;
+}
+function reconcileMessage(messages, message) {
+    var _a, _b;
+    const requestId = clientRequestIdOf(message);
+    const matchingEntry = requestId && Object.entries(messages).find(([, item]) => clientRequestIdOf(item) === requestId);
+    if (!matchingEntry)
+        return mergeById(messages, message);
+    const [previousKey, previous] = matchingEntry;
+    const next = Object.assign({}, messages);
+    delete next[previousKey];
+    const id = (_a = idOf(message)) !== null && _a !== void 0 ? _a : previousKey;
+    next[id] = Object.assign(Object.assign(Object.assign({}, previous), message), { id: (_b = idOf(message)) !== null && _b !== void 0 ? _b : previous.id, status: message.status || 'sent', error: null });
+    return next;
+}
+export function messagingReducer(state, action) {
+    var _a, _b, _c;
+    switch (action.type) {
+        case 'conversationsLoaded': {
+            const conversations = action.results.reduce((next, item) => mergeById(next, item), state.conversations);
+            return Object.assign(Object.assign({}, state), { conversations, cursors: Object.assign(Object.assign({}, state.cursors), { conversations: (_a = action.nextCursor) !== null && _a !== void 0 ? _a : null }) });
+        }
+        case 'unreadLoaded': return Object.assign(Object.assign({}, state), { unread: action.unread || EMPTY_CACHE.unread });
+        case 'messagesLoaded': {
+            const messages = action.results.reduce((next, item) => mergeById(next, item), state.messages);
+            return Object.assign(Object.assign({}, state), { messages, cursors: Object.assign(Object.assign({}, state.cursors), { messages: Object.assign(Object.assign({}, state.cursors.messages), { [action.conversationId]: (_b = action.nextCursor) !== null && _b !== void 0 ? _b : null }) }) });
+        }
+        case 'threadLoaded': {
+            const messages = action.results.reduce((next, item) => mergeById(next, item), state.messages);
+            return Object.assign(Object.assign({}, state), { messages, cursors: Object.assign(Object.assign({}, state.cursors), { threads: Object.assign(Object.assign({}, state.cursors.threads), { [action.rootId]: (_c = action.nextCursor) !== null && _c !== void 0 ? _c : null }) }) });
+        }
+        case 'conversationUpsert': return Object.assign(Object.assign({}, state), { conversations: mergeById(state.conversations, action.conversation) });
+        case 'messageOptimistic': return Object.assign(Object.assign({}, state), { messages: mergeById(state.messages, action.message) });
+        case 'messageReconciled': return Object.assign(Object.assign({}, state), { messages: reconcileMessage(state.messages, action.message) });
+        case 'messageFailed': {
+            const matching = Object.entries(state.messages).find(([, item]) => clientRequestIdOf(item) === action.clientRequestId);
+            if (!matching)
+                return state;
+            const [key, message] = matching;
+            return Object.assign(Object.assign({}, state), { messages: Object.assign(Object.assign({}, state.messages), { [key]: Object.assign(Object.assign({}, message), { status: 'error', error: action.error }) }) });
+        }
+        case 'messagePatched': return Object.assign(Object.assign({}, state), { messages: mergeById(state.messages, action.message) });
+        case 'frame': return applyFrame(state, action.frame);
+        default: return state;
+    }
+}
+export function applyFrame(state, frame) {
+    var _a, _b, _c;
+    const payload = frame.message || frame.conversation || frame.participant || frame;
+    const conversationId = (_a = frame.conversation_id) !== null && _a !== void 0 ? _a : payload.conversation_id;
+    if (frame.type === 'message') {
+        const message = Object.assign(Object.assign({}, payload), { conversation_id: conversationId });
+        return Object.assign(Object.assign({}, state), { messages: reconcileMessage(state.messages, message) });
+    }
+    if (frame.type === 'message_edited')
+        return Object.assign(Object.assign({}, state), { messages: mergeById(state.messages, payload) });
+    if (frame.type === 'reaction') {
+        const messageId = (_b = frame.message_id) !== null && _b !== void 0 ? _b : payload.message_id;
+        const previous = state.messages[messageId] || { id: messageId };
+        return Object.assign(Object.assign({}, state), { messages: mergeById(state.messages, Object.assign(Object.assign({}, previous), { reactions: payload.reactions || frame.reactions || previous.reactions || [] })) });
+    }
+    if (frame.type === 'poll_updated') {
+        const messageId = (_c = frame.message_id) !== null && _c !== void 0 ? _c : payload.message_id;
+        const previous = state.messages[messageId] || { id: messageId };
+        const poll = payload.poll || frame.poll || payload;
+        return Object.assign(Object.assign({}, state), { messages: mergeById(state.messages, Object.assign(Object.assign({}, previous), { poll })), polls: mergeById(state.polls, poll) });
+    }
+    if (frame.type === 'message_deleted') {
+        const previous = state.messages[frame.message_id] || {};
+        return Object.assign(Object.assign({}, state), { messages: Object.assign(Object.assign({}, state.messages), { [frame.message_id]: Object.assign(Object.assign({}, previous), { id: frame.message_id, deleted_at: frame.deleted_at, deleted_by: frame.deleted_by, body: null, title: null, link_target: null }) }) });
+    }
+    if (frame.type === 'conversation_upsert')
+        return Object.assign(Object.assign({}, state), { conversations: mergeById(state.conversations, payload) });
+    // conversation_archived/participant_changed: the design doc names these frame
+    // types but doesn't pin their exact payload shape. Treating them as merging
+    // onto the conversation record (participant-local fields folded flat, an
+    // `archived` flag set) is this chunk's best-effort reading, not a confirmed
+    // contract — re-verify against dcm's actual WS payload once available, per
+    // the WO's "shape fixtures from the design doc, not from imagination" caution.
+    if (frame.type === 'conversation_archived')
+        return Object.assign(Object.assign({}, state), { conversations: mergeById(state.conversations, Object.assign(Object.assign({}, payload), { id: conversationId, archived: true })) });
+    if (frame.type === 'participant_changed')
+        return Object.assign(Object.assign({}, state), { conversations: mergeById(state.conversations, Object.assign(Object.assign({}, payload), { id: conversationId })) });
+    return state;
+}
+export function MessagingProvider({ children, filters = {}, activeConversationId = null, api = DEFAULT_API, active = true }) {
+    const { subscribe, onReconnect } = useRealtime();
+    const { user } = useContext(AuthContext) || {};
+    const [cache, dispatch] = useReducer(messagingReducer, EMPTY_CACHE);
+    const activeIdRef = useRef(activeConversationId);
+    const seenEventsRef = useRef(new Set());
+    const filtersRef = useRef(filters);
+    activeIdRef.current = activeConversationId;
+    filtersRef.current = filters;
+    const refreshConversations = useCallback(async () => {
+        const response = await api.listConversations(filtersRef.current);
+        dispatch({ type: 'conversationsLoaded', results: resultsOf(response), nextCursor: response === null || response === void 0 ? void 0 : response.next_cursor });
+        return response;
+    }, [api]);
+    const refreshUnread = useCallback(async () => {
+        const unread = await api.getUnreadCount();
+        dispatch({ type: 'unreadLoaded', unread });
+        return unread;
+    }, [api]);
+    const refreshThread = useCallback(async (conversationId = activeIdRef.current, { cursor } = {}) => {
+        if (conversationId == null)
+            return null;
+        const response = await api.listMessages(conversationId, ...(cursor ? [{ cursor }] : []));
+        dispatch({ type: 'messagesLoaded', conversationId, results: resultsOf(response), nextCursor: response === null || response === void 0 ? void 0 : response.next_cursor });
+        return response;
+    }, [api]);
+    const loadMoreMessages = useCallback((conversationId = activeIdRef.current) => {
+        const cursor = cache.cursors.messages[conversationId];
+        return cursor ? refreshThread(conversationId, { cursor }) : Promise.resolve(null);
+    }, [cache.cursors.messages, refreshThread]);
+    const loadThreadReplies = useCallback(async (rootId, { cursor } = {}) => {
+        const response = await api.listThread(rootId, { cursor });
+        dispatch({ type: 'threadLoaded', rootId, results: resultsOf(response), nextCursor: response === null || response === void 0 ? void 0 : response.next_cursor });
+        return response;
+    }, [api]);
+    const getMessageReadStatus = useCallback((messageId) => api.getReadStatus(messageId), [api]);
+    const loadMoreConversations = useCallback(async () => {
+        const cursor = cache.cursors.conversations;
+        if (!cursor)
+            return null;
+        const response = await api.listConversations(Object.assign(Object.assign({}, filtersRef.current), { cursor }));
+        dispatch({ type: 'conversationsLoaded', results: resultsOf(response), nextCursor: response === null || response === void 0 ? void 0 : response.next_cursor });
+        return response;
+    }, [api, cache.cursors.conversations]);
+    const updateConversation = useCallback((conversation) => {
+        dispatch({ type: 'conversationUpsert', conversation });
+        return conversation;
+    }, []);
+    const setConversationArchived = useCallback(async (conversationId, archived) => {
+        var _a;
+        const conversation = await api.archiveConversation(conversationId, archived);
+        return updateConversation(Object.assign(Object.assign({}, conversation), { id: (_a = conversation === null || conversation === void 0 ? void 0 : conversation.id) !== null && _a !== void 0 ? _a : conversationId, archived: Boolean(archived) }));
+    }, [api, updateConversation]);
+    const setConversationPreferences = useCallback(async (conversationId, patch) => {
+        var _a;
+        const conversation = await api.patchConversationPreferences(conversationId, patch);
+        return updateConversation(Object.assign(Object.assign(Object.assign({}, conversation), { id: (_a = conversation === null || conversation === void 0 ? void 0 : conversation.id) !== null && _a !== void 0 ? _a : conversationId }), patch));
+    }, [api, updateConversation]);
+    const openGroupConversation = useCallback(async (payload) => {
+        const conversation = await api.createGroupConversation(payload);
+        return updateConversation(conversation);
+    }, [api, updateConversation]);
+    const openBroadcastConversation = useCallback(async (payload) => {
+        const conversation = await api.createBroadcastConversation(payload);
+        return updateConversation(conversation);
+    }, [api, updateConversation]);
+    const sendMessage = useCallback(async (conversationId, payload, { clientRequestId, retry = false } = {}) => {
+        var _a, _b;
+        const requestId = clientRequestId || payload.client_request_id;
+        const optimistic = Object.assign({ id: `local-${requestId}`, conversation_id: conversationId, kind: payload.kind || 'chat', body: payload.body || '', title: payload.title || null, link_target: payload.link_target || null, reply_to: payload.reply_to || null, client_request_id: requestId, created_at: new Date().toISOString(), status: 'pending', sender: user ? { id: user.id, display_name: user.display_name || user.username } : undefined }, (retry ? {} : {}));
+        if (!retry)
+            dispatch({ type: 'messageOptimistic', message: optimistic });
+        else
+            dispatch({ type: 'messageReconciled', message: Object.assign(Object.assign({}, optimistic), { status: 'pending', error: null }) });
+        try {
+            const message = await api.createMessage(conversationId, Object.assign(Object.assign({}, payload), { client_request_id: requestId }), { idempotencyKey: requestId });
+            dispatch({ type: 'messageReconciled', message: Object.assign(Object.assign({}, message), { conversation_id: (_a = message === null || message === void 0 ? void 0 : message.conversation_id) !== null && _a !== void 0 ? _a : conversationId, client_request_id: (_b = message === null || message === void 0 ? void 0 : message.client_request_id) !== null && _b !== void 0 ? _b : requestId }) });
+            return message;
+        }
+        catch (error) {
+            dispatch({ type: 'messageFailed', clientRequestId: requestId, error: extractApiErrorMessage(error) });
+            throw error;
+        }
+    }, [api, user]);
+    const sendAttachments = useCallback(async (conversationId, formData, { clientRequestId, optimisticMessage, retry = false } = {}) => {
+        var _a, _b;
+        const optimistic = {
+            id: `local-${clientRequestId}`, conversation_id: conversationId, kind: 'chat', body: (optimisticMessage === null || optimisticMessage === void 0 ? void 0 : optimisticMessage.body) || '',
+            reply_to: (optimisticMessage === null || optimisticMessage === void 0 ? void 0 : optimisticMessage.reply_to) || null, client_request_id: clientRequestId, created_at: new Date().toISOString(), status: 'pending',
+            sender: user ? { id: user.id, display_name: user.display_name || user.username } : undefined,
+            attachments: (optimisticMessage === null || optimisticMessage === void 0 ? void 0 : optimisticMessage.attachments) || [],
+        };
+        if (!retry)
+            dispatch({ type: 'messageOptimistic', message: optimistic });
+        else
+            dispatch({ type: 'messageReconciled', message: Object.assign(Object.assign({}, optimistic), { status: 'pending', error: null }) });
+        try {
+            const message = await api.uploadAttachments(conversationId, formData, { idempotencyKey: clientRequestId });
+            dispatch({ type: 'messageReconciled', message: Object.assign(Object.assign({}, message), { conversation_id: (_a = message === null || message === void 0 ? void 0 : message.conversation_id) !== null && _a !== void 0 ? _a : conversationId, client_request_id: (_b = message === null || message === void 0 ? void 0 : message.client_request_id) !== null && _b !== void 0 ? _b : clientRequestId }) });
+            return message;
+        }
+        catch (error) {
+            dispatch({ type: 'messageFailed', clientRequestId, error: extractApiErrorMessage(error) });
+            throw error;
+        }
+    }, [api, user]);
+    const patchMessage = useCallback((message) => dispatch({ type: 'messagePatched', message }), []);
+    const toggleReaction = useCallback(async (messageId, emoji, active) => {
+        var _a;
+        const message = cache.messages[messageId] || { id: messageId };
+        const reactions = message.reactions || [];
+        const current = reactions.find((reaction) => reaction.emoji === emoji);
+        const nextReactions = active
+            ? reactions.map((reaction) => reaction.emoji === emoji ? Object.assign(Object.assign({}, reaction), { reacted: false, count: Math.max(0, (reaction.count || 1) - 1) }) : reaction).filter((reaction) => reaction.count !== 0)
+            : current
+                ? reactions.map((reaction) => reaction.emoji === emoji ? Object.assign(Object.assign({}, reaction), { reacted: true, count: (reaction.count || 0) + 1 }) : reaction)
+                : [...reactions, { emoji, count: 1, reacted: true }];
+        patchMessage(Object.assign(Object.assign({}, message), { reactions: nextReactions }));
+        try {
+            const result = active ? await api.removeReaction(messageId, emoji) : await api.addReaction(messageId, emoji);
+            patchMessage(Object.assign(Object.assign(Object.assign({}, message), ((result === null || result === void 0 ? void 0 : result.message) || result)), { reactions: (result === null || result === void 0 ? void 0 : result.reactions) || ((_a = result === null || result === void 0 ? void 0 : result.message) === null || _a === void 0 ? void 0 : _a.reactions) || nextReactions }));
+            return result;
+        }
+        catch (error) {
+            patchMessage(message);
+            throw error;
+        }
+    }, [api, cache.messages, patchMessage]);
+    const createConversationPoll = useCallback(async (conversationId, payload, { clientRequestId } = {}) => {
+        var _a;
+        const poll = await api.createPoll(conversationId, Object.assign(Object.assign({}, payload), { client_request_id: clientRequestId }), { idempotencyKey: clientRequestId });
+        const message = (poll === null || poll === void 0 ? void 0 : poll.message) || poll;
+        if ((message === null || message === void 0 ? void 0 : message.id) != null)
+            patchMessage(Object.assign(Object.assign({}, message), { conversation_id: (_a = message.conversation_id) !== null && _a !== void 0 ? _a : conversationId, poll: message.poll || poll.poll || poll }));
+        return poll;
+    }, [api, patchMessage]);
+    const castPollVote = useCallback(async (messageId, poll, optionIds) => {
+        const result = await api.votePoll(poll.id, optionIds);
+        const nextPoll = Object.assign(Object.assign({}, poll), ((result === null || result === void 0 ? void 0 : result.poll) || result));
+        patchMessage(Object.assign(Object.assign({}, (cache.messages[messageId] || { id: messageId })), { poll: nextPoll }));
+        return result;
+    }, [api, cache.messages, patchMessage]);
+    const closeConversationPoll = useCallback(async (messageId, poll) => {
+        var _a;
+        const result = await api.closePoll(poll.id);
+        const nextPoll = Object.assign(Object.assign(Object.assign({}, poll), ((result === null || result === void 0 ? void 0 : result.poll) || result)), { closed_at: ((_a = result === null || result === void 0 ? void 0 : result.poll) === null || _a === void 0 ? void 0 : _a.closed_at) || (result === null || result === void 0 ? void 0 : result.closed_at) || new Date().toISOString() });
+        patchMessage(Object.assign(Object.assign({}, (cache.messages[messageId] || { id: messageId })), { poll: nextPoll }));
+        return result;
+    }, [api, cache.messages, patchMessage]);
+    const loadConversationConfig = useCallback((conversationId) => api.getConversationConfig(conversationId), [api]);
+    const saveConversationConfig = useCallback((conversationId, patch) => api.patchConversationConfig(conversationId, patch), [api]);
+    const refresh = useCallback(async () => Promise.all([refreshConversations(), refreshUnread(), refreshThread()]), [refreshConversations, refreshThread, refreshUnread]);
+    // `/api/messaging/` is authenticated-only (design §REST). Host apps mount
+    // MessagingProvider inside NotificationsProvider, which itself renders its
+    // children regardless of auth state — so without this gate a provider
+    // mounted before login completes fires three REST calls that spuriously
+    // 401. Defaults to true (matches chunk 1's existing tests/harness usage,
+    // which don't pass it); a host app gates it with `active={authenticated}`.
+    useEffect(() => { if (active)
+        refresh().catch(() => { }); }, [active, refresh]);
+    useEffect(() => subscribe(MESSAGING_ENVELOPE, (frame) => {
+        if (frame.event_id && seenEventsRef.current.has(frame.event_id))
+            return;
+        if (frame.event_id) {
+            seenEventsRef.current.add(frame.event_id);
+            if (seenEventsRef.current.size > 500)
+                seenEventsRef.current.delete(seenEventsRef.current.values().next().value);
+        }
+        dispatch({ type: 'frame', frame });
+    }), [subscribe]);
+    useEffect(() => {
+        if (!active || !onReconnect)
+            return undefined;
+        return onReconnect(() => { refresh().catch(() => { }); });
+    }, [active, onReconnect, refresh]);
+    const value = useMemo(() => ({
+        cache, refresh, refreshConversations, refreshUnread, refreshThread, loadMoreMessages, loadThreadReplies, getMessageReadStatus, loadMoreConversations,
+        setConversationArchived, setConversationPreferences, openGroupConversation,
+        openBroadcastConversation, sendMessage, sendAttachments, toggleReaction, createConversationPoll, castPollVote, closeConversationPoll,
+        loadConversationConfig, saveConversationConfig, currentUser: user, getAttachment: api.getAttachment,
+        getAttachmentThumbnail: api.getAttachmentThumbnail, activeConversationId,
+    }), [cache, refresh, refreshConversations, refreshUnread, refreshThread, loadMoreMessages, loadThreadReplies, getMessageReadStatus, loadMoreConversations,
+        setConversationArchived, setConversationPreferences, openGroupConversation,
+        openBroadcastConversation, sendMessage, sendAttachments, toggleReaction, createConversationPoll, castPollVote, closeConversationPoll,
+        loadConversationConfig, saveConversationConfig, user, api.getAttachment, api.getAttachmentThumbnail, activeConversationId]);
+    return _jsx(MessagingContext.Provider, { value: value, children: children });
+}
+export function useMessaging() {
+    const context = useContext(MessagingContext);
+    if (!context)
+        throw new Error('useMessaging must be used within a MessagingProvider');
+    return context;
+}

package/dist/messaging/MessagingScopeConfig.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Alert, Box, CircularProgress, FormControl, FormControlLabel, InputLabel, MenuItem, Select, Stack, Switch, Typography } from '@mui/material';
+import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { extractApiErrorMessage, useMessaging } from './MessagingProvider';
+/** Provider-backed scope configuration surface; hosts choose its placement and capability gate. */
+export function MessagingScopeConfig({ conversationId }) {
+    const { t } = useTranslation();
+    const { loadConversationConfig, saveConversationConfig } = useMessaging();
+    const [config, setConfig] = useState(null);
+    const [error, setError] = useState(null);
+    const [saving, setSaving] = useState(false);
+    useEffect(() => { let live = true; loadConversationConfig(conversationId).then((value) => live && setConfig(value)).catch((loadError) => live && setError(t('MessagingConfig.LOAD_ERROR', { message: extractApiErrorMessage(loadError) }))); return () => { live = false; }; }, [conversationId, loadConversationConfig, t]);
+    const update = async (patch) => { setSaving(true); setError(null); try {
+        setConfig(await saveConversationConfig(conversationId, patch));
+    }
+    catch (saveError) {
+        setError(t('MessagingConfig.SAVE_ERROR', { message: extractApiErrorMessage(saveError) }));
+    }
+    finally {
+        setSaving(false);
+    } };
+    if (!config)
+        return error
+            ? _jsx(Alert, { severity: "error", role: "alert", children: error })
+            : _jsx(Box, { "aria-label": t('MessagingConfig.LOADING'), sx: { display: 'flex', justifyContent: 'center', py: 4 }, children: _jsx(CircularProgress, { size: 24 }) });
+    return _jsxs(Stack, { spacing: 1, "aria-label": t('MessagingConfig.LABEL'), children: [_jsx(Typography, { variant: "subtitle1", children: t('MessagingConfig.TITLE') }), error && _jsx(Alert, { severity: "error", role: "alert", children: error }), _jsxs(FormControl, { fullWidth: true, size: "small", disabled: saving, children: [_jsx(InputLabel, { children: t('MessagingConfig.DM_POLICY') }), _jsxs(Select, { label: t('MessagingConfig.DM_POLICY'), value: config.dm_policy || 'all', onChange: (event) => update({ dm_policy: event.target.value }), children: [_jsx(MenuItem, { value: "all", children: t('MessagingConfig.DM_ALL') }), _jsx(MenuItem, { value: "within_shared_groups", children: t('MessagingConfig.DM_SHARED') }), _jsx(MenuItem, { value: "team_only", children: t('MessagingConfig.DM_TEAM') })] })] }), _jsx(FormControlLabel, { control: _jsx(Switch, { checked: Boolean(config.group_chat_enabled), disabled: saving, onChange: (event) => update({ group_chat_enabled: event.target.checked }) }), label: t('MessagingConfig.GROUP_ENABLED') }), _jsx(FormControlLabel, { control: _jsx(Switch, { checked: Boolean(config.everyone_can_post), disabled: saving || !config.group_chat_enabled, onChange: (event) => update({ everyone_can_post: event.target.checked }) }), label: t('MessagingConfig.EVERYONE_POSTS') })] });
+}