diff --git a/.babelrc b/.babelrc index 86c445f5451..47c9aceb7e5 100644 --- a/.babelrc +++ b/.babelrc @@ -1,3 +1,4 @@ { - "presets": ["es2015", "react"] + "presets": ["es2015", "react"], + "plugins": ["transform-object-rest-spread"] } diff --git a/.eslintrc b/.eslintrc index be3d78d59e3..10bf7054628 100644 --- a/.eslintrc +++ b/.eslintrc @@ -5,6 +5,8 @@ "es6": true }, + "parser": "babel-eslint", + "plugins": [ "react" ], diff --git a/app/assets/javascripts/components/actions/interactions.jsx b/app/assets/javascripts/components/actions/interactions.jsx index 281d3be87fb..9646555307a 100644 --- a/app/assets/javascripts/components/actions/interactions.jsx +++ b/app/assets/javascripts/components/actions/interactions.jsx @@ -15,7 +15,9 @@ export function reblog(status) { dispatch(reblogRequest(status)); api(getState).post(`/api/statuses/${status.get('id')}/reblog`).then(function (response) { - dispatch(reblogSuccess(status, response.data)); + // The reblog API method returns a new status wrapped around the original. In this case we are only + // interested in how the original is modified, hence passing it skipping the wrapper + dispatch(reblogSuccess(status, response.data.reblog)); }).catch(function (error) { dispatch(reblogFail(status, error)); }); diff --git a/app/assets/javascripts/components/components/display_name.jsx b/app/assets/javascripts/components/components/display_name.jsx new file mode 100644 index 00000000000..1d579731b71 --- /dev/null +++ b/app/assets/javascripts/components/components/display_name.jsx @@ -0,0 +1,19 @@ +import ImmutablePropTypes from 'react-immutable-proptypes'; + +const DisplayName = React.createClass({ + + propTypes: { + account: ImmutablePropTypes.map.isRequired + }, + + render () { + return ( + + {this.props.account.get('display_name')} @{this.props.account.get('acct')} + + ); + } + +}); + +export default DisplayName; diff --git a/app/assets/javascripts/components/components/reply_indicator.jsx b/app/assets/javascripts/components/components/reply_indicator.jsx index 2531b7f434a..9598a587457 100644 --- a/app/assets/javascripts/components/components/reply_indicator.jsx +++ b/app/assets/javascripts/components/components/reply_indicator.jsx @@ -2,6 +2,7 @@ import PureRenderMixin from 'react-addons-pure-render-mixin'; import ImmutablePropTypes from 'react-immutable-proptypes'; import Avatar from './avatar'; import IconButton from './icon_button'; +import DisplayName from './display_name'; const ReplyIndicator = React.createClass({ @@ -26,7 +27,7 @@ const ReplyIndicator = React.createClass({
- {this.props.status.getIn(['account', 'display_name'])} @{this.props.status.getIn(['account', 'acct'])} +
diff --git a/app/assets/javascripts/components/components/status.jsx b/app/assets/javascripts/components/components/status.jsx index 7885360e6d9..fabe85babd2 100644 --- a/app/assets/javascripts/components/components/status.jsx +++ b/app/assets/javascripts/components/components/status.jsx @@ -3,6 +3,7 @@ import Avatar from './avatar'; import RelativeTimestamp from './relative_timestamp'; import PureRenderMixin from 'react-addons-pure-render-mixin'; import IconButton from './icon_button'; +import DisplayName from './display_name'; const Status = React.createClass({ @@ -29,7 +30,20 @@ const Status = React.createClass({ render () { var content = { __html: this.props.status.get('content') }; - var status = this.props.status; + var { status, ...other } = this.props; + + if (status.get('reblog') !== null) { + return ( +
+
+
+ {status.getIn(['account', 'display_name'])} reblogged +
+ + +
+ ); + } return (
@@ -43,9 +57,7 @@ const Status = React.createClass({
- - {status.getIn(['account', 'display_name'])} @{status.getIn(['account', 'acct'])} - + diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss index 4050babf9ec..f17160161fa 100644 --- a/app/assets/stylesheets/components.scss +++ b/app/assets/stylesheets/components.scss @@ -76,6 +76,12 @@ text-decoration: none; } +.status__display-name { + strong { + color: #fff; + } +} + .status__display-name, .reply-indicator__display-name { &:hover { strong { diff --git a/package.json b/package.json index 8f6300e122f..57e9ded3d4a 100644 --- a/package.json +++ b/package.json @@ -2,6 +2,7 @@ "name": "mastodon", "devDependencies": { "babel-plugin-react-transform": "^2.0.2", + "babel-plugin-transform-object-rest-spread": "^6.8.0", "babel-preset-es2015": "^6.13.2", "babel-preset-react": "^6.11.1", "babelify": "^7.3.0",