diff --git a/src/components/views/messages/SenderProfile.js b/src/components/views/messages/SenderProfile.js
index 63e3144115..f6940cd4b3 100644
--- a/src/components/views/messages/SenderProfile.js
+++ b/src/components/views/messages/SenderProfile.js
@@ -19,6 +19,7 @@
import React from 'react';
import sdk from '../../../index';
import Flair from '../elements/Flair.js';
+import { _tJsx } from '../../../languageHandler';
export default function SenderProfile(props) {
const EmojiText = sdk.getComponent('elements.EmojiText');
@@ -26,27 +27,44 @@ export default function SenderProfile(props) {
const name = mxEvent.sender ? mxEvent.sender.name : mxEvent.getSender();
const {msgtype} = mxEvent.getContent();
+ // Display sender name by default if nothing else is given
+ const text = props.text ? props.text : '%(senderName)s';
+
if (msgtype === 'm.emote') {
return ; // emote message must include the name so don't duplicate it
}
+ // Name + flair
+ const nameElem = [
+ { name || '' },
+ props.enableFlair ?
+
+ : null,
+ ]
+
+ if(props.text) {
+ // Replace senderName, and wrap surrounding text in spans with the right class
+ content = _tJsx(props.text, /^(.*)\%\(senderName\)s(.*)$/m, (p1, p2) => [
+ p1 ? {p1} : null,
+ nameElem,
+ p2 ? {p2} : null,
+ ]);
+ } else {
+ content = nameElem;
+ }
+
return (
- { name || '' }
- { props.enableFlair ?
-
- : null
- }
- { props.aux ? { props.aux } : null }
+ { content }
);
}
SenderProfile.propTypes = {
mxEvent: React.PropTypes.object.isRequired, // event whose sender we're showing
- aux: React.PropTypes.string, // stuff to go after the sender name, if anything
+ text: React.PropTypes.string, // Text to show. Defaults to sender name
onClick: React.PropTypes.func,
};
diff --git a/src/components/views/rooms/EventTile.js b/src/components/views/rooms/EventTile.js
index 499d0ec09a..812d72a26a 100644
--- a/src/components/views/rooms/EventTile.js
+++ b/src/components/views/rooms/EventTile.js
@@ -19,7 +19,7 @@ limitations under the License.
const React = require('react');
const classNames = require("classnames");
-import { _t } from '../../../languageHandler';
+import { _t, _td } from '../../../languageHandler';
const Modal = require('../../../Modal');
const sdk = require('../../../index');
@@ -502,12 +502,12 @@ module.exports = withMatrixClient(React.createClass({
}
if (needsSenderProfile) {
- let aux = null;
+ let text = null;
if (!this.props.tileShape) {
- if (msgtype === 'm.image') aux = _t('sent an image');
- else if (msgtype === 'm.video') aux = _t('sent a video');
- else if (msgtype === 'm.file') aux = _t('uploaded a file');
- sender = ;
+ if (msgtype === 'm.image') text = _td('%(senderName)s sent an image');
+ else if (msgtype === 'm.video') text = _td('%(senderName)s sent a video');
+ else if (msgtype === 'm.file') text = _td('%(senderName)s uploaded a file');
+ sender = ;
} else {
sender = ;
}