NodeBB/NodeBB

'use strict';


define('forum/chats/manage', [
    'api', 'alerts', 'translator', 'autocomplete', 'forum/chats/user-list',
], function (api, alerts, translator, autocomplete, userList) {
    const manage = {};

    manage.init = function (roomId, buttonEl) {
        let modal;

        buttonEl.on('click', async function () {
            let groups = [];
            if (app.user.isAdmin) {
                ({ groups } = await api.get('/admin/groups'));
                groups.sort((a, b) => b.system - a.system).map((g) => {
                    const { name, displayName } = g;
                    return { name, displayName };
                });

                if (Array.isArray(ajaxify.data.groups)) {
                    groups.forEach((g) => {
                        g.selected = ajaxify.data.groups.includes(g.name);
                    });
                }
            }

            const html = await app.parseAndTranslate('modals/manage-room', {
                groups,
                user: app.user,
                room: ajaxify.data,
            });
            modal = bootbox.dialog({
                title: '[[modules:chat.manage-room]]',
                size: 'large',
                message: html,
                onEscape: true,
            });

            modal.attr('component', 'chat/manage-modal');

            refreshParticipantsList(roomId, modal);
            addKickHandler(roomId, modal);
            addToggleOwnerHandler(roomId, modal);

            const userListEl = modal.find('[component="chat/manage/user/list"]');
            const userListElSearch = modal.find('[component="chat/manage/user/list/search"]');
            userList.addSearchHandler(roomId, userListElSearch, async (data) => {
                if (userListElSearch.val()) {
                    userListEl.html(await app.parseAndTranslate('partials/chats/manage-room-users', data));
                } else {
                    refreshParticipantsList(roomId, modal);
                }
            });

            userList.addInfiniteScrollHandler(roomId, userListEl, async (listEl, data) => {
                listEl.append(await app.parseAndTranslate('partials/chats/manage-room-users', data));
            });

            const searchInput = modal.find('[component="chat/manage/user/add/search"]');
            const errorEl = modal.find('.text-danger');
            autocomplete.user(searchInput, function (event, selected) {
                errorEl.text('');
                api.post(`/chats/${roomId}/users`, {
                    uids: [selected.item.user.uid],
                }).then((body) => {
                    refreshParticipantsList(roomId, modal, body);
                    searchInput.val('');
                }).catch((err) => {
                    translator.translate(err.message, function (translated) {
                        errorEl.text(translated);
                    });
                });
            });

            modal.find('[component="chat/manage/save"]').on('click', () => {
                const notifSettingEl = modal.find('[component="chat/room/notification/setting"]');
                api.put(`/chats/${roomId}`, {
                    groups: modal.find('[component="chat/room/groups"]').val(),
                    notificationSetting: notifSettingEl.val(),
                }).then((payload) => {
                    ajaxify.data.groups = payload.groups;
                    ajaxify.data.notificationSetting = payload.notificationSetting;
                    const roomDefaultOption = payload.notificationOptions[0];
                    $('[component="chat/notification/setting"] [data-icon]').first().attr(
                        'data-icon', roomDefaultOption.icon
                    );
                    $('[component="chat/notification/setting/sub-label"]').translateText(
                        roomDefaultOption.subLabel
                    );
                    if (roomDefaultOption.selected) {
                        $('[component="chat/notification/setting/icon"]').attr(
                            'class', `fa ${roomDefaultOption.icon}`
                        );
                    }

                    modal.modal('hide');
                }).catch(alerts.error);
            });
        });
    };

    function addKickHandler(roomId, modal) {
        modal.on('click', '[data-action="kick"]', function () {
            const uid = parseInt(this.getAttribute('data-uid'), 10);

            api.del(`/chats/${roomId}/users/${uid}`, {}).then((body) => {
                refreshParticipantsList(roomId, modal, body);
            }).catch(alerts.error);
        });
    }

    function addToggleOwnerHandler(roomId, modal) {
        modal.on('click', '[data-action="toggleOwner"]', async function () {
            const uid = parseInt(this.getAttribute('data-uid'), 10);
            const iconEl = modal.get(0).querySelector(`[component="chat/manage/user/list"] > [data-uid="${uid}"] [component="chat/manage/user/owner/icon"]`);
            const current = !iconEl.classList.contains('hidden');

            await api[current ? 'del' : 'put'](`/chats/${roomId}/owners/${uid}`);
            iconEl.classList.toggle('hidden');
        });
    }

    async function refreshParticipantsList(roomId, modal, data) {
        const listEl = modal.find('[component="chat/manage/user/list"]');

        if (!data) {
            try {
                data = await api.get(`/chats/${roomId}/users`, {});
            } catch (err) {
                listEl.find('li').text(await translator.translate('[[error:invalid-data]]'));
            }
        }
        listEl.find('[data-bs-toggle="tooltip"]').tooltip('dispose');
        listEl.html(await app.parseAndTranslate('partials/chats/manage-room-users', data));
        listEl.find('[data-bs-toggle="tooltip"]').tooltip();
    }

    return manage;
});