diff --git a/app/controllers/api/v1/antennas_controller.rb b/app/controllers/api/v1/antennas_controller.rb index 7c4fd1d329..5b6712b834 100644 --- a/app/controllers/api/v1/antennas_controller.rb +++ b/app/controllers/api/v1/antennas_controller.rb @@ -42,6 +42,6 @@ class Api::V1::AntennasController < Api::BaseController end def antenna_params - params.permit(:title, :stl, :with_media_only, :ignore_reblog) + params.permit(:title, :list_id, :stl, :with_media_only, :ignore_reblog) end end diff --git a/app/javascript/mastodon/actions/antennas.js b/app/javascript/mastodon/actions/antennas.js index 163b52b3b2..77ba6945e2 100644 --- a/app/javascript/mastodon/actions/antennas.js +++ b/app/javascript/mastodon/actions/antennas.js @@ -151,10 +151,10 @@ export const createAntennaFail = error => ({ error, }); -export const updateAntenna = (id, title, shouldReset, stl, with_media_only, ignore_reblog) => (dispatch, getState) => { +export const updateAntenna = (id, title, shouldReset, list_id, stl, with_media_only, ignore_reblog) => (dispatch, getState) => { dispatch(updateAntennaRequest(id)); - api(getState).put(`/api/v1/antennas/${id}`, { title, stl, with_media_only, ignore_reblog }).then(({ data }) => { + api(getState).put(`/api/v1/antennas/${id}`, { title, list_id, stl, with_media_only, ignore_reblog }).then(({ data }) => { dispatch(updateAntennaSuccess(data)); if (shouldReset) { diff --git a/app/javascript/mastodon/features/antenna_setting/index.jsx b/app/javascript/mastodon/features/antenna_setting/index.jsx index 1eb9e05b5f..ca5eadefcb 100644 --- a/app/javascript/mastodon/features/antenna_setting/index.jsx +++ b/app/javascript/mastodon/features/antenna_setting/index.jsx @@ -8,10 +8,12 @@ import { Helmet } from 'react-helmet'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; +import Select, { NonceProvider } from 'react-select'; import Toggle from 'react-toggle'; import { fetchAntenna, deleteAntenna, updateAntenna } from 'mastodon/actions/antennas'; import { addColumn, removeColumn, moveColumn } from 'mastodon/actions/columns'; +import { fetchLists } from 'mastodon/actions/lists'; import { openModal } from 'mastodon/actions/modal'; import Button from 'mastodon/components/button'; import Column from 'mastodon/components/column'; @@ -24,10 +26,13 @@ const messages = defineMessages({ deleteMessage: { id: 'confirmations.delete_antenna.message', defaultMessage: 'Are you sure you want to permanently delete this antenna?' }, deleteConfirm: { id: 'confirmations.delete_antenna.confirm', defaultMessage: 'Delete' }, editAccounts: { id: 'antennas.edit_accounts', defaultMessage: 'Edit accounts' }, + noOptions: { id: 'antennas.select.no_options_message', defaultMessage: 'Empty lists' }, + placeholder: { id: 'antennas.select.placeholder', defaultMessage: 'Select list' }, }); const mapStateToProps = (state, props) => ({ antenna: state.getIn(['antennas', props.params.id]), + lists: state.get('lists'), }); class AntennaSetting extends PureComponent { @@ -42,6 +47,7 @@ class AntennaSetting extends PureComponent { columnId: PropTypes.string, multiColumn: PropTypes.bool, antenna: PropTypes.oneOfType([ImmutablePropTypes.map, PropTypes.bool]), + lists: ImmutablePropTypes.list, intl: PropTypes.object.isRequired, }; @@ -70,6 +76,7 @@ class AntennaSetting extends PureComponent { const { id } = this.props.params; dispatch(fetchAntenna(id)); + dispatch(fetchLists()); } UNSAFE_componentWillReceiveProps (nextProps) { @@ -121,23 +128,31 @@ class AntennaSetting extends PureComponent { onStlToggle = ({ target }) => { const { dispatch } = this.props; const { id } = this.props.params; - dispatch(updateAntenna(id, undefined, false, target.checked, undefined, undefined)); + dispatch(updateAntenna(id, undefined, false, undefined, target.checked, undefined, undefined)); }; onMediaOnlyToggle = ({ target }) => { const { dispatch } = this.props; const { id } = this.props.params; - dispatch(updateAntenna(id, undefined, false, undefined, target.checked, undefined)); + dispatch(updateAntenna(id, undefined, false, undefined, undefined, target.checked, undefined)); }; onIgnoreReblogToggle = ({ target }) => { const { dispatch } = this.props; const { id } = this.props.params; - dispatch(updateAntenna(id, undefined, false, undefined, undefined, target.checked)); + dispatch(updateAntenna(id, undefined, false, undefined, undefined, undefined, target.checked)); }; + onSelect = value => { + const { dispatch } = this.props; + const { id } = this.props.params; + dispatch(updateAntenna(id, undefined, false, value.value, undefined, undefined, undefined)); + }; + + noOptionsMessage = () => this.props.intl.formatMessage(messages.noOptions); + render () { - const { columnId, multiColumn, antenna, intl } = this.props; + const { columnId, multiColumn, antenna, lists, intl } = this.props; const { id } = this.props.params; const pinned = !!columnId; const title = antenna ? antenna.get('title') : id; @@ -183,12 +198,16 @@ class AntennaSetting extends PureComponent { let stlAlert; if (isStl) { stlAlert = ( -
+

); } + const listOptions = lists.toArray().map((list) => { + return { value: list[1].get('id'), label: list[1].get('title') } + }); + return ( {stlAlert} - {!isStl && ( -
- {antenna.get('list') ? ( -

- ) : ( - <> -

- - - )} +
+ {antenna.get('list') ? ( +

+ ) : ( + <> +

+ + + )} -

-