diff --git a/app/javascript/flavours/glitch/features/list_timeline/index.js b/app/javascript/flavours/glitch/features/list_timeline/index.js index edefc2006..ef829b937 100644 --- a/app/javascript/flavours/glitch/features/list_timeline/index.js +++ b/app/javascript/flavours/glitch/features/list_timeline/index.js @@ -17,9 +17,9 @@ import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; const messages = defineMessages({ deleteMessage: { id: 'confirmations.delete_list.message', defaultMessage: 'Are you sure you want to permanently delete this list?' }, deleteConfirm: { id: 'confirmations.delete_list.confirm', defaultMessage: 'Delete' }, - all_replies: { id: 'lists.replies_policy.all_replies', defaultMessage: 'to any followed user' }, - no_replies: { id: 'lists.replies_policy.no_replies', defaultMessage: 'none' }, - list_replies: { id: 'lists.replies_policy.list_replies', defaultMessage: 'only to list' }, + all_replies: { id: 'lists.replies_policy.all_replies', defaultMessage: 'any followed user' }, + no_replies: { id: 'lists.replies_policy.no_replies', defaultMessage: 'no one' }, + list_replies: { id: 'lists.replies_policy.list_replies', defaultMessage: 'members of the list' }, }); const mapStateToProps = (state, props) => ({ @@ -114,11 +114,10 @@ export default class ListTimeline extends React.PureComponent { })); } - handleRepliesPolicyClick = () => { + handleRepliesPolicyChange = ({ target }) => { const { dispatch, list } = this.props; const { id } = this.props.params; - const replies_policy = {'all_replies': 'no_replies', 'no_replies': 'list_replies', 'list_replies': 'all_replies'}[list.get('replies_policy')]; - this.props.dispatch(updateList(id, undefined, false, replies_policy)); + this.props.dispatch(updateList(id, undefined, false, target.value)); } render () { @@ -166,15 +165,26 @@ export default class ListTimeline extends React.PureComponent { - - { replies_policy !== undefined && ( - - ) - } + { replies_policy !== undefined && ( +
+
+
+ + { ['no_replies', 'list_replies', 'all_replies'].map(policy => ( +
+ + +
+ ))} +
+
+
+ )} +
diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss index b16b13d87..3e3ef6b52 100644 --- a/app/javascript/flavours/glitch/styles/components/index.scss +++ b/app/javascript/flavours/glitch/styles/components/index.scss @@ -1062,6 +1062,7 @@ } .setting-toggle__label, +.setting-radio__label, .setting-meta__label { color: $darker-text-color; display: inline-block; @@ -1070,6 +1071,27 @@ vertical-align: middle; } +.setting-radio { + display: block; + line-height: 18px; +} + +.setting-radio__label { + margin-bottom: 0; +} + +.column-settings__row legend { + color: $darker-text-color; + cursor: default; + display: block; + font-weight: 500; + margin-top: 10px; +} + +.setting-radio__input { + vertical-align: middle; +} + .setting-meta__label { float: right; }