xmpp.chapril.org-conversejs/src/shared/modals/user-details.js
JC Brand fbe86e5af8 Create an ElementView base modal and use it for all modals
Modals are now all web components and are opened by component name.
2022-09-16 10:33:47 +02:00

78 lines
2.7 KiB
JavaScript

import BaseModal from "plugins/modal/modal.js";
import log from "@converse/headless/log";
import { tpl_user_details_modal, tpl_footer } from "./templates/user-details.js";
import { __ } from 'i18n';
import { api, converse } from "@converse/headless/core";
import { removeContact } from 'plugins/rosterview/utils.js';
const u = converse.env.utils;
export default class UserDetailsModal extends BaseModal {
initialize () {
super.initialize();
this.model.rosterContactAdded.then(() => this.registerContactEventHandlers());
this.listenTo(this.model, 'change', this.render);
this.registerContactEventHandlers();
/**
* Triggered once the UserDetailsModal has been initialized
* @event _converse#userDetailsModalInitialized
* @type { _converse.ChatBox }
* @example _converse.api.listen.on('userDetailsModalInitialized', (chatbox) => { ... });
*/
api.trigger('userDetailsModalInitialized', this.model);
}
renderModal () {
return tpl_user_details_modal(this);
}
renderModalFooter () {
return tpl_footer(this);
}
getModalTitle () {
return this.model.getDisplayName();
}
registerContactEventHandlers () {
if (this.model.contact !== undefined) {
this.listenTo(this.model.contact, 'change', this.render);
this.listenTo(this.model.contact.vcard, 'change', this.render);
this.model.contact.on('destroy', () => {
delete this.model.contact;
this.render();
});
}
}
async refreshContact (ev) {
if (ev && ev.preventDefault) { ev.preventDefault(); }
const refresh_icon = this.el.querySelector('.fa-refresh');
u.addClass('fa-spin', refresh_icon);
try {
await api.vcard.update(this.model.contact.vcard, true);
} catch (e) {
log.fatal(e);
this.alert(__('Sorry, something went wrong while trying to refresh'), 'danger');
}
u.removeClass('fa-spin', refresh_icon);
}
async removeContact (ev) {
ev?.preventDefault?.();
if (!api.settings.get('allow_contact_removal')) { return; }
const result = await api.confirm(__("Are you sure you want to remove this contact?"));
if (result) {
// XXX: The `dismissHandler` in bootstrap.native tries to
// reference the remove button after it's been cleared from
// the DOM, so we delay removing the contact to give it time.
setTimeout(() => removeContact(this.model.contact), 1);
this.modal.hide();
}
}
}
api.elements.define('converse-user-details-modal', UserDetailsModal);