pro/im_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

reply formatting works correctly

Browse Source
This commit is contained in:
or-else
2021-12-19 17:42:19 -08:00
parent 1d59d29519
commit b201f019ef
11 changed files with 107 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/formatters.js
+23 -18
View File
@@ -124,17 +124,16 @@ function quotedImage(data) {
// onImagePreview: this.handleImagePreview
// onFormButtonClick: this.handleFormButtonClick
// onQuoteClick: this.handleQuoteClick (optional)
export function fullFormatter(style, data, values, key) {
export function fullFormatter(style, data, values, key, stack) {
if (stack.includes('QQ')) {
return quoteFormatter(style, data, values, key);
}
if (!style) {
// Unformatted.
return values;
}
if (style == 'HD') {
// Hidden.
return null;
}
let el = Drafty.tagName(style);
const attr = Drafty.attrValue(style, data) || {};
attr.key = key;
@@ -146,6 +145,10 @@ export function fullFormatter(style, data, values, key) {
// Highlighted text. Assign class name.
attr.className = 'highlight';
break;
case 'HD':
el = null;
values = null;
break;
case 'IM':
// Additional processing for images
el = handleImageData.call(this, el, data, attr);
@@ -295,8 +298,8 @@ function inlineImageAttr(attr, data) {
// messages: formatjs messages defined with defineMessages.
// authorizeURL: this.props.tinode.authorizeURL
// onQuoteClick: this.handleQuoteClick (optional)
export function quoteFormatter(style, data, values, key) {
if (['BR', 'EX', 'IM', 'MN', 'QQ'].includes(style)) {
function quoteFormatter(style, data, values, key) {
if (['BR', 'EX', 'IM', 'MN'].includes(style)) {
let el = Drafty.tagName(style);
let attr = Drafty.attrValue(style, data) || {};
attr.key = key;
@@ -318,10 +321,6 @@ export function quoteFormatter(style, data, values, key) {
attr.className += ' ' + idToColorClass(data.val, false, true);
}
break;
case 'QQ':
attr.className = 'reply-quote';
attr.onClick = this.onQuoteClick;
break;
case 'EX':
let fname;
if (data) {
@@ -391,11 +390,17 @@ function quoteImage(data) {
// Create a preview of a reply.
export function replyFormatter(style, data, values, key) {
if (style != 'IM') {
return quoteFormatter.call(this, style, data, values, key);
if (style == 'IM') {
const attr = inlineImageAttr.call(this, {key: key}, data);
attr.whenDone = cancelablePromise(quoteImage.call(this, data));
values = [React.createElement(LazyImage, attr, null), ' ', attr.alt];
return React.createElement(React.Fragment, {key: key}, values);
} else if (style == 'QQ') {
let el = Drafty.tagName('QQ');
const attr = Drafty.attrValue('QQ', data) || {};
attr.key = key;
attr.className = 'reply-quote'
return React.createElement(el, attr, values);
}
const attr = inlineImageAttr.call(this, {key: key}, data);
attr.whenDone = cancelablePromise(quoteImage.call(this, data));
values = [React.createElement(LazyImage, attr, null), ' ', attr.alt];
return React.createElement(React.Fragment, {key: key}, values);
return quoteFormatter.call(this, style, data, values, key);
}
src/views/messages-view.jsx
+1 -3
View File
@@ -221,7 +221,6 @@ class MessagesView extends React.Component {
const preview = nextProps.forwardMessage.preview;
reply = {
content: preview,
forwarded: nextProps.forwardMessage.head.forwarded,
seq: null
};
}
@@ -852,7 +851,7 @@ class MessagesView extends React.Component {
// forwarded: true if the source message is also a forwarded message.
// senderId: UID of the sender of the source message.
// senderName: full name of the sender of the original message.
handlePickReply(seq, content, forwarded, senderId, senderName) {
handlePickReply(seq, content, senderId, senderName) {
this.setState({reply: null});
if (!seq || !content) {
@@ -993,7 +992,6 @@ class MessagesView extends React.Component {
<ChatMessage
tinode={this.props.tinode}
content={msg.content}
forwarded={msg.head ? !!msg.head.forwarded : null}
deleted={msg.hi}
mimeType={msg.head ? msg.head.mime : null}
timestamp={msg.ts}
src/widgets/chat-message.jsx
+2 -4
View File
@@ -7,8 +7,8 @@ import Attachment from './attachment.jsx';
import LetterTile from './letter-tile.jsx';
import ReceivedMarker from './received-marker.jsx'
import { fullFormatter, quoteFormatter } from '../lib/formatters.js';
import { sanitizeImageUrl, sanitizeUrl } from '../lib/utils.js';
import { fullFormatter } from '../lib/formatters.js';
import { sanitizeUrl } from '../lib/utils.js';
class BaseChatMessage extends React.PureComponent {
constructor(props) {
@@ -29,7 +29,6 @@ class BaseChatMessage extends React.PureComponent {
this.handleQuoteClick = this.handleQuoteClick.bind(this);
this.formatterContext = {
getFormatter: (tp) => { return tp == 'QQ' ? quoteFormatter : null; },
formatMessage: props.intl.formatMessage.bind(props.intl),
viewportWidth: props.viewportWidth,
authorizeURL: props.tinode.authorizeURL.bind(props.tinode),
@@ -87,7 +86,6 @@ class BaseChatMessage extends React.PureComponent {
content: this.props.content,
userFrom: this.props.userFrom,
userName: this.props.userName,
forwarded: this.props.forwarded,
y: e.pageY,
x: e.pageX,
pickReply: this.props.pickReply
src/widgets/context-menu.jsx
+1 -1
View File
@@ -434,7 +434,7 @@ class ContextMenu extends React.Component {
}
replyToMessage(params, errorHandler) {
params.pickReply(params.seq, params.content, params.forwarded, params.userFrom, params.userName, errorHandler);
params.pickReply(params.seq, params.content, params.userFrom, params.userName, errorHandler);
}
render() {
src/widgets/send-message.jsx
+3 -2
View File
@@ -5,7 +5,7 @@ import { Drafty } from 'tinode-sdk';
import { KEYPRESS_DELAY } from '../config.js';
import { filePasted } from '../lib/blob-helpers.js';
import { quoteFormatter, replyFormatter } from '../lib/formatters.js';
import { replyFormatter } from '../lib/formatters.js';
const messages = defineMessages({
messaging_disabled: {
@@ -82,11 +82,12 @@ class SendMessage extends React.PureComponent {
}
formatReply() {
return this.props.reply ?
const fmt = this.props.reply ?
Drafty.format(this.props.reply.content, replyFormatter, {
formatMessage: this.props.intl.formatMessage.bind(this.props.intl),
authorizeURL: this.props.tinode.authorizeURL.bind(this.props.tinode)
}) : null;
return fmt;
}
handlePasteEvent(e) {
umd/index.dev.js
+32 -31
View File
@@ -402,7 +402,6 @@ __webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "fullFormatter": () => (/* binding */ fullFormatter),
/* harmony export */ "previewFormatter": () => (/* binding */ previewFormatter),
/* harmony export */ "quoteFormatter": () => (/* binding */ quoteFormatter),
/* harmony export */ "replyFormatter": () => (/* binding */ replyFormatter)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
@@ -532,13 +531,13 @@ function quotedImage(data) {
});
}
function fullFormatter(style, data, values, key) {
if (!style) {
return values;
function fullFormatter(style, data, values, key, stack) {
if (stack.includes('QQ')) {
return quoteFormatter(style, data, values, key);
}
if (style == 'HD') {
return null;
if (!style) {
return values;
}
let el = tinode_sdk__WEBPACK_IMPORTED_MODULE_2__.Drafty.tagName(style);
@@ -554,6 +553,11 @@ function fullFormatter(style, data, values, key) {
attr.className = 'highlight';
break;
case 'HD':
el = null;
values = null;
break;
case 'IM':
el = handleImageData.call(this, el, data, attr);
values = null;
@@ -722,7 +726,7 @@ function inlineImageAttr(attr, data) {
}
function quoteFormatter(style, data, values, key) {
if (['BR', 'EX', 'IM', 'MN', 'QQ'].includes(style)) {
if (['BR', 'EX', 'IM', 'MN'].includes(style)) {
let el = tinode_sdk__WEBPACK_IMPORTED_MODULE_2__.Drafty.tagName(style);
let attr = tinode_sdk__WEBPACK_IMPORTED_MODULE_2__.Drafty.attrValue(style, data) || {};
attr.key = key;
@@ -751,11 +755,6 @@ function quoteFormatter(style, data, values, key) {
break;
case 'QQ':
attr.className = 'reply-quote';
attr.onClick = this.onQuoteClick;
break;
case 'EX':
let fname;
@@ -822,18 +821,24 @@ function quoteImage(data) {
}
function replyFormatter(style, data, values, key) {
if (style != 'IM') {
return quoteFormatter.call(this, style, data, values, key);
if (style == 'IM') {
const attr = inlineImageAttr.call(this, {
key: key
}, data);
attr.whenDone = (0,_utils_js__WEBPACK_IMPORTED_MODULE_8__.cancelablePromise)(quoteImage.call(this, data));
values = [react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_lazy_image_jsx__WEBPACK_IMPORTED_MODULE_3__["default"], attr, null), ' ', attr.alt];
return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), {
key: key
}, values);
} else if (style == 'QQ') {
let el = tinode_sdk__WEBPACK_IMPORTED_MODULE_2__.Drafty.tagName('QQ');
const attr = tinode_sdk__WEBPACK_IMPORTED_MODULE_2__.Drafty.attrValue('QQ', data) || {};
attr.key = key;
attr.className = 'reply-quote';
return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(el, attr, values);
}
const attr = inlineImageAttr.call(this, {
key: key
}, data);
attr.whenDone = (0,_utils_js__WEBPACK_IMPORTED_MODULE_8__.cancelablePromise)(quoteImage.call(this, data));
values = [react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_lazy_image_jsx__WEBPACK_IMPORTED_MODULE_3__["default"], attr, null), ' ', attr.alt];
return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), {
key: key
}, values);
return quoteFormatter.call(this, style, data, values, key);
}
/***/ }),
@@ -3504,7 +3509,6 @@ class MessagesView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Compone
const preview = nextProps.forwardMessage.preview;
reply = {
content: preview,
forwarded: nextProps.forwardMessage.head.forwarded,
seq: null
};
}
@@ -4160,7 +4164,7 @@ class MessagesView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Compone
uploader.cancel();
}
handlePickReply(seq, content, forwarded, senderId, senderName) {
handlePickReply(seq, content, senderId, senderName) {
this.setState({
reply: null
});
@@ -4320,7 +4324,6 @@ class MessagesView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Compone
messageNodes.push(react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_chat_message_jsx__WEBPACK_IMPORTED_MODULE_3__["default"], {
tinode: this.props.tinode,
content: msg.content,
forwarded: msg.head ? !!msg.head.forwarded : null,
deleted: msg.hi,
mimeType: msg.head ? msg.head.mime : null,
timestamp: msg.ts,
@@ -7817,9 +7820,6 @@ class BaseChatMessage extends (react__WEBPACK_IMPORTED_MODULE_0___default().Pure
this.handleCancelUpload = this.handleCancelUpload.bind(this);
this.handleQuoteClick = this.handleQuoteClick.bind(this);
this.formatterContext = {
getFormatter: tp => {
return tp == 'QQ' ? _lib_formatters_js__WEBPACK_IMPORTED_MODULE_6__.quoteFormatter : null;
},
formatMessage: props.intl.formatMessage.bind(props.intl),
viewportWidth: props.viewportWidth,
authorizeURL: props.tinode.authorizeURL.bind(props.tinode),
@@ -7879,7 +7879,6 @@ class BaseChatMessage extends (react__WEBPACK_IMPORTED_MODULE_0___default().Pure
content: this.props.content,
userFrom: this.props.userFrom,
userName: this.props.userName,
forwarded: this.props.forwarded,
y: e.pageY,
x: e.pageX,
pickReply: this.props.pickReply
@@ -9196,7 +9195,7 @@ class ContextMenu extends (react__WEBPACK_IMPORTED_MODULE_0___default().Componen
}
replyToMessage(params, errorHandler) {
params.pickReply(params.seq, params.content, params.forwarded, params.userFrom, params.userName, errorHandler);
params.pickReply(params.seq, params.content, params.userFrom, params.userName, errorHandler);
}
render() {
@@ -11799,10 +11798,12 @@ class SendMessage extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureComp
}
formatReply() {
return this.props.reply ? tinode_sdk__WEBPACK_IMPORTED_MODULE_2__.Drafty.format(this.props.reply.content, _lib_formatters_js__WEBPACK_IMPORTED_MODULE_5__.replyFormatter, {
const fmt = this.props.reply ? tinode_sdk__WEBPACK_IMPORTED_MODULE_2__.Drafty.format(this.props.reply.content, _lib_formatters_js__WEBPACK_IMPORTED_MODULE_5__.replyFormatter, {
formatMessage: this.props.intl.formatMessage.bind(this.props.intl),
authorizeURL: this.props.tinode.authorizeURL.bind(this.props.tinode)
}) : null;
console.log("formatReply", this.props.reply, fmt);
return fmt;
}
handlePasteEvent(e) {
umd/index.dev.js.map
+1 -1
View File
File diff suppressed because one or more lines are too long
umd/index.prod.js
+1 -1
View File
File diff suppressed because one or more lines are too long
umd/index.prod.js.map
+1 -1
View File
File diff suppressed because one or more lines are too long
umd/tinode.dev.js
+41 -31
View File
File diff suppressed because one or more lines are too long
umd/tinode.prod.js
+1 -1
View File
File diff suppressed because one or more lines are too long