PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

De-partify SenderProfile

Browse source 
Signed-off-by: Stefan Parviainen <pafcu@iki.fi>

Also, text does not need to be EmojiText
This commit is contained in:
Stefan Parviainen 2017-10-15 21:08:41 +02:00
parent ad2f54f8ab
commit 8083dccfa5
2 changed files with 34 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
src/components/views/messages/SenderProfile.js
View file

@ -19,6 +19,7 @@
import React from 'react'; import React from 'react';
import sdk from '../../../index'; import sdk from '../../../index';
import Flair from '../elements/Flair.js'; import Flair from '../elements/Flair.js';
import { _tJsx } from '../../../languageHandler';
export default function SenderProfile(props) { export default function SenderProfile(props) {
const EmojiText = sdk.getComponent('elements.EmojiText'); 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 name = mxEvent.sender ? mxEvent.sender.name : mxEvent.getSender();
const {msgtype} = mxEvent.getContent(); 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') { if (msgtype === 'm.emote') {
return <span />; // emote message must include the name so don't duplicate it return <span />; // emote message must include the name so don't duplicate it
} }
return ( // Name + flair
<div className="mx_SenderProfile" dir="auto" onClick={props.onClick}> const nameElem = [
<EmojiText className="mx_SenderProfile_name">{ name || '' }</EmojiText> <EmojiText className="mx_SenderProfile_name">{ name || '' }</EmojiText>,
{ props.enableFlair ? props.enableFlair ?
<Flair <Flair
userId={mxEvent.getSender()} userId={mxEvent.getSender()}
roomId={mxEvent.getRoomId()} roomId={mxEvent.getRoomId()}
showRelated={true} /> showRelated={true} />
: null : 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 ? <span className='mx_SenderProfile_aux'>{p1}</span> : null,
nameElem,
p2 ? <span className='mx_SenderProfile_aux'>{p2}</span> : null,
]);
} else {
content = nameElem;
} }
{ props.aux ? <EmojiText className="mx_SenderProfile_aux"> { props.aux }</EmojiText> : null }
return (
<div className="mx_SenderProfile" dir="auto" onClick={props.onClick}>
{ content }
</div> </div>
); );
} }
SenderProfile.propTypes = { SenderProfile.propTypes = {
mxEvent: React.PropTypes.object.isRequired, // event whose sender we're showing 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, onClick: React.PropTypes.func,
}; };

12
src/components/views/rooms/EventTile.js
View file

@ -19,7 +19,7 @@ limitations under the License.
const React = require('react'); const React = require('react');
const classNames = require("classnames"); const classNames = require("classnames");
import { _t } from '../../../languageHandler'; import { _t, _td } from '../../../languageHandler';
const Modal = require('../../../Modal'); const Modal = require('../../../Modal');
const sdk = require('../../../index'); const sdk = require('../../../index');
@ -502,12 +502,12 @@ module.exports = withMatrixClient(React.createClass({
} }
if (needsSenderProfile) { if (needsSenderProfile) {
let aux = null; let text = null;
if (!this.props.tileShape) { if (!this.props.tileShape) {
if (msgtype === 'm.image') aux = _t('sent an image'); if (msgtype === 'm.image') text = _td('%(senderName)s sent an image');
else if (msgtype === 'm.video') aux = _t('sent a video'); else if (msgtype === 'm.video') text = _td('%(senderName)s sent a video');
else if (msgtype === 'm.file') aux = _t('uploaded a file'); else if (msgtype === 'm.file') text = _td('%(senderName)s uploaded a file');
sender = <SenderProfile onClick={this.onSenderProfileClick} mxEvent={this.props.mxEvent} enableFlair={!aux} aux={aux} />; sender = <SenderProfile onClick={this.onSenderProfileClick} mxEvent={this.props.mxEvent} enableFlair={!text} text={text} />;
} else { } else {
sender = <SenderProfile mxEvent={this.props.mxEvent} enableFlair={true} />; sender = <SenderProfile mxEvent={this.props.mxEvent} enableFlair={true} />;
} }