"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const styles_1 = require("@mui/material/styles");
const api_services_1 = require("@selfcommunity/api-services");
const react_core_1 = require("@selfcommunity/react-core");
const types_1 = require("@selfcommunity/types");
const PrivateMessageThreadItem_1 = tslib_1.__importStar(require("../PrivateMessageThreadItem"));
const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
const react_intl_1 = require("react-intl");
const material_1 = require("@mui/material");
const PrivateMessageEditor_1 = tslib_1.__importDefault(require("../PrivateMessageEditor"));
const Autocomplete_1 = tslib_1.__importDefault(require("@mui/material/Autocomplete"));
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const system_1 = require("@mui/system");
const Icon_1 = tslib_1.__importDefault(require("@mui/material/Icon"));
const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
const Errors_1 = require("../../constants/Errors");
const utils_1 = require("@selfcommunity/utils");
const notistack_1 = require("notistack");
const ConfirmDialog_1 = tslib_1.__importDefault(require("../../shared/ConfirmDialog/ConfirmDialog"));
const InfiniteScroll_1 = tslib_1.__importDefault(require("../../shared/InfiniteScroll"));
const constants_1 = require("./constants");
const translMessages = (0, react_intl_1.defineMessages)({
    placeholder: {
        id: 'ui.privateMessage.thread.newMessage.autocomplete.placeholder',
        defaultMessage: 'ui.privateMessage.thread.newMessage.autocomplete.placeholder'
    },
    messageDeleted: {
        id: 'ui.privateMessage.thread.message.deleted',
        defaultMessage: 'ui.privateMessage.thread.message.deleted'
    }
});
const classes = {
    root: `${constants_1.PREFIX}-root`,
    subHeader: `${constants_1.PREFIX}-subheader`,
    section: `${constants_1.PREFIX}-section`,
    emptyMessage: `${constants_1.PREFIX}-empty-message`,
    newMessageHeader: `${constants_1.PREFIX}-new-message-header`,
    newMessageHeaderContent: `${constants_1.PREFIX}-new-message-header-content`,
    newMessageHeaderIcon: `${constants_1.PREFIX}-new-message-header-icon`,
    newMessageContent: `${constants_1.PREFIX}-new-message-content`,
    sender: `${constants_1.PREFIX}-sender`,
    receiver: `${constants_1.PREFIX}-receiver`,
    avatar: `${constants_1.PREFIX}-avatar`,
    item: `${constants_1.PREFIX}-item`,
    autocomplete: `${constants_1.PREFIX}-autocomplete`,
    autocompleteDialog: `${constants_1.PREFIX}-autocomplete-dialog`,
    editor: `${constants_1.PREFIX}-editor`
};
const Root = (0, styles_1.styled)(material_1.Card, {
    name: constants_1.PREFIX,
    slot: 'Root'
})(() => ({}));
/**
 * > API documentation for the Community-JS PrivateMessage Thread component. Learn about the available props and the CSS API.
 *
 *
 * This component renders the conversation between two users.
 * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/Thread)

 #### Import

 ```jsx
 import {PrivateMessageThread} from '@selfcommunity/react-ui';
 ```

 #### Component Name

 The name `SCPrivateMessageThread` can be used when providing style overrides in the theme.


 #### CSS

 |Rule Name|Global class|Description|
 |---|---|---|
 |root|.SCPrivateMessageThread-root|Styles applied to the root element.|
 |subHeader|.SCPrivateMessageThread-subheader|Styles applied to thread list subheader element.|
 |section|.SCPrivateMessageThread-section|Styles applied to the list section|
 |emptyMessage|.SCPrivateMessageThread-empty-message|Styles applied to the empty message element.|
 |newMessageHeader|.SCPrivateMessageThread-new-message-header|Styles applied to the new message header section.|
 |newMessageHeaderContent|.SCPrivateMessageThread-new-message-header-content|Styles applied to the new message header content.|
 |newMessageHeaderIcon|.SCPrivateMessageThread-new-message-header-icon|Styles applied to the new message header icon element.|
 |newMessageContent|.SCPrivateMessageThread-new-message-content|Styles applied to the new message content.|
 |sender|.SCPrivateMessageThread-sender|Styles applied to the sender element.|
 |receiver|.SCPrivateMessageThread-receiver|Styles applied to the receiver element.|
 |autocomplete|.SCPrivateMessageThread-autocomplete|Styles applied to autocomplete element.|
 |autocompleteDialog|.SCPrivateMessageThread-autocomplete-dialog|Styles applied to autocomplete dialog element.|
 |editor|.SCPrivateMessageThread-editor|Styles applied to the editor element.|

 * @param inProps
 */
function PrivateMessageThread(inProps) {
    // PROPS
    const props = (0, system_1.useThemeProps)({
        props: inProps,
        name: constants_1.PREFIX
    });
    const { threadObj, openNewMessage = false, onNewMessageClose = null, onNewMessageSent = null, onSingleMessageOpen = null, className, type } = props, rest = tslib_1.__rest(props, ["threadObj", "openNewMessage", "onNewMessageClose", "onNewMessageSent", "onSingleMessageOpen", "className", "type"]);
    // CONTEXT
    const scUserContext = (0, react_1.useContext)(react_core_1.SCUserContext);
    // STATE
    const [value, setValue] = (0, react_1.useState)('');
    const [previous, setPrevious] = (0, react_1.useState)(null);
    const [messageObjs, setMessageObjs] = (0, react_1.useState)([]);
    const [loadingMessageObjs, setLoadingMessageObjs] = (0, react_1.useState)(true);
    const [loading, setLoading] = (0, react_1.useState)(false);
    const [isHovered, setIsHovered] = (0, react_1.useState)({});
    const [followers, setFollowers] = (0, react_1.useState)([]);
    const isNew = threadObj && threadObj === types_1.SCPrivateMessageStatusType.NEW;
    const authUserId = scUserContext.user ? scUserContext.user.id : null;
    const [singleMessageUser, setSingleMessageUser] = (0, react_1.useState)(null);
    const [receiver, setReceiver] = (0, react_1.useState)(null);
    const [deletingMsg, setDeletingMsg] = (0, react_1.useState)(null);
    const [singleMessageThread, setSingleMessageThread] = (0, react_1.useState)(false);
    const [openDeleteMessageDialog, setOpenDeleteMessageDialog] = (0, react_1.useState)(false);
    const [recipients, setRecipients] = (0, react_1.useState)([]);
    const { enqueueSnackbar, closeSnackbar } = (0, notistack_1.useSnackbar)();
    const isNumber = typeof threadObj === 'number';
    const messageReceiver = (item, loggedUserId) => {
        var _a, _b, _c;
        return ((_a = item === null || item === void 0 ? void 0 : item.receiver) === null || _a === void 0 ? void 0 : _a.id) !== loggedUserId ? (_b = item === null || item === void 0 ? void 0 : item.receiver) === null || _b === void 0 ? void 0 : _b.id : (_c = item === null || item === void 0 ? void 0 : item.sender) === null || _c === void 0 ? void 0 : _c.id;
    };
    const [error, setError] = (0, react_1.useState)(false);
    // REFS
    const refreshSubscription = (0, react_1.useRef)(null);
    // INTL
    const intl = (0, react_intl_1.useIntl)();
    // HOOKS
    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
    // @ts-ignore
    const { scUser } = (0, react_core_1.useSCFetchUser)({ id: isNumber && threadObj, threadObj });
    const messagesEndRef = (0, react_1.useRef)(null);
    const scrollToBottom = () => {
        var _a;
        (_a = messagesEndRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ block: 'end', behavior: 'instant' });
    };
    // UTILS
    const format = (item) => intl.formatDate(item.created_at, {
        year: 'numeric',
        day: 'numeric',
        month: 'long'
    });
    // CONST
    const formattedMessages = (0, react_1.useMemo)(() => {
        const _messages = [...messageObjs];
        return (0, utils_1.groupBy)(_messages, format);
    }, [messageObjs]);
    // HANDLERS
    const handleMouseEnter = (index) => {
        setIsHovered((prevState) => {
            return Object.assign(Object.assign({}, prevState), { [index]: true });
        });
    };
    const handleMouseLeave = (index) => {
        setIsHovered((prevState) => {
            return Object.assign(Object.assign({}, prevState), { [index]: false });
        });
    };
    /**
     * Handles delete message dialog opening
     * @param msg
     */
    const handleOpenDeleteMessageDialog = (msg) => {
        setOpenDeleteMessageDialog(true);
        setDeletingMsg(msg);
    };
    /**
     * Handles delete message dialog close
     */
    const handleCloseDeleteMessageDialog = () => {
        setOpenDeleteMessageDialog(false);
    };
    /**
     * Memoized message recipients ids
     */
    const ids = (0, react_1.useMemo)(() => {
        if (recipients && openNewMessage) {
            return recipients.map((u) => {
                return parseInt(u.id, 10);
            });
        }
        return [recipients];
    }, [recipients]);
    function fetchResults() {
        setLoading(true);
        api_services_1.PrivateMessageService.searchUser(value)
            .then((data) => {
            setLoading(false);
            setFollowers(data.results.filter((user) => user.id !== authUserId));
        })
            .catch((error) => {
            setLoading(false);
            console.log(error);
        });
    }
    const handleInputChange = (event, value, reason) => {
        switch (reason) {
            case 'input':
                setValue(value);
                !value && setFollowers([]);
                break;
            case 'reset':
                setValue(value);
                break;
        }
    };
    const handleChange = (event, value, reason) => {
        event.preventDefault();
        event.stopPropagation();
        switch (reason) {
            case 'selectOption':
                handleClear(event);
                setRecipients(value);
                break;
            case 'removeOption':
                handleClear(event, value);
                break;
        }
        return false;
    };
    const handleClear = (event, value) => {
        setValue('');
        setFollowers([]);
        setRecipients(value !== null && value !== void 0 ? value : []);
    };
    const handleNewMessageClose = () => {
        handleClear();
        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
        // @ts-ignore
        onNewMessageClose && onNewMessageClose();
    };
    function updateAndDeleteURLParameters(url, paramToUpdate, newValue, paramToDelete) {
        const urlObj = new URL(url);
        urlObj.searchParams.set(paramToUpdate, newValue);
        urlObj.searchParams.delete(paramToDelete);
        return urlObj.toString();
    }
    const handlePrevious = (0, react_1.useMemo)(() => () => {
        if (!previous) {
            return;
        }
        return api_services_1.http
            .request({
            url: previous,
            method: api_services_1.Endpoints.GetAThread.method
        })
            .then((res) => {
            const _prev = [...messageObjs];
            _prev.unshift(...res.data.results);
            setMessageObjs(_prev);
            setPrevious(res.data.next && updateAndDeleteURLParameters(res.data.next, 'before_message', res.data.results[0].id, 'offset'));
        })
            .catch((error) => console.log(error));
    }, [previous, messageObjs]);
    /**
     * Fetches thread
     */
    function fetchThread() {
        if (threadObj && typeof threadObj !== 'string' && type !== types_1.SCPrivateMessageType.GROUP) {
            setLoadingMessageObjs(true);
            const _userObjId = isNumber ? threadObj : messageReceiver(threadObj, authUserId);
            api_services_1.PrivateMessageService.getAThread({ user: _userObjId, limit: 10 })
                .then((res) => {
                setMessageObjs(res.results);
                setPrevious(res.next && updateAndDeleteURLParameters(res.next, 'before_message', res.results[0].id, 'offset'));
                if (res.results.length) {
                    if (res.results[0].receiver.id !== authUserId) {
                        setReceiver(res.results[0].receiver);
                    }
                    else {
                        setReceiver(res.results[0].sender);
                    }
                    setSingleMessageThread(false);
                }
                else {
                    if (scUser === null || scUser === void 0 ? void 0 : scUser.can_send_pm_to) {
                        setSingleMessageThread(true);
                        setRecipients(_userObjId);
                        onSingleMessageOpen(true);
                        setSingleMessageUser(scUser);
                    }
                    else {
                        setSingleMessageThread(false);
                    }
                }
                setLoadingMessageObjs(false);
            })
                .catch((error) => {
                setLoadingMessageObjs(false);
                console.log(error);
                utils_1.Logger.error(Errors_1.SCOPE_SC_UI, { error });
            });
        }
        else if (type === types_1.SCPrivateMessageType.GROUP) {
            api_services_1.PrivateMessageService.getAThread({ group: isNumber ? threadObj : threadObj.group.id, limit: 10 })
                .then((res) => {
                setMessageObjs(res.results);
                setPrevious(res.next && updateAndDeleteURLParameters(res.next, 'before_message', res.results[0].id, 'offset'));
                setLoadingMessageObjs(false);
                setSingleMessageThread(false);
            })
                .catch((error) => {
                setLoadingMessageObjs(false);
                console.log(error);
                utils_1.Logger.error(Errors_1.SCOPE_SC_UI, { error });
            });
        }
    }
    const isNewerThan60Seconds = (creationTime) => {
        const date = new Date(creationTime);
        const now = new Date();
        return now.getTime() - date.getTime() < 60000;
    };
    function updateMessageAfterDeletion(id) {
        const newMessageObjects = [...messageObjs];
        const index = newMessageObjects.findIndex((s) => s.id === id);
        if (index !== -1) {
            newMessageObjects[index].message = `${intl.formatMessage(translMessages.messageDeleted)}`;
            newMessageObjects[index].file = null;
            newMessageObjects[index].status = types_1.SCPrivateMessageStatusType.HIDDEN;
            setMessageObjs(newMessageObjects);
        }
    }
    /**
     * Handles the deletion of a single message
     */
    function handleDeleteMessage() {
        const toHide = isNewerThan60Seconds(deletingMsg.created_at);
        api_services_1.PrivateMessageService.deleteAMessage(deletingMsg.id)
            .then(() => {
            const result = messageObjs.filter((m) => m.id !== deletingMsg.id);
            toHide ? setMessageObjs(result) : updateMessageAfterDeletion(deletingMsg.id);
            handleSnippetsUpdate((result.length >= 1 && toHide) || (!toHide && deletingMsg.id !== messageObjs.slice(-1)[0].id) ? result.slice(-1) : [deletingMsg]);
            handleCloseDeleteMessageDialog();
        })
            .catch((error) => {
            console.log(error);
            let _snackBar = enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.thread.error.delete.msg", defaultMessage: "ui.privateMessage.thread.error.delete.msg" }), {
                variant: 'error',
                SnackbarProps: {
                    onClick: () => {
                        closeSnackbar(_snackBar);
                    }
                }
            });
        });
    }
    /**
     * Updates snippets list when a new message(or more) are sent or another one is deleted
     * @param message, it can be a single object or an array of objects
     */
    function handleSnippetsUpdate(message) {
        pubsub_js_1.default.publish('snippetsChannel', message);
    }
    /**
     * Handles message sending
     * @param message
     * @param file
     */
    function handleSend(message, file) {
        if (react_core_1.UserUtils.isBlocked(scUserContext.user)) {
            enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.userBlocked", defaultMessage: "ui.common.userBlocked" }), {
                variant: 'warning',
                autoHideDuration: 3000
            });
        }
        else {
            api_services_1.http
                .request({
                url: api_services_1.Endpoints.SendMessage.url(),
                method: api_services_1.Endpoints.SendMessage.method,
                data: Object.assign(Object.assign({}, (type === types_1.SCPrivateMessageType.GROUP
                    ? { group: isNumber ? threadObj : threadObj.group.id }
                    : {
                        recipients: openNewMessage || isNew || singleMessageThread
                            ? ids
                            : [isNumber && threadObj ? threadObj : messageReceiver(threadObj, authUserId)]
                    })), { 
                    // recipients: openNewMessage || isNew || singleMessageThread ? ids : [isNumber && threadObj ? threadObj : messageReceiver(threadObj, authUserId)],
                    message: message, file_uuid: file && !message ? file : null })
            })
                .then((res) => {
                const isOne = res.data.length <= 1;
                isOne && setMessageObjs((prev) => [...prev, res.data[0]]);
                handleSnippetsUpdate(res.data);
                if (openNewMessage || singleMessageThread) {
                    setSingleMessageThread(false);
                    onSingleMessageOpen(false);
                    setRecipients([]);
                    onNewMessageSent(res.data[0], isOne);
                }
                scrollToBottom();
            })
                .catch((error) => {
                console.log(error);
                setError(true);
            });
        }
    }
    /**
     * Reset component state
     */
    const reset = (0, react_1.useCallback)(() => () => {
        setLoadingMessageObjs(true);
        setMessageObjs([]);
        setPrevious(null);
        setReceiver(null);
        setSingleMessageThread(false);
    }, [setLoadingMessageObjs, setMessageObjs, setPrevious, setReceiver, setSingleMessageThread]);
    // EFFECTS
    /**
     * If a value is entered in new message field, it fetches user followers
     */
    (0, react_1.useEffect)(() => {
        if (value) {
            fetchResults();
        }
    }, [value]);
    /**
     * On mount, if obj, fetches thread
     */
    (0, react_1.useEffect)(() => {
        if (!authUserId) {
            return;
        }
        if (threadObj) {
            fetchThread();
        }
        else {
            reset();
        }
    }, [threadObj, authUserId, scUser]);
    /**
     * Notification subscriber
     */
    const subscriber = (msg, data) => {
        const res = data.data;
        const newMessages = [...messageObjs];
        const index = newMessages.findIndex((m) => m.thread_id === res.thread_id);
        const _message = res.notification_obj.message;
        _message.receiver = res.notification_obj.snippet.receiver;
        _message.thread_status = res.notification_obj.snippet.thread_status;
        handleSnippetsUpdate([_message]);
        if (index !== -1) {
            setMessageObjs((prev) => [...prev, res.notification_obj.message]);
        }
        if (isNumber ? threadObj === res.thread_id : threadObj.id === res.thread_id) {
            scrollToBottom();
        }
    };
    /**
     * When a ws notification arrives, updates thread and snippets data
     */
    (0, react_1.useEffect)(() => {
        refreshSubscription.current = pubsub_js_1.default.subscribe(`${types_1.SCNotificationTopicType.INTERACTION}.${types_1.SCNotificationTypologyType.PRIVATE_MESSAGE}`, subscriber);
        return () => {
            pubsub_js_1.default.unsubscribe(refreshSubscription.current);
        };
    }, [messageObjs]);
    /**
     * Renders thread component
     * @return {JSX.Element}
     */
    function renderThread() {
        if (loadingMessageObjs) {
            return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
        }
        return ((0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ height: '100%', dataLength: messageObjs.length, previous: handlePrevious, inverse: true, hasMorePrevious: Boolean(previous), loaderPrevious: (0, jsx_runtime_1.jsx)(PrivateMessageThreadItem_1.PrivateMessageThreadItemSkeleton, {}) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ ref: messagesEndRef }, { children: Object.keys(formattedMessages).map((key) => ((0, jsx_runtime_1.jsx)("li", Object.assign({ className: classes.section }, { children: (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)(material_1.ListSubheader, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ align: "center", className: classes.subHeader }, { children: key })) }), formattedMessages[key].map((msg) => {
                                        var _a;
                                        return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.item }, { children: [msg.group && ((_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.username) !== msg.sender.username && ((0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: msg.sender.username, src: msg.sender.avatar, className: classes.avatar }) })), (0, jsx_runtime_1.jsx)(PrivateMessageThreadItem_1.default, { className: authUserId === msg.sender.id ? classes.sender : classes.receiver, message: msg, mouseEvents: {
                                                        onMouseEnter: () => handleMouseEnter(msg.id),
                                                        onMouseLeave: () => handleMouseLeave(msg.id)
                                                    }, isHovering: isHovered[msg.id], showMenuIcon: authUserId === msg.sender.id, onMenuIconClick: () => handleOpenDeleteMessageDialog(msg) }, msg.id)] }), msg.id));
                                    })] }) }), key))) })) })), (0, jsx_runtime_1.jsx)(PrivateMessageEditor_1.default, { className: classes.editor, send: handleSend, autoHide: type !== types_1.SCPrivateMessageType.GROUP && !(scUser === null || scUser === void 0 ? void 0 : scUser.can_send_pm_to), autoHideDeletion: type === types_1.SCPrivateMessageType.USER && ((receiver === null || receiver === void 0 ? void 0 : receiver.deleted) || (scUser === null || scUser === void 0 ? void 0 : scUser.deleted)), onThreadChangeId: isNumber ? threadObj : type === types_1.SCPrivateMessageType.USER ? threadObj.receiver.id : threadObj.group.id, error: error, onErrorRemove: () => setError(false) }), openDeleteMessageDialog && ((0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: openDeleteMessageDialog, title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.msg", defaultMessage: "ui.privateMessage.component.delete.message.dialog.msg" }), btnConfirm: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.component.delete.message.dialog.confirm", defaultMessage: "ui.privateMessage.component.delete.message.dialog.confirm" }), onConfirm: handleDeleteMessage, onClose: handleCloseDeleteMessageDialog }))] }));
    }
    /**
     * Renders empty box (when there is no thread open) or new message box
     * @return {JSX.Element}
     */
    function renderNewOrNoMessageBox() {
        return ((0, jsx_runtime_1.jsx)(material_1.CardContent, { children: isNew || singleMessageThread ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.newMessageHeader }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.newMessageHeaderContent }, { children: [(0, jsx_runtime_1.jsx)(Icon_1.default, Object.assign({ className: classes.newMessageHeaderIcon }, { children: "person" })), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.privateMessage.thread.newMessage.to", id: "ui.privateMessage.thread.newMessage.to" }) }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { className: classes.autocomplete, loading: loading, multiple: !singleMessageThread, limitTags: 3, freeSolo: true, disableClearable: true, options: followers, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, value: singleMessageThread ? singleMessageUser : recipients, getOptionLabel: (option) => (option ? option.username : '...'), isOptionEqualToValue: (option, value) => (option ? value.id === option.id : false), renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { placeholder: singleMessageThread ? '...' : `${intl.formatMessage(translMessages.placeholder)}`, variant: "standard", InputProps: Object.assign(Object.assign({}, params.InputProps), { disableUnderline: true }) }))), classes: { popper: classes.autocompleteDialog }, disabled: Boolean(singleMessageUser) })] })), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ size: "small", onClick: handleNewMessageClose }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.List, { className: classes.newMessageContent }), (0, jsx_runtime_1.jsx)(PrivateMessageEditor_1.default, { className: classes.editor, send: handleSend, autoHide: !followers, error: error, onErrorRemove: () => setError(false) })] })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.emptyMessage }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.privateMessage.thread.emptyBox.message", defaultMessage: "ui.privateMessage.thread.emptyBox.message" }) }))) }));
    }
    // Anonymous
    if (!authUserId) {
        return null;
    }
    /**
     * Renders the component
     */
    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({}, rest, { className: (0, classnames_1.default)(classes.root, className) }, { children: threadObj !== null && !isNew && !singleMessageThread ? renderThread() : renderNewOrNoMessageBox() })));
}
exports.default = PrivateMessageThread;
