diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index 98953f194..f24330454 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -101,7 +101,8 @@ class Status extends ImmutablePureComponent {
'account',
'muted',
'hidden',
- 'sonsIds'
+ 'sonsIds',
+ 'ancestorsText',
];
state = {
@@ -329,7 +330,7 @@ class Status extends ImmutablePureComponent {
let statusAvatar, prepend, rebloggedByText;
let sons, quote;
- const { intl, hidden, featured, otherAccounts, unread, showThread, deep, tree_type, sonsIds } = this.props;
+ const { intl, hidden, featured, otherAccounts, unread, showThread, deep, tree_type, ancestorsText, sonsIds } = this.props;
let { status, account, ...other } = this.props;
@@ -489,7 +490,13 @@ class Status extends ImmutablePureComponent {
}
if (rebloggedByText && status.get('in_reply_to_id')) {
- quote =
+ quote = ancestorsText ?
+
+
+ {ancestorsText}
+
+ :
+
{
const getStatus = makeGetStatus();
+
+ const getAncestorsIds = createSelector([
+ (_, { id }) => id,
+ state => state.getIn(['contexts', 'inReplyTos']),
+ ], (statusId, inReplyTos) => {
+ let ancestorsIds = Immutable.List();
+ ancestorsIds = ancestorsIds.withMutations(mutable => {
+ let id = statusId;
+
+ while (id) {
+ mutable.unshift(id);
+ id = inReplyTos.get(id);
+ }
+ });
+
+ return ancestorsIds;
+ });
+
+ const getAncestorsText = createSelector([
+ (_, {ids}) => ids,
+ state => state.get('statuses'),
+ ], (ids, statuses) => ids.map(i => {
+ let text = statuses.get(i) ? statuses.get(i).get('search_index') : i;
+ if(text.length > 16)
+ text = text.slice(0,13) + "...";
+ return text;
+ }).join(' >> ')
+ );
+
+ const getSonsIds = createSelector([
+ (_, {id}) => id,
+ state => state.getIn(['contexts', 'replies']),
+ ], (statusId, contextReplies) => {
+ const sons = contextReplies.get(statusId);
+ return sons ? sons.map(id => ({
+ 'id': id,
+ 'sonsIds' : contextReplies.get(id),
+ }))
+ : null;
+ });
const mapStateToProps = (state, props) => {
const status = getStatus(state, props);
- const sons = (props.showThread && status!==null) ? state.getIn(['contexts', 'replies', status.getIn(['reblog', 'id'], props.id)]) : null;
- return ({
- 'status': status,
- 'sonsIds': (props.showThread && sons) ? sons.map(id => ({
- 'id': id,
- 'sonsIds' : state.getIn(['contexts', 'replies', id])
- }))
- :
- null,
- })
- }
+ let ancestorsIds = Immutable.List();
+ let ancestorsText;
+ let sonsIds;
+
+ if (props.showThread && status) {
+ sonsIds = getSonsIds(state, { id : status.getIn(['reblog', 'id'], props.id)});
+ if(status.get('reblog')) {
+ ancestorsIds = getAncestorsIds(state, { id: status.getIn(['reblog', 'in_reply_to_id']) });
+ if(ancestorsIds && ancestorsIds.first() == treeRoot.split('/').pop()) {
+ ancestorsText = getAncestorsText(state, { ids: ancestorsIds.shift() });
+ }
+ }
+ }
+ return {
+ status,
+ ancestorsText,
+ sonsIds,
+ };
+ };
return mapStateToProps;
};
diff --git a/app/javascript/styles/closed-social/global.scss b/app/javascript/styles/closed-social/global.scss
index e851c5418..3f9d1096e 100644
--- a/app/javascript/styles/closed-social/global.scss
+++ b/app/javascript/styles/closed-social/global.scss
@@ -65,6 +65,12 @@ div {
}
}
+.status__tree__quote__wrapper {
+ margin-top:16px;
+ padding: 10px 5px;
+ background: #dbdbdb40;
+}
+
@keyframes like {
0% {
transform: scale(1);
diff --git a/app/javascript/styles/closed-social/timeline_comments.scss b/app/javascript/styles/closed-social/timeline_comments.scss
index 8c77af6f4..b220bf9a7 100644
--- a/app/javascript/styles/closed-social/timeline_comments.scss
+++ b/app/javascript/styles/closed-social/timeline_comments.scss
@@ -26,7 +26,7 @@
box-shadow: $primary-text-color 3.2px 3.2px 8px;
}
& .comments-timeline-2 {
- margin-left:40px;
+ margin-left:42px;
}
}