diff options
author | kibigo! <marrus-sh@users.noreply.github.com> | 2017-12-29 14:55:06 -0800 |
---|---|---|
committer | kibigo! <marrus-sh@users.noreply.github.com> | 2018-01-04 18:23:46 -0800 |
commit | 083170bec755920b80c64f9cca2cc419831f66c8 (patch) | |
tree | 7d15f95360fab7e76bad7e8d8f76667215d25b78 /app/javascript/flavours/glitch/components/avatar.js | |
parent | 8713659dffc884c65376091d3731c8074ac581e4 (diff) |
WIP <Compose> Refactor; SCSS ed.
Diffstat (limited to 'app/javascript/flavours/glitch/components/avatar.js')
-rw-r--r-- | app/javascript/flavours/glitch/components/avatar.js | 18 |
1 files changed, 11 insertions, 7 deletions
diff --git a/app/javascript/flavours/glitch/components/avatar.js b/app/javascript/flavours/glitch/components/avatar.js index 82ab0f45a..c5e9072c4 100644 --- a/app/javascript/flavours/glitch/components/avatar.js +++ b/app/javascript/flavours/glitch/components/avatar.js @@ -1,3 +1,4 @@ +import classNames from 'classnames'; import React from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; @@ -7,6 +8,7 @@ export default class Avatar extends React.PureComponent { static propTypes = { account: ImmutablePropTypes.map.isRequired, + className: PropTypes.string, size: PropTypes.number.isRequired, style: PropTypes.object, inline: PropTypes.bool, @@ -34,17 +36,19 @@ export default class Avatar extends React.PureComponent { } render () { - const { account, size, animate, inline } = this.props; + const { + account, + animate, + className, + inline, + size, + } = this.props; const { hovering } = this.state; const src = account.get('avatar'); const staticSrc = account.get('avatar_static'); - let className = 'account__avatar'; - - if (inline) { - className = className + ' account__avatar-inline'; - } + const computedClass = classNames('account__avatar', { 'account__avatar-inline': inline }, className); const style = { ...this.props.style, @@ -61,7 +65,7 @@ export default class Avatar extends React.PureComponent { return ( <div - className={className} + className={computedClass} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} style={style} |