2021-08-09 15:53:50 +02:00
|
|
|
import { __ } from 'i18n/index.js';
|
|
|
|
import { api } from '@converse/headless/core';
|
|
|
|
import { getOOBURLMarkup } from 'utils/html.js';
|
|
|
|
import { html } from 'lit';
|
|
|
|
|
|
|
|
const tpl_edited_icon = (el) => {
|
|
|
|
const i18n_edited = __('This message has been edited');
|
|
|
|
return html`<converse-icon title="${ i18n_edited }" class="fa fa-edit chat-msg__edit-modal" @click=${el.showMessageVersionsModal} size="1em"></converse-icon>`;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
export default (el) => {
|
|
|
|
const i18n_show = __('Show more');
|
|
|
|
const is_groupchat_message = (el.model.get('type') === 'groupchat');
|
|
|
|
const i18n_show_less = __('Show less');
|
|
|
|
|
|
|
|
const tpl_spoiler_hint = html`
|
|
|
|
<div class="chat-msg__spoiler-hint">
|
|
|
|
<span class="spoiler-hint">${el.model.get('spoiler_hint')}</span>
|
|
|
|
<a class="badge badge-info spoiler-toggle" href="#" @click=${el.toggleSpoilerMessage}>
|
|
|
|
<i class="fa ${el.model.get('is_spoiler_visible') ? 'fa-eye-slash' : 'fa-eye'}"></i>
|
|
|
|
${ el.model.get('is_spoiler_visible') ? i18n_show_less : i18n_show }
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
`;
|
|
|
|
const spoiler_classes = el.model.get('is_spoiler') ? `spoiler ${el.model.get('is_spoiler_visible') ? '' : 'hidden'}` : '';
|
|
|
|
const text = el.model.getMessageText();
|
2021-08-31 15:19:26 +02:00
|
|
|
const show_oob = el.model.get('oob_url') && text !== el.model.get('oob_url');
|
2021-08-09 15:53:50 +02:00
|
|
|
return html`
|
|
|
|
${ el.model.get('is_spoiler') ? tpl_spoiler_hint : '' }
|
|
|
|
${ el.model.get('subject') ? html`<div class="chat-msg__subject">${el.model.get('subject')}</div>` : '' }
|
|
|
|
<span>
|
|
|
|
<converse-chat-message-body
|
|
|
|
class="chat-msg__text ${el.model.get('is_only_emojis') ? 'chat-msg__text--larger' : ''} ${spoiler_classes}"
|
|
|
|
.model="${el.model}"
|
2021-09-09 16:20:33 +02:00
|
|
|
hide_url_previews=${el.model.get('hide_url_previews')}
|
2021-08-09 15:53:50 +02:00
|
|
|
?is_me_message=${el.model.isMeCommand()}
|
2021-09-09 16:20:33 +02:00
|
|
|
?render_media=${api.settings.get('render_media')}
|
2021-08-09 15:53:50 +02:00
|
|
|
text="${text}"></converse-chat-message-body>
|
|
|
|
${ (el.model.get('received') && !el.model.isMeCommand() && !is_groupchat_message) ? html`<span class="fa fa-check chat-msg__receipt"></span>` : '' }
|
|
|
|
${ (el.model.get('edited')) ? tpl_edited_icon(el) : '' }
|
|
|
|
</span>
|
2021-08-31 15:19:26 +02:00
|
|
|
${ show_oob ? html`<div class="chat-msg__media">${getOOBURLMarkup(el.model.get('oob_url'))}</div>` : '' }
|
2021-08-09 15:53:50 +02:00
|
|
|
<div class="chat-msg__error">${ el.model.get('error_text') || el.model.get('error') }</div>
|
|
|
|
`;
|
|
|
|
}
|