diff --git a/web/app/components/comment/__action/_type/_collapse/comment__action_type_collapse.scss b/web/app/components/comment/__action/_type/_collapse/comment__action_type_collapse.scss
index 54360eeb..919150b5 100644
--- a/web/app/components/comment/__action/_type/_collapse/comment__action_type_collapse.scss
+++ b/web/app/components/comment/__action/_type/_collapse/comment__action_type_collapse.scss
@@ -1,5 +1,8 @@
.comment__action_type_collapse {
display: inline-block;
+ position: absolute;
+ top: 6px;
+ right: 68px;
box-sizing: border-box;
width: 12px;
height: 12px;
diff --git a/web/app/components/comment/__info/comment__info.scss b/web/app/components/comment/__info/comment__info.scss
index dbf9b6cc..5c9a269d 100644
--- a/web/app/components/comment/__info/comment__info.scss
+++ b/web/app/components/comment/__info/comment__info.scss
@@ -1,6 +1,6 @@
.comment__info {
margin-bottom: 6px;
- padding-right: 64px;
+ padding-right: 84px;
font-size: 14px;
line-height: 16px;
}
diff --git a/web/app/components/comment/_collapsed/comment_collapsed.scss b/web/app/components/comment/_collapsed/comment_collapsed.scss
new file mode 100644
index 00000000..fd690f61
--- /dev/null
+++ b/web/app/components/comment/_collapsed/comment_collapsed.scss
@@ -0,0 +1,5 @@
+.comment_collapsed {
+ .comment__text, .comment__actions {
+ display: none;
+ }
+}
diff --git a/web/app/components/comment/comment.jsx b/web/app/components/comment/comment.jsx
index 85554b69..65f4a043 100644
--- a/web/app/components/comment/comment.jsx
+++ b/web/app/components/comment/comment.jsx
@@ -262,6 +262,11 @@ export default class Comment extends Component {
}
toggleCollapse() {
+ this.setState({
+ isEditing: false,
+ isReplying: false,
+ });
+
if (this.props.onCollapseToggle) {
this.props.onCollapseToggle();
}
@@ -385,6 +390,16 @@ export default class Comment extends Component {
)
}
+ {
+ !mods.disabled && (
+ {mods.collapsed ? '+' : '−'}
+ )
+ }
+
{mods.collapsed ? '+' : '−'}
- )
- }
-
{
!deleted && isAdmin && (
diff --git a/web/app/components/comment/index.js b/web/app/components/comment/index.js
index 68cf4b71..96b755ae 100644
--- a/web/app/components/comment/index.js
+++ b/web/app/components/comment/index.js
@@ -34,8 +34,9 @@ require('./__vote/_selected/comment__vote_selected.scss');
require('./__vote/_type/_down/comment__vote_type_down.scss');
require('./__vote/_type/_up/comment__vote_type_up.scss');
-require('./_level/comment_level.scss');
+require('./_collapsed/comment_collapsed.scss');
require('./_editing/comment_editing.scss');
+require('./_level/comment_level.scss');
require('./_replying/comment_replying.scss');
require('./_useless/comment_useless.scss');
diff --git a/web/app/components/thread/thread.jsx b/web/app/components/thread/thread.jsx
index 0ca3b3da..f22bbe21 100644
--- a/web/app/components/thread/thread.jsx
+++ b/web/app/components/thread/thread.jsx
@@ -2,6 +2,7 @@ import { h, Component } from 'preact';
import { LS_COLLAPSE_KEY } from 'common/constants';
import { siteId, url } from 'common/settings';
+import store from 'common/store';
import Comment from 'components/comment';
@@ -23,10 +24,15 @@ export default class Thread extends Component {
}
updateCollapsedState(comment) {
+ const config = store.get('config') || {};
+ const score = comment.score || 0;
+
this.lsCollapsedID = `${siteId}_${url}_${comment.id}`;
this.state = {
- collapsed: getCollapsedComments().includes(this.lsCollapsedID),
+ collapsed: !this.state.isCollapsedChanged && score <= config.critical_score
+ || getCollapsedComments().includes(this.lsCollapsedID),
+ isCollapsedChanged: true,
};
}
@@ -49,7 +55,7 @@ export default class Thread extends Component {
}
render(props, { collapsed }) {
- const { data: { comment, replies = [] }, mix, mods = {} } = props;
+ const { data: { comment, replies = [] }, mods = {} } = props;
return (