diff options
Diffstat (limited to 'app/assets/javascripts/components/features/notifications')
5 files changed, 63 insertions, 62 deletions
diff --git a/app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx b/app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx index 63fe86af6..206b05f91 100644 --- a/app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx +++ b/app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx @@ -1,15 +1,11 @@ +import PropTypes from 'prop-types'; import { defineMessages, injectIntl } from 'react-intl'; const messages = defineMessages({ clear: { id: 'notifications.clear', defaultMessage: 'Clear notifications' } }); -const ClearColumnButton = React.createClass({ - - propTypes: { - onClick: React.PropTypes.func.isRequired, - intl: React.PropTypes.object.isRequired - }, +class ClearColumnButton extends React.Component { render () { const { intl } = this.props; @@ -20,6 +16,11 @@ const ClearColumnButton = React.createClass({ </div> ); } -}) +} + +ClearColumnButton.propTypes = { + onClick: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired +}; export default injectIntl(ClearColumnButton); diff --git a/app/assets/javascripts/components/features/notifications/components/column_settings.jsx b/app/assets/javascripts/components/features/notifications/components/column_settings.jsx index 03bfaa653..41c2e7d36 100644 --- a/app/assets/javascripts/components/features/notifications/components/column_settings.jsx +++ b/app/assets/javascripts/components/features/notifications/components/column_settings.jsx @@ -1,4 +1,4 @@ -import PureRenderMixin from 'react-addons-pure-render-mixin'; +import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import ColumnCollapsable from '../../../components/column_collapsable'; @@ -23,18 +23,7 @@ const rowStyle = { }; -const ColumnSettings = React.createClass({ - - propTypes: { - settings: ImmutablePropTypes.map.isRequired, - onChange: React.PropTypes.func.isRequired, - onSave: React.PropTypes.func.isRequired, - intl: React.PropTypes.shape({ - formatMessage: React.PropTypes.func.isRequired - }).isRequired - }, - - mixins: [PureRenderMixin], +class ColumnSettings extends React.PureComponent { render () { const { settings, intl, onChange, onSave } = this.props; @@ -82,6 +71,15 @@ const ColumnSettings = React.createClass({ ); } -}); +} + +ColumnSettings.propTypes = { + settings: ImmutablePropTypes.map.isRequired, + onChange: PropTypes.func.isRequired, + onSave: PropTypes.func.isRequired, + intl: PropTypes.shape({ + formatMessage: PropTypes.func.isRequired + }).isRequired +}; export default injectIntl(ColumnSettings); diff --git a/app/assets/javascripts/components/features/notifications/components/notification.jsx b/app/assets/javascripts/components/features/notifications/components/notification.jsx index 2a9f2d076..dadc6696a 100644 --- a/app/assets/javascripts/components/features/notifications/components/notification.jsx +++ b/app/assets/javascripts/components/features/notifications/components/notification.jsx @@ -1,4 +1,3 @@ -import PureRenderMixin from 'react-addons-pure-render-mixin'; import ImmutablePropTypes from 'react-immutable-proptypes'; import StatusContainer from '../../../containers/status_container'; import AccountContainer from '../../../containers/account_container'; @@ -11,13 +10,7 @@ const linkStyle = { fontWeight: '500' }; -const Notification = React.createClass({ - - propTypes: { - notification: ImmutablePropTypes.map.isRequired - }, - - mixins: [PureRenderMixin], +class Notification extends React.PureComponent { renderFollow (account, link) { return ( @@ -33,11 +26,11 @@ const Notification = React.createClass({ <AccountContainer id={account.get('id')} withNote={false} /> </div> ); - }, + } renderMention (notification) { return <StatusContainer id={notification.get('status')} />; - }, + } renderFavourite (notification, link) { return ( @@ -53,7 +46,7 @@ const Notification = React.createClass({ <StatusContainer id={notification.get('status')} muted={true} /> </div> ); - }, + } renderReblog (notification, link) { return ( @@ -69,7 +62,7 @@ const Notification = React.createClass({ <StatusContainer id={notification.get('status')} muted={true} /> </div> ); - }, + } render () { // eslint-disable-line consistent-return const { notification } = this.props; @@ -90,6 +83,10 @@ const Notification = React.createClass({ } } -}); +} + +Notification.propTypes = { + notification: ImmutablePropTypes.map.isRequired +}; export default Notification; diff --git a/app/assets/javascripts/components/features/notifications/components/setting_toggle.jsx b/app/assets/javascripts/components/features/notifications/components/setting_toggle.jsx index c4bfad5cd..1c3957651 100644 --- a/app/assets/javascripts/components/features/notifications/components/setting_toggle.jsx +++ b/app/assets/javascripts/components/features/notifications/components/setting_toggle.jsx @@ -1,3 +1,4 @@ +import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import Toggle from 'react-toggle'; @@ -23,10 +24,10 @@ const SettingToggle = ({ settings, settingKey, label, onChange, htmlFor = '' }) SettingToggle.propTypes = { settings: ImmutablePropTypes.map.isRequired, - settingKey: React.PropTypes.array.isRequired, - label: React.PropTypes.node.isRequired, - onChange: React.PropTypes.func.isRequired, - htmlFor: React.PropTypes.string + settingKey: PropTypes.array.isRequired, + label: PropTypes.node.isRequired, + onChange: PropTypes.func.isRequired, + htmlFor: PropTypes.string }; export default SettingToggle; diff --git a/app/assets/javascripts/components/features/notifications/index.jsx b/app/assets/javascripts/components/features/notifications/index.jsx index 74b914ffd..7b9b6d9e4 100644 --- a/app/assets/javascripts/components/features/notifications/index.jsx +++ b/app/assets/javascripts/components/features/notifications/index.jsx @@ -1,5 +1,5 @@ import { connect } from 'react-redux'; -import PureRenderMixin from 'react-addons-pure-render-mixin'; +import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import Column from '../ui/components/column'; import { expandNotifications, clearNotifications, scrollTopNotifications } from '../../actions/notifications'; @@ -28,24 +28,15 @@ const mapStateToProps = state => ({ isUnread: state.getIn(['notifications', 'unread']) > 0 }); -const Notifications = React.createClass({ +class Notifications extends React.PureComponent { - propTypes: { - notifications: ImmutablePropTypes.list.isRequired, - dispatch: React.PropTypes.func.isRequired, - trackScroll: React.PropTypes.bool, - intl: React.PropTypes.object.isRequired, - isLoading: React.PropTypes.bool, - isUnread: React.PropTypes.bool - }, - - getDefaultProps () { - return { - trackScroll: true - }; - }, - - mixins: [PureRenderMixin], + constructor (props, context) { + super(props, context); + this.handleScroll = this.handleScroll.bind(this); + this.handleLoadMore = this.handleLoadMore.bind(this); + this.handleClear = this.handleClear.bind(this); + this.setRef = this.setRef.bind(this); + } handleScroll (e) { const { scrollTop, scrollHeight, clientHeight } = e.target; @@ -59,28 +50,28 @@ const Notifications = React.createClass({ } else { this.props.dispatch(scrollTopNotifications(false)); } - }, + } componentDidUpdate (prevProps) { if (this.node.scrollTop > 0 && (prevProps.notifications.size < this.props.notifications.size && prevProps.notifications.first() !== this.props.notifications.first() && !!this._oldScrollPosition)) { this.node.scrollTop = this.node.scrollHeight - this._oldScrollPosition; } - }, + } handleLoadMore (e) { e.preventDefault(); this.props.dispatch(expandNotifications()); - }, + } handleClear () { if (window.confirm(this.props.intl.formatMessage(messages.confirm))) { this.props.dispatch(clearNotifications()); } - }, + } setRef (c) { this.node = c; - }, + } render () { const { intl, notifications, trackScroll, isLoading, isUnread } = this.props; @@ -137,6 +128,19 @@ const Notifications = React.createClass({ } } -}); +} + +Notifications.propTypes = { + notifications: ImmutablePropTypes.list.isRequired, + dispatch: PropTypes.func.isRequired, + trackScroll: PropTypes.bool, + intl: PropTypes.object.isRequired, + isLoading: PropTypes.bool, + isUnread: PropTypes.bool +}; + +Notifications.defaultProps = { + trackScroll: true +}; export default connect(mapStateToProps)(injectIntl(Notifications)); |