diff --git a/app/javascript/mastodon/features/home_timeline/components/column_settings.jsx b/app/javascript/mastodon/features/home_timeline/components/column_settings.jsx deleted file mode 100644 index b6e6b9cff6..0000000000 --- a/app/javascript/mastodon/features/home_timeline/components/column_settings.jsx +++ /dev/null @@ -1,38 +0,0 @@ -import PropTypes from 'prop-types'; -import { PureComponent } from 'react'; - -import { injectIntl, FormattedMessage } from 'react-intl'; - -import ImmutablePropTypes from 'react-immutable-proptypes'; - -import SettingToggle from '../../notifications/components/setting_toggle'; - -class ColumnSettings extends PureComponent { - - static propTypes = { - settings: ImmutablePropTypes.map.isRequired, - onChange: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired, - }; - - render () { - const { settings, onChange } = this.props; - - return ( -
- - -
- } /> -
- -
- } /> -
-
- ); - } - -} - -export default injectIntl(ColumnSettings); diff --git a/app/javascript/mastodon/features/home_timeline/components/column_settings.tsx b/app/javascript/mastodon/features/home_timeline/components/column_settings.tsx new file mode 100644 index 0000000000..477e94c9c5 --- /dev/null +++ b/app/javascript/mastodon/features/home_timeline/components/column_settings.tsx @@ -0,0 +1,66 @@ +/* eslint-disable @typescript-eslint/no-unsafe-call, + @typescript-eslint/no-unsafe-return, + @typescript-eslint/no-unsafe-assignment, + @typescript-eslint/no-unsafe-member-access + -- the settings store is not yet typed */ +import { useCallback } from 'react'; + +import { FormattedMessage } from 'react-intl'; + +import { useAppSelector, useAppDispatch } from 'mastodon/store'; + +import { changeSetting } from '../../../actions/settings'; +import SettingToggle from '../../notifications/components/setting_toggle'; + +export const ColumnSettings: React.FC = () => { + const settings = useAppSelector((state) => state.settings.get('home')); + + const dispatch = useAppDispatch(); + const onChange = useCallback( + (key: string, checked: boolean) => { + void dispatch(changeSetting(['home', ...key], checked)); + }, + [dispatch] + ); + + return ( +
+ + + + +
+ + } + /> +
+ +
+ + } + /> +
+
+ ); +}; diff --git a/app/javascript/mastodon/features/home_timeline/components/explore_prompt.jsx b/app/javascript/mastodon/features/home_timeline/components/explore_prompt.jsx deleted file mode 100644 index 2af85b6d54..0000000000 --- a/app/javascript/mastodon/features/home_timeline/components/explore_prompt.jsx +++ /dev/null @@ -1,25 +0,0 @@ -import React from 'react'; - -import { FormattedMessage } from 'react-intl'; - -import { Link } from 'react-router-dom'; - -import background from 'mastodon/../images/friends-cropped.png'; -import { DismissableBanner } from 'mastodon/components/dismissable_banner'; - - -export const ExplorePrompt = () => ( - - - -

-

- -
-
- - -
-
-
-); diff --git a/app/javascript/mastodon/features/home_timeline/components/explore_prompt.tsx b/app/javascript/mastodon/features/home_timeline/components/explore_prompt.tsx new file mode 100644 index 0000000000..47113d9b8e --- /dev/null +++ b/app/javascript/mastodon/features/home_timeline/components/explore_prompt.tsx @@ -0,0 +1,46 @@ +import { FormattedMessage } from 'react-intl'; + +import { Link } from 'react-router-dom'; + +import background from 'mastodon/../images/friends-cropped.png'; +import { DismissableBanner } from 'mastodon/components/dismissable_banner'; + +export const ExplorePrompt = () => ( + + + +

+ +

+

+ +

+ +
+
+ + + + + + +
+
+
+); diff --git a/app/javascript/mastodon/features/home_timeline/containers/column_settings_container.js b/app/javascript/mastodon/features/home_timeline/containers/column_settings_container.js deleted file mode 100644 index 1ddec6da9c..0000000000 --- a/app/javascript/mastodon/features/home_timeline/containers/column_settings_container.js +++ /dev/null @@ -1,22 +0,0 @@ -import { connect } from 'react-redux'; - -import { changeSetting, saveSettings } from '../../../actions/settings'; -import ColumnSettings from '../components/column_settings'; - -const mapStateToProps = state => ({ - settings: state.getIn(['settings', 'home']), -}); - -const mapDispatchToProps = dispatch => ({ - - onChange (key, checked) { - dispatch(changeSetting(['home', ...key], checked)); - }, - - onSave () { - dispatch(saveSettings()); - }, - -}); - -export default connect(mapStateToProps, mapDispatchToProps)(ColumnSettings); diff --git a/app/javascript/mastodon/features/home_timeline/index.jsx b/app/javascript/mastodon/features/home_timeline/index.jsx index ae98aec0a6..1cd6edd7aa 100644 --- a/app/javascript/mastodon/features/home_timeline/index.jsx +++ b/app/javascript/mastodon/features/home_timeline/index.jsx @@ -22,8 +22,8 @@ import Column from '../../components/column'; import ColumnHeader from '../../components/column_header'; import StatusListContainer from '../ui/containers/status_list_container'; +import { ColumnSettings } from './components/column_settings'; import { ExplorePrompt } from './components/explore_prompt'; -import ColumnSettingsContainer from './containers/column_settings_container'; const messages = defineMessages({ title: { id: 'column.home', defaultMessage: 'Home' }, @@ -191,7 +191,7 @@ class HomeTimeline extends PureComponent { extraButton={announcementsButton} appendContent={hasAnnouncements && showAnnouncements && } > - + {signedIn ? (