diff --git a/src/components/elements/messages/AuthorDropdown/index.jsx b/src/components/elements/messages/AuthorDropdown/index.jsx new file mode 100644 index 00000000..090a7422 --- /dev/null +++ b/src/components/elements/messages/AuthorDropdown/index.jsx @@ -0,0 +1,30 @@ +import React from 'react' +import {connect} from 'react-redux' +import { withRouter } from 'react-router' +import { Link } from 'react-router-dom' +import tt from 'counterpart' + +class AuthorDropdown extends React.Component { + constructor(props) { + super(props) + this.state = { + } + } + + render() { + const { author } = this.props + return
{author}
+ } +} + +export default withRouter(connect( + (state, ownProps) => { + + return { + } + }, + dispatch => ({ + deleteGroup: ({ owner, name, password, }) => { + } + }), +)(AuthorDropdown)) diff --git a/src/components/elements/messages/Message/Message.css b/src/components/elements/messages/Message/Message.css index 0d482340..abde29ef 100644 --- a/src/components/elements/messages/Message/Message.css +++ b/src/components/elements/messages/Message/Message.css @@ -20,9 +20,16 @@ display: flex; } +.msgs-message .bubble-container .author { + font-size: 98%; + font-weight: bold; + color: #0078C4; + padding-bottom: 3px; +} .msgs-message .bubble-container .avatar { width: 42px; margin-top: 14px; + cursor: pointer; } .msgs-message .bubble-container .avatar .Userpic { position: static; diff --git a/src/components/elements/messages/Message/index.jsx b/src/components/elements/messages/Message/index.jsx index b54dea9f..392f081f 100644 --- a/src/components/elements/messages/Message/index.jsx +++ b/src/components/elements/messages/Message/index.jsx @@ -1,7 +1,10 @@ import React from 'react'; +import { Fade } from 'react-foundation-components/lib/global/fade' +import { LinkWithDropdown } from 'react-foundation-components/lib/global/dropdown' import tt from 'counterpart'; import { Asset } from 'golos-lib-js/lib/utils' +import AuthorDropdown from 'app/components/elements/messages/AuthorDropdown' import Donating from 'app/components/elements/messages/Donating' import Userpic from 'app/components/elements/Userpic' import { displayQuoteMsg } from 'app/utils/MessageUtils'; @@ -101,10 +104,24 @@ export default class Message extends React.Component { adds.unshift(unread) } + let author let avatar if (!isMine && group) { if (startsSequence) { - avatar = + author =
+ {from} +
+ + avatar = } + transition={Fade} + > + + } avatar =
{avatar} @@ -129,6 +146,7 @@ export default class Message extends React.Component { {avatar} {isMine ? adds : null}
this.onMessageSelect(idx, event)} title={friendlyDate + (modified ? tt('g.modified') : '')}> + {author} { quoteHeader } { content }