commit: 2991a7cfe685ca9b42230b7030b9e7d0ece94c88 parent: 44a3584e2d54488393e6f50e482ed61d2765e312 Author: Yamagishi Kazutoshi <ykzts@desire.sh> Date: Fri, 12 May 2017 21:44:10 +0900 Use ES Class Fields & Static Properties (#3008) Use ES Class Fields & Static Properties (currently stage 2) for improve class outlook. Added babel-plugin-transform-class-properties as a Babel plugin.Diffstat:
79 files changed, 865 insertions(+), 1155 deletions(-)
diff --git a/.babelrc b/.babelrc @@ -14,6 +14,7 @@ "plugins": [ "syntax-dynamic-import", "transform-object-rest-spread", + "transform-class-properties", [ "react-intl", { diff --git a/app/javascript/mastodon/components/account.js b/app/javascript/mastodon/components/account.js @@ -18,6 +18,15 @@ const messages = defineMessages({ class Account extends ImmutablePureComponent { + static propTypes = { + account: ImmutablePropTypes.map.isRequired, + me: PropTypes.number.isRequired, + onFollow: PropTypes.func.isRequired, + onBlock: PropTypes.func.isRequired, + onMute: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + constructor (props, context) { super(props, context); this.handleFollow = this.handleFollow.bind(this); @@ -81,13 +90,4 @@ class Account extends ImmutablePureComponent { } -Account.propTypes = { - account: ImmutablePropTypes.map.isRequired, - me: PropTypes.number.isRequired, - onFollow: PropTypes.func.isRequired, - onBlock: PropTypes.func.isRequired, - onMute: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -} - export default injectIntl(Account); diff --git a/app/javascript/mastodon/components/attachment_list.js b/app/javascript/mastodon/components/attachment_list.js @@ -5,6 +5,10 @@ const filename = url => url.split('/').pop().split('#')[0].split('?')[0]; class AttachmentList extends React.PureComponent { + static propTypes = { + media: ImmutablePropTypes.list.isRequired + }; + render () { const { media } = this.props; @@ -24,10 +28,7 @@ class AttachmentList extends React.PureComponent { </div> ); } -} -AttachmentList.propTypes = { - media: ImmutablePropTypes.list.isRequired -}; +} export default AttachmentList; diff --git a/app/javascript/mastodon/components/autosuggest_textarea.js b/app/javascript/mastodon/components/autosuggest_textarea.js @@ -32,6 +32,25 @@ const textAtCursorMatchesToken = (str, caretPosition) => { class AutosuggestTextarea extends ImmutablePureComponent { + static propTypes = { + value: PropTypes.string, + suggestions: ImmutablePropTypes.list, + disabled: PropTypes.bool, + placeholder: PropTypes.string, + onSuggestionSelected: PropTypes.func.isRequired, + onSuggestionsClearRequested: PropTypes.func.isRequired, + onSuggestionsFetchRequested: PropTypes.func.isRequired, + onChange: PropTypes.func.isRequired, + onKeyUp: PropTypes.func, + onKeyDown: PropTypes.func, + onPaste: PropTypes.func.isRequired, + autoFocus: PropTypes.bool + }; + + static defaultProps = { + autoFucus: true + }; + constructor (props, context) { super(props, context); this.state = { @@ -194,25 +213,6 @@ class AutosuggestTextarea extends ImmutablePureComponent { ); } -}; - -AutosuggestTextarea.propTypes = { - value: PropTypes.string, - suggestions: ImmutablePropTypes.list, - disabled: PropTypes.bool, - placeholder: PropTypes.string, - onSuggestionSelected: PropTypes.func.isRequired, - onSuggestionsClearRequested: PropTypes.func.isRequired, - onSuggestionsFetchRequested: PropTypes.func.isRequired, - onChange: PropTypes.func.isRequired, - onKeyUp: PropTypes.func, - onKeyDown: PropTypes.func, - onPaste: PropTypes.func.isRequired, - autoFocus: PropTypes.bool -}; - -AutosuggestTextarea.defaultProps = { - autoFucus: true, -}; +} export default AutosuggestTextarea; diff --git a/app/javascript/mastodon/components/avatar.js b/app/javascript/mastodon/components/avatar.js @@ -3,23 +3,31 @@ import PropTypes from 'prop-types'; class Avatar extends React.PureComponent { - constructor (props, context) { - super(props, context); - - this.state = { - hovering: false - }; - - this.handleMouseEnter = this.handleMouseEnter.bind(this); - this.handleMouseLeave = this.handleMouseLeave.bind(this); - } - - handleMouseEnter () { + static propTypes = { + src: PropTypes.string.isRequired, + staticSrc: PropTypes.string, + size: PropTypes.number.isRequired, + style: PropTypes.object, + animate: PropTypes.bool, + inline: PropTypes.bool + }; + + static defaultProps = { + animate: false, + size: 20, + inline: false + }; + + state = { + hovering: true + }; + + handleMouseEnter = () => { if (this.props.animate) return; this.setState({ hovering: true }); } - handleMouseLeave () { + handleMouseLeave = () => { if (this.props.animate) return; this.setState({ hovering: false }); } @@ -59,19 +67,4 @@ class Avatar extends React.PureComponent { } -Avatar.propTypes = { - src: PropTypes.string.isRequired, - staticSrc: PropTypes.string, - size: PropTypes.number.isRequired, - style: PropTypes.object, - animate: PropTypes.bool, - inline: PropTypes.bool -}; - -Avatar.defaultProps = { - animate: false, - size: 20, - inline: false -}; - export default Avatar; diff --git a/app/javascript/mastodon/components/avatar_overlay.js b/app/javascript/mastodon/components/avatar_overlay.js @@ -2,6 +2,11 @@ import React from 'react'; import PropTypes from 'prop-types'; class AvatarOverlay extends React.PureComponent { + static propTypes = { + staticSrc: PropTypes.string.isRequired, + overlaySrc: PropTypes.string.isRequired + }; + render() { const {staticSrc, overlaySrc} = this.props; @@ -20,11 +25,7 @@ class AvatarOverlay extends React.PureComponent { </div> ); } -} -AvatarOverlay.propTypes = { - staticSrc: PropTypes.string.isRequired, - overlaySrc: PropTypes.string.isRequired, -}; +} export default AvatarOverlay; diff --git a/app/javascript/mastodon/components/button.js b/app/javascript/mastodon/components/button.js @@ -3,12 +3,22 @@ import PropTypes from 'prop-types'; class Button extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - } - - handleClick (e) { + static propTypes = { + text: PropTypes.node, + onClick: PropTypes.func, + disabled: PropTypes.bool, + block: PropTypes.bool, + secondary: PropTypes.bool, + size: PropTypes.number, + style: PropTypes.object, + children: PropTypes.node + }; + + static defaultProps = { + size: 36 + }; + + handleClick = (e) => { if (!this.props.disabled) { this.props.onClick(); } @@ -32,19 +42,4 @@ class Button extends React.PureComponent { } -Button.propTypes = { - text: PropTypes.node, - onClick: PropTypes.func, - disabled: PropTypes.bool, - block: PropTypes.bool, - secondary: PropTypes.bool, - size: PropTypes.number, - style: PropTypes.object, - children: PropTypes.node -}; - -Button.defaultProps = { - size: 36 -}; - export default Button; diff --git a/app/javascript/mastodon/components/column_back_button.js b/app/javascript/mastodon/components/column_back_button.js @@ -4,12 +4,11 @@ import PropTypes from 'prop-types'; class ColumnBackButton extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - } + static contextTypes = { + router: PropTypes.object + }; - handleClick () { + handleClick = () => { if (window.history && window.history.length === 1) this.context.router.push("/"); else this.context.router.goBack(); } @@ -23,10 +22,6 @@ class ColumnBackButton extends React.PureComponent { ); } -}; - -ColumnBackButton.contextTypes = { - router: PropTypes.object -}; +} export default ColumnBackButton; diff --git a/app/javascript/mastodon/components/column_back_button_slim.js b/app/javascript/mastodon/components/column_back_button_slim.js @@ -4,12 +4,11 @@ import PropTypes from 'prop-types'; class ColumnBackButtonSlim extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - } + static contextTypes = { + router: PropTypes.object + }; - handleClick () { + handleClick = () => { this.context.router.push('/'); } @@ -25,8 +24,4 @@ class ColumnBackButtonSlim extends React.PureComponent { } } -ColumnBackButtonSlim.contextTypes = { - router: PropTypes.object -}; - export default ColumnBackButtonSlim; diff --git a/app/javascript/mastodon/components/column_collapsable.js b/app/javascript/mastodon/components/column_collapsable.js @@ -4,16 +4,19 @@ import PropTypes from 'prop-types'; class ColumnCollapsable extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.state = { - collapsed: true - }; - - this.handleToggleCollapsed = this.handleToggleCollapsed.bind(this); - } - - handleToggleCollapsed () { + static propTypes = { + icon: PropTypes.string.isRequired, + title: PropTypes.string, + fullHeight: PropTypes.number.isRequired, + children: PropTypes.node, + onCollapse: PropTypes.func + }; + + state = { + collapsed: true + }; + + handleToggleCollapsed = () => { const currentState = this.state.collapsed; this.setState({ collapsed: !currentState }); @@ -46,12 +49,4 @@ class ColumnCollapsable extends React.PureComponent { } } -ColumnCollapsable.propTypes = { - icon: PropTypes.string.isRequired, - title: PropTypes.string, - fullHeight: PropTypes.number.isRequired, - children: PropTypes.node, - onCollapse: PropTypes.func -}; - export default ColumnCollapsable; diff --git a/app/javascript/mastodon/components/display_name.js b/app/javascript/mastodon/components/display_name.js @@ -5,6 +5,10 @@ import emojify from '../emoji'; class DisplayName extends React.PureComponent { + static propTypes = { + account: ImmutablePropTypes.map.isRequired + }; + render () { const displayName = this.props.account.get('display_name').length === 0 ? this.props.account.get('username') : this.props.account.get('display_name'); const displayNameHTML = { __html: emojify(escapeTextContentForBrowser(displayName)) }; @@ -16,10 +20,6 @@ class DisplayName extends React.PureComponent { ); } -}; - -DisplayName.propTypes = { - account: ImmutablePropTypes.map.isRequired } export default DisplayName; diff --git a/app/javascript/mastodon/components/dropdown_menu.js b/app/javascript/mastodon/components/dropdown_menu.js @@ -4,20 +4,27 @@ import PropTypes from 'prop-types'; class DropdownMenu extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.state = { - direction: 'left' - }; - this.setRef = this.setRef.bind(this); - this.renderItem = this.renderItem.bind(this); - } + static propTypes = { + icon: PropTypes.string.isRequired, + items: PropTypes.array.isRequired, + size: PropTypes.number.isRequired, + direction: PropTypes.string, + ariaLabel: PropTypes.string + }; + + static defaultProps = { + ariaLabel: "Menu" + }; + + state = { + direction: 'left' + }; - setRef (c) { + setRef = (c) => { this.dropdown = c; } - handleClick (i, e) { + handleClick = (i, e) => { const { action } = this.props.items[i]; if (typeof action === 'function') { @@ -27,7 +34,7 @@ class DropdownMenu extends React.PureComponent { } } - renderItem (item, i) { + renderItem = (item, i) => { if (item === null) { return <li key={ 'sep' + i } className='dropdown__sep' />; } @@ -64,16 +71,4 @@ class DropdownMenu extends React.PureComponent { } -DropdownMenu.propTypes = { - icon: PropTypes.string.isRequired, - items: PropTypes.array.isRequired, - size: PropTypes.number.isRequired, - direction: PropTypes.string, - ariaLabel: PropTypes.string -}; - -DropdownMenu.defaultProps = { - ariaLabel: "Menu" -}; - export default DropdownMenu; diff --git a/app/javascript/mastodon/components/extended_video_player.js b/app/javascript/mastodon/components/extended_video_player.js @@ -3,13 +3,14 @@ import PropTypes from 'prop-types'; class ExtendedVideoPlayer extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleLoadedData = this.handleLoadedData.bind(this); - this.setRef = this.setRef.bind(this); - } - - handleLoadedData () { + static propTypes = { + src: PropTypes.string.isRequired, + time: PropTypes.number, + controls: PropTypes.bool.isRequired, + muted: PropTypes.bool.isRequired + }; + + handleLoadedData = () => { if (this.props.time) { this.video.currentTime = this.props.time; } @@ -23,7 +24,7 @@ class ExtendedVideoPlayer extends React.PureComponent { this.video.removeEventListener('loadeddata', this.handleLoadedData); } - setRef (c) { + setRef = (c) => { this.video = c; } @@ -44,11 +45,4 @@ class ExtendedVideoPlayer extends React.PureComponent { } -ExtendedVideoPlayer.propTypes = { - src: PropTypes.string.isRequired, - time: PropTypes.number, - controls: PropTypes.bool.isRequired, - muted: PropTypes.bool.isRequired -}; - export default ExtendedVideoPlayer; diff --git a/app/javascript/mastodon/components/icon_button.js b/app/javascript/mastodon/components/icon_button.js @@ -4,12 +4,30 @@ import PropTypes from 'prop-types'; class IconButton extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - } - - handleClick (e) { + static propTypes = { + className: PropTypes.string, + title: PropTypes.string.isRequired, + icon: PropTypes.string.isRequired, + onClick: PropTypes.func, + size: PropTypes.number, + active: PropTypes.bool, + style: PropTypes.object, + activeStyle: PropTypes.object, + disabled: PropTypes.bool, + inverted: PropTypes.bool, + animate: PropTypes.bool, + overlay: PropTypes.bool + }; + + static defaultProps = { + size: 18, + active: false, + disabled: false, + animate: false, + overlay: false + }; + + handleClick = (e) => { e.preventDefault(); if (!this.props.disabled) { @@ -70,27 +88,4 @@ class IconButton extends React.PureComponent { } -IconButton.propTypes = { - className: PropTypes.string, - title: PropTypes.string.isRequired, - icon: PropTypes.string.isRequired, - onClick: PropTypes.func, - size: PropTypes.number, - active: PropTypes.bool, - style: PropTypes.object, - activeStyle: PropTypes.object, - disabled: PropTypes.bool, - inverted: PropTypes.bool, - animate: PropTypes.bool, - overlay: PropTypes.bool -}; - -IconButton.defaultProps = { - size: 18, - active: false, - disabled: false, - animate: false, - overlay: false -}; - export default IconButton; diff --git a/app/javascript/mastodon/components/media_gallery.js b/app/javascript/mastodon/components/media_gallery.js @@ -10,12 +10,16 @@ const messages = defineMessages({ }); class Item extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - } - handleClick (e) { + static propTypes = { + attachment: ImmutablePropTypes.map.isRequired, + index: PropTypes.number.isRequired, + size: PropTypes.number.isRequired, + onClick: PropTypes.func.isRequired, + autoPlayGif: PropTypes.bool.isRequired + }; + + handleClick = (e) => { const { index, onClick } = this.props; if (e.button === 0) { @@ -119,30 +123,26 @@ class Item extends React.PureComponent { } -Item.propTypes = { - attachment: ImmutablePropTypes.map.isRequired, - index: PropTypes.number.isRequired, - size: PropTypes.number.isRequired, - onClick: PropTypes.func.isRequired, - autoPlayGif: PropTypes.bool.isRequired -}; - class MediaGallery extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.state = { - visible: !props.sensitive - }; - this.handleOpen = this.handleOpen.bind(this); - this.handleClick = this.handleClick.bind(this); - } + static propTypes = { + sensitive: PropTypes.bool, + media: ImmutablePropTypes.list.isRequired, + height: PropTypes.number.isRequired, + onOpenMedia: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + autoPlayGif: PropTypes.bool.isRequired + }; + + state = { + visible: !props.sensitive + }; - handleOpen (e) { + handleOpen = (e) => { this.setState({ visible: !this.state.visible }); } - handleClick (index) { + handleClick = (index) => { this.props.onOpenMedia(this.props.media, index); } @@ -184,13 +184,4 @@ class MediaGallery extends React.PureComponent { } -MediaGallery.propTypes = { - sensitive: PropTypes.bool, - media: ImmutablePropTypes.list.isRequired, - height: PropTypes.number.isRequired, - onOpenMedia: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired, - autoPlayGif: PropTypes.bool.isRequired -}; - export default injectIntl(MediaGallery); diff --git a/app/javascript/mastodon/components/permalink.js b/app/javascript/mastodon/components/permalink.js @@ -3,12 +3,18 @@ import PropTypes from 'prop-types'; class Permalink extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - } - - handleClick (e) { + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + className: PropTypes.string, + href: PropTypes.string.isRequired, + to: PropTypes.string.isRequired, + children: PropTypes.node + }; + + handleClick = (e) => { if (e.button === 0) { e.preventDefault(); this.context.router.push(this.props.to); @@ -27,15 +33,4 @@ class Permalink extends React.PureComponent { } -Permalink.contextTypes = { - router: PropTypes.object -}; - -Permalink.propTypes = { - className: PropTypes.string, - href: PropTypes.string.isRequired, - to: PropTypes.string.isRequired, - children: PropTypes.node -}; - export default Permalink; diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js @@ -17,18 +17,33 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; class Status extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - this.handleAccountClick = this.handleAccountClick.bind(this); - } - - handleClick () { + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + status: ImmutablePropTypes.map, + account: ImmutablePropTypes.map, + wrapped: PropTypes.bool, + onReply: PropTypes.func, + onFavourite: PropTypes.func, + onReblog: PropTypes.func, + onDelete: PropTypes.func, + onOpenMedia: PropTypes.func, + onOpenVideo: PropTypes.func, + onBlock: PropTypes.func, + me: PropTypes.number, + boostModal: PropTypes.bool, + autoPlayGif: PropTypes.bool, + muted: PropTypes.bool + }; + + handleClick = () => { const { status } = this.props; this.context.router.push(`/statuses/${status.getIn(['reblog', 'id'], status.get('id'))}`); } - handleAccountClick (id, e) { + handleAccountClick = (id, e) => { if (e.button === 0) { e.preventDefault(); this.context.router.push(`/accounts/${id}`); @@ -108,25 +123,4 @@ class Status extends ImmutablePureComponent { } -Status.contextTypes = { - router: PropTypes.object -}; - -Status.propTypes = { - status: ImmutablePropTypes.map, - account: ImmutablePropTypes.map, - wrapped: PropTypes.bool, - onReply: PropTypes.func, - onFavourite: PropTypes.func, - onReblog: PropTypes.func, - onDelete: PropTypes.func, - onOpenMedia: PropTypes.func, - onOpenVideo: PropTypes.func, - onBlock: PropTypes.func, - me: PropTypes.number, - boostModal: PropTypes.bool, - autoPlayGif: PropTypes.bool, - muted: PropTypes.bool -}; - export default Status; diff --git a/app/javascript/mastodon/components/status_action_bar.js b/app/javascript/mastodon/components/status_action_bar.js @@ -21,52 +21,57 @@ const messages = defineMessages({ class StatusActionBar extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleReplyClick = this.handleReplyClick.bind(this); - this.handleFavouriteClick = this.handleFavouriteClick.bind(this); - this.handleReblogClick = this.handleReblogClick.bind(this); - this.handleDeleteClick = this.handleDeleteClick.bind(this); - this.handleMentionClick = this.handleMentionClick.bind(this); - this.handleMuteClick = this.handleMuteClick.bind(this); - this.handleBlockClick = this.handleBlockClick.bind(this); - this.handleOpen = this.handleOpen.bind(this); - this.handleReport = this.handleReport.bind(this); - } - - handleReplyClick () { + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + status: ImmutablePropTypes.map.isRequired, + onReply: PropTypes.func, + onFavourite: PropTypes.func, + onReblog: PropTypes.func, + onDelete: PropTypes.func, + onMention: PropTypes.func, + onMute: PropTypes.func, + onBlock: PropTypes.func, + onReport: PropTypes.func, + me: PropTypes.number.isRequired, + intl: PropTypes.object.isRequired + }; + + handleReplyClick = () => { this.props.onReply(this.props.status, this.context.router); } - handleFavouriteClick () { + handleFavouriteClick = () => { this.props.onFavourite(this.props.status); } - handleReblogClick (e) { + handleReblogClick = (e) => { this.props.onReblog(this.props.status, e); } - handleDeleteClick () { + handleDeleteClick = () => { this.props.onDelete(this.props.status); } - handleMentionClick () { + handleMentionClick = () => { this.props.onMention(this.props.status.get('account'), this.context.router); } - handleMuteClick () { + handleMuteClick = () => { this.props.onMute(this.props.status.get('account')); } - handleBlockClick () { + handleBlockClick = () => { this.props.onBlock(this.props.status.get('account')); } - handleOpen () { + handleOpen = () => { this.context.router.push(`/statuses/${this.props.status.get('id')}`); } - handleReport () { + handleReport = () => { this.props.onReport(this.props.status); this.context.router.push('/report'); } @@ -122,22 +127,4 @@ class StatusActionBar extends React.PureComponent { } -StatusActionBar.contextTypes = { - router: PropTypes.object -}; - -StatusActionBar.propTypes = { - status: ImmutablePropTypes.map.isRequired, - onReply: PropTypes.func, - onFavourite: PropTypes.func, - onReblog: PropTypes.func, - onDelete: PropTypes.func, - onMention: PropTypes.func, - onMute: PropTypes.func, - onBlock: PropTypes.func, - onReport: PropTypes.func, - me: PropTypes.number.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(StatusActionBar); diff --git a/app/javascript/mastodon/components/status_content.js b/app/javascript/mastodon/components/status_content.js @@ -9,19 +9,17 @@ import Permalink from './permalink'; class StatusContent extends React.PureComponent { - constructor (props, context) { - super(props, context); - - this.state = { - hidden: true - }; - - this.onMentionClick = this.onMentionClick.bind(this); - this.onHashtagClick = this.onHashtagClick.bind(this); - this.handleMouseDown = this.handleMouseDown.bind(this) - this.handleMouseUp = this.handleMouseUp.bind(this); - this.handleSpoilerClick = this.handleSpoilerClick.bind(this); - this.setRef = this.setRef.bind(this); + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + status: ImmutablePropTypes.map.isRequired, + onClick: PropTypes.func + }; + + state = { + hidden: true }; componentDidMount () { @@ -46,14 +44,14 @@ class StatusContent extends React.PureComponent { } } - onMentionClick (mention, e) { + onMentionClick = (mention, e) => { if (e.button === 0) { e.preventDefault(); this.context.router.push(`/accounts/${mention.get('id')}`); } } - onHashtagClick (hashtag, e) { + onHashtagClick = (hashtag, e) => { hashtag = hashtag.replace(/^#/, '').toLowerCase(); if (e.button === 0) { @@ -62,11 +60,11 @@ class StatusContent extends React.PureComponent { } } - handleMouseDown (e) { + handleMouseDown = (e) => { this.startXY = [e.clientX, e.clientY]; } - handleMouseUp (e) { + handleMouseUp = (e) => { const [ startX, startY ] = this.startXY; const [ deltaX, deltaY ] = [Math.abs(e.clientX - startX), Math.abs(e.clientY - startY)]; @@ -81,12 +79,12 @@ class StatusContent extends React.PureComponent { this.startXY = null; } - handleSpoilerClick (e) { + handleSpoilerClick = (e) => { e.preventDefault(); this.setState({ hidden: !this.state.hidden }); } - setRef (c) { + setRef = (c) => { this.node = c; } @@ -158,13 +156,4 @@ class StatusContent extends React.PureComponent { } -StatusContent.contextTypes = { - router: PropTypes.object -}; - -StatusContent.propTypes = { - status: ImmutablePropTypes.map.isRequired, - onClick: PropTypes.func -}; - export default StatusContent; diff --git a/app/javascript/mastodon/components/status_list.js b/app/javascript/mastodon/components/status_list.js @@ -9,14 +9,25 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; class StatusList extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleScroll = this.handleScroll.bind(this); - this.setRef = this.setRef.bind(this); - this.handleLoadMore = this.handleLoadMore.bind(this); - } - - handleScroll (e) { + static propTypes = { + scrollKey: PropTypes.string.isRequired, + statusIds: ImmutablePropTypes.list.isRequired, + onScrollToBottom: PropTypes.func, + onScrollToTop: PropTypes.func, + onScroll: PropTypes.func, + shouldUpdateScroll: PropTypes.func, + isLoading: PropTypes.bool, + isUnread: PropTypes.bool, + hasMore: PropTypes.bool, + prepend: PropTypes.node, + emptyMessage: PropTypes.node + }; + + static defaultProps = { + trackScroll: true + }; + + handleScroll = (e) => { const { scrollTop, scrollHeight, clientHeight } = e.target; const offset = scrollHeight - scrollTop - clientHeight; this._oldScrollPosition = scrollHeight - scrollTop; @@ -52,11 +63,11 @@ class StatusList extends ImmutablePureComponent { this.node.removeEventListener('scroll', this.handleScroll); } - setRef (c) { + setRef = (c) => { this.node = c; } - handleLoadMore (e) { + handleLoadMore = (e) => { e.preventDefault(); this.props.onScrollToBottom(); } @@ -109,22 +120,4 @@ class StatusList extends ImmutablePureComponent { } -StatusList.propTypes = { - scrollKey: PropTypes.string.isRequired, - statusIds: ImmutablePropTypes.list.isRequired, - onScrollToBottom: PropTypes.func, - onScrollToTop: PropTypes.func, - onScroll: PropTypes.func, - shouldUpdateScroll: PropTypes.func, - isLoading: PropTypes.bool, - isUnread: PropTypes.bool, - hasMore: PropTypes.bool, - prepend: PropTypes.node, - emptyMessage: PropTypes.node -}; - -StatusList.defaultProps = { - trackScroll: true -}; - export default StatusList; diff --git a/app/javascript/mastodon/components/video_player.js b/app/javascript/mastodon/components/video_player.js @@ -13,31 +13,34 @@ const messages = defineMessages({ class VideoPlayer extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.state = { - visible: !this.props.sensitive, - preview: true, - muted: true, - hasAudio: true, - videoError: false - }; - - this.handleClick = this.handleClick.bind(this); - this.handleVideoClick = this.handleVideoClick.bind(this); - this.handleOpen = this.handleOpen.bind(this); - this.handleVisibility = this.handleVisibility.bind(this); - this.handleExpand = this.handleExpand.bind(this); - this.setRef = this.setRef.bind(this); - this.handleLoadedData = this.handleLoadedData.bind(this); - this.handleVideoError = this.handleVideoError.bind(this); - } - - handleClick () { + static propTypes = { + media: ImmutablePropTypes.map.isRequired, + width: PropTypes.number, + height: PropTypes.number, + sensitive: PropTypes.bool, + intl: PropTypes.object.isRequired, + autoplay: PropTypes.bool, + onOpenVideo: PropTypes.func.isRequired + }; + + static defaultProps = { + width: 239, + height: 110 + }; + + state = { + visible: !this.props.sensitive, + preview: true, + muted: true, + hasAudio: true, + videoError: false + }; + + handleClick = () => { this.setState({ muted: !this.state.muted }); } - handleVideoClick (e) { + handleVideoClick = (e) => { e.stopPropagation(); const node = this.video; @@ -49,33 +52,33 @@ class VideoPlayer extends React.PureComponent { } } - handleOpen () { + handleOpen = () => { this.setState({ preview: !this.state.preview }); } - handleVisibility () { + handleVisibility = () => { this.setState({ visible: !this.state.visible, preview: true }); } - handleExpand () { + handleExpand = () => { this.video.pause(); this.props.onOpenVideo(this.props.media, this.video.currentTime); } - setRef (c) { + setRef = (c) => { this.video = c; } - handleLoadedData () { + handleLoadedData = () => { if (('WebkitAppearance' in document.documentElement.style && this.video.audioTracks.length === 0) || this.video.mozHasAudio === false) { this.setState({ hasAudio: false }); } } - handleVideoError () { + handleVideoError = () => { this.setState({ videoError: true }); } @@ -191,19 +194,4 @@ class VideoPlayer extends React.PureComponent { } -VideoPlayer.propTypes = { - media: ImmutablePropTypes.map.isRequired, - width: PropTypes.number, - height: PropTypes.number, - sensitive: PropTypes.bool, - intl: PropTypes.object.isRequired, - autoplay: PropTypes.bool, - onOpenVideo: PropTypes.func.isRequired -}; - -VideoPlayer.defaultProps = { - width: 239, - height: 110 -}; - export default injectIntl(VideoPlayer); diff --git a/app/javascript/mastodon/features/account/components/action_bar.js b/app/javascript/mastodon/features/account/components/action_bar.js @@ -20,6 +20,17 @@ const messages = defineMessages({ class ActionBar extends React.PureComponent { + static propTypes = { + account: ImmutablePropTypes.map.isRequired, + me: PropTypes.number.isRequired, + onFollow: PropTypes.func, + onBlock: PropTypes.func.isRequired, + onMention: PropTypes.func.isRequired, + onReport: PropTypes.func.isRequired, + onMute: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + render () { const { account, me, intl } = this.props; @@ -79,15 +90,4 @@ class ActionBar extends React.PureComponent { } -ActionBar.propTypes = { - account: ImmutablePropTypes.map.isRequired, - me: PropTypes.number.isRequired, - onFollow: PropTypes.func, - onBlock: PropTypes.func.isRequired, - onMention: PropTypes.func.isRequired, - onReport: PropTypes.func.isRequired, - onMute: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(ActionBar); diff --git a/app/javascript/mastodon/features/account/components/header.js b/app/javascript/mastodon/features/account/components/header.js @@ -25,23 +25,21 @@ const makeMapStateToProps = () => { class Avatar extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); + static propTypes = { + account: ImmutablePropTypes.map.isRequired, + autoPlayGif: PropTypes.bool.isRequired + }; - this.state = { - isHovered: false - }; + state = { + isHovered: false + }; - this.handleMouseOver = this.handleMouseOver.bind(this); - this.handleMouseOut = this.handleMouseOut.bind(this); - } - - handleMouseOver () { + handleMouseOver = () => { if (this.state.isHovered) return; this.setState({ isHovered: true }); } - handleMouseOut () { + handleMouseOut = () => { if (!this.state.isHovered) return; this.setState({ isHovered: false }); } @@ -71,13 +69,16 @@ class Avatar extends ImmutablePureComponent { } -Avatar.propTypes = { - account: ImmutablePropTypes.map.isRequired, - autoPlayGif: PropTypes.bool.isRequired -}; - class Header extends ImmutablePureComponent { + static propTypes = { + account: ImmutablePropTypes.map, + me: PropTypes.number.isRequired, + onFollow: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + autoPlayGif: PropTypes.bool.isRequired + }; + render () { const { account, me, intl } = this.props; @@ -139,12 +140,4 @@ class Header extends ImmutablePureComponent { } -Header.propTypes = { - account: ImmutablePropTypes.map, - me: PropTypes.number.isRequired, - onFollow: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired, - autoPlayGif: PropTypes.bool.isRequired -}; - export default connect(makeMapStateToProps)(injectIntl(Header)); diff --git a/app/javascript/mastodon/features/account_timeline/components/header.js b/app/javascript/mastodon/features/account_timeline/components/header.js @@ -8,33 +8,38 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; class Header extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleFollow = this.handleFollow.bind(this); - this.handleBlock = this.handleBlock.bind(this); - this.handleMention = this.handleMention.bind(this); - this.handleReport = this.handleReport.bind(this); - this.handleMute = this.handleMute.bind(this); - } + static propTypes = { + account: ImmutablePropTypes.map, + me: PropTypes.number.isRequired, + onFollow: PropTypes.func.isRequired, + onBlock: PropTypes.func.isRequired, + onMention: PropTypes.func.isRequired, + onReport: PropTypes.func.isRequired, + onMute: PropTypes.func.isRequired + }; + + static contextTypes = { + router: PropTypes.object + }; - handleFollow () { + handleFollow = () => { this.props.onFollow(this.props.account); } - handleBlock () { + handleBlock = () => { this.props.onBlock(this.props.account); } - handleMention () { + handleMention = () => { this.props.onMention(this.props.account, this.context.router); } - handleReport () { + handleReport = () => { this.props.onReport(this.props.account); this.context.router.push('/report'); } - handleMute() { + handleMute = () => { this.props.onMute(this.props.account); } @@ -64,20 +69,7 @@ class Header extends ImmutablePureComponent { </div> ); } -} -Header.propTypes = { - account: ImmutablePropTypes.map, - me: PropTypes.number.isRequired, - onFollow: PropTypes.func.isRequired, - onBlock: PropTypes.func.isRequired, - onMention: PropTypes.func.isRequired, - onReport: PropTypes.func.isRequired, - onMute: PropTypes.func.isRequired -}; - -Header.contextTypes = { - router: PropTypes.object -}; +} export default Header; diff --git a/app/javascript/mastodon/features/account_timeline/index.js b/app/javascript/mastodon/features/account_timeline/index.js @@ -24,24 +24,28 @@ const mapStateToProps = (state, props) => ({ class AccountTimeline extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleScrollToBottom = this.handleScrollToBottom.bind(this); - } + static propTypes = { + params: PropTypes.object.isRequired, + dispatch: PropTypes.func.isRequired, + statusIds: ImmutablePropTypes.list, + isLoading: PropTypes.bool, + hasMore: PropTypes.bool, + me: PropTypes.number.isRequired + }; componentWillMount () { this.props.dispatch(fetchAccount(Number(this.props.params.accountId))); this.props.dispatch(fetchAccountTimeline(Number(this.props.params.accountId))); } - componentWillReceiveProps(nextProps) { + componentWillReceiveProps (nextProps) { if (nextProps.params.accountId !== this.props.params.accountId && nextProps.params.accountId) { this.props.dispatch(fetchAccount(Number(nextProps.params.accountId))); this.props.dispatch(fetchAccountTimeline(Number(nextProps.params.accountId))); } } - handleScrollToBottom () { + handleScrollToBottom = () => { if (!this.props.isLoading && this.props.hasMore) { this.props.dispatch(expandAccountTimeline(Number(this.props.params.accountId))); } @@ -77,13 +81,4 @@ class AccountTimeline extends ImmutablePureComponent { } -AccountTimeline.propTypes = { - params: PropTypes.object.isRequired, - dispatch: PropTypes.func.isRequired, - statusIds: ImmutablePropTypes.list, - isLoading: PropTypes.bool, - hasMore: PropTypes.bool, - me: PropTypes.number.isRequired -}; - export default connect(mapStateToProps)(AccountTimeline); diff --git a/app/javascript/mastodon/features/blocks/index.js b/app/javascript/mastodon/features/blocks/index.js @@ -21,6 +21,13 @@ const mapStateToProps = state => ({ class Blocks extends ImmutablePureComponent { + static propTypes = { + params: PropTypes.object.isRequired, + dispatch: PropTypes.func.isRequired, + accountIds: ImmutablePropTypes.list, + intl: PropTypes.object.isRequired + }; + constructor (props, context) { super(props, context); this.handleScroll = this.handleScroll.bind(this); @@ -64,11 +71,4 @@ class Blocks extends ImmutablePureComponent { } } -Blocks.propTypes = { - params: PropTypes.object.isRequired, - dispatch: PropTypes.func.isRequired, - accountIds: ImmutablePropTypes.list, - intl: PropTypes.object.isRequired -}; - export default connect(mapStateToProps)(injectIntl(Blocks)); diff --git a/app/javascript/mastodon/features/community_timeline/index.js b/app/javascript/mastodon/features/community_timeline/index.js @@ -28,6 +28,14 @@ let subscription; class CommunityTimeline extends React.PureComponent { + static propTypes = { + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + streamingAPIBaseURL: PropTypes.string.isRequired, + accessToken: PropTypes.string.isRequired, + hasUnread: PropTypes.bool + }; + componentDidMount () { const { dispatch, streamingAPIBaseURL, accessToken } = this.props; @@ -85,12 +93,4 @@ class CommunityTimeline extends React.PureComponent { } -CommunityTimeline.propTypes = { - dispatch: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired, - streamingAPIBaseURL: PropTypes.string.isRequired, - accessToken: PropTypes.string.isRequired, - hasUnread: PropTypes.bool -}; - export default connect(mapStateToProps)(injectIntl(CommunityTimeline)); diff --git a/app/javascript/mastodon/features/compose/components/autosuggest_account.js b/app/javascript/mastodon/features/compose/components/autosuggest_account.js @@ -6,6 +6,10 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; class AutosuggestAccount extends ImmutablePureComponent { + static propTypes = { + account: ImmutablePropTypes.map.isRequired + }; + render () { const { account } = this.props; @@ -19,8 +23,4 @@ class AutosuggestAccount extends ImmutablePureComponent { } -AutosuggestAccount.propTypes = { - account: ImmutablePropTypes.map.isRequired -}; - export default AutosuggestAccount; diff --git a/app/javascript/mastodon/features/compose/components/character_counter.js b/app/javascript/mastodon/features/compose/components/character_counter.js @@ -4,6 +4,11 @@ import { length } from 'stringz'; class CharacterCounter extends React.PureComponent { + static propTypes = { + text: PropTypes.string.isRequired, + max: PropTypes.number.isRequired + }; + checkRemainingText (diff) { if (diff < 0) { return <span className='character-counter character-counter--over'>{diff}</span>; @@ -19,9 +24,4 @@ class CharacterCounter extends React.PureComponent { } -CharacterCounter.propTypes = { - text: PropTypes.string.isRequired, - max: PropTypes.number.isRequired -} - export default CharacterCounter; diff --git a/app/javascript/mastodon/features/compose/components/compose_form.js b/app/javascript/mastodon/features/compose/components/compose_form.js @@ -27,48 +27,63 @@ const messages = defineMessages({ class ComposeForm extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleChange = this.handleChange.bind(this); - this.handleKeyDown = this.handleKeyDown.bind(this); - this.handleSubmit = this.handleSubmit.bind(this); - this.onSuggestionsClearRequested = this.onSuggestionsClearRequested.bind(this); - this.onSuggestionsFetchRequested = debounce(this.onSuggestionsFetchRequested.bind(this), 500); - this.onSuggestionSelected = this.onSuggestionSelected.bind(this); - this.handleChangeSpoilerText = this.handleChangeSpoilerText.bind(this); - this.setAutosuggestTextarea = this.setAutosuggestTextarea.bind(this); - this.handleEmojiPick = this.handleEmojiPick.bind(this); - } - - handleChange (e) { + static propTypes = { + intl: PropTypes.object.isRequired, + text: PropTypes.string.isRequired, + suggestion_token: PropTypes.string, + suggestions: ImmutablePropTypes.list, + spoiler: PropTypes.bool, + privacy: PropTypes.string, + spoiler_text: PropTypes.string, + focusDate: PropTypes.instanceOf(Date), + preselectDate: PropTypes.instanceOf(Date), + is_submitting: PropTypes.bool, + is_uploading: PropTypes.bool, + me: PropTypes.number, + onChange: PropTypes.func.isRequired, + onSubmit: PropTypes.func.isRequired, + onClearSuggestions: PropTypes.func.isRequired, + onFetchSuggestions: PropTypes.func.isRequired, + onSuggestionSelected: PropTypes.func.isRequired, + onChangeSpoilerText: PropTypes.func.isRequired, + onPaste: PropTypes.func.isRequired, + onPickEmoji: PropTypes.func.isRequired, + showSearch: PropTypes.bool, + }; + + static defaultProps = { + showSearch: false + }; + + handleChange = (e) => { this.props.onChange(e.target.value); } - handleKeyDown (e) { + handleKeyDown = (e) => { if (e.keyCode === 13 && (e.ctrlKey || e.metaKey)) { this.handleSubmit(); } } - handleSubmit () { + handleSubmit = () => { this.autosuggestTextarea.reset(); this.props.onSubmit(); } - onSuggestionsClearRequested () { + onSuggestionsClearRequested = () => { this.props.onClearSuggestions(); } - onSuggestionsFetchRequested (token) { + onSuggestionsFetchRequested = (token) => { this.props.onFetchSuggestions(token); } - onSuggestionSelected (tokenStart, token, value) { + onSuggestionSelected = (tokenStart, token, value) => { this._restoreCaret = null; this.props.onSuggestionSelected(tokenStart, token, value); } - handleChangeSpoilerText (e) { + handleChangeSpoilerText = (e) => { this.props.onChangeSpoilerText(e.target.value); } @@ -107,11 +122,11 @@ class ComposeForm extends ImmutablePureComponent { } } - setAutosuggestTextarea (c) { + setAutosuggestTextarea = (c) => { this.autosuggestTextarea = c; } - handleEmojiPick (data) { + handleEmojiPick = (data) => { const position = this.autosuggestTextarea.textarea.selectionStart; this._restoreCaret = position + data.shortname.length + 1; this.props.onPickEmoji(position, data); @@ -185,32 +200,4 @@ class ComposeForm extends ImmutablePureComponent { } -ComposeForm.propTypes = { - intl: PropTypes.object.isRequired, - text: PropTypes.string.isRequired, - suggestion_token: PropTypes.string, - suggestions: ImmutablePropTypes.list, - spoiler: PropTypes.bool, - privacy: PropTypes.string, - spoiler_text: PropTypes.string, - focusDate: PropTypes.instanceOf(Date), - preselectDate: PropTypes.instanceOf(Date), - is_submitting: PropTypes.bool, - is_uploading: PropTypes.bool, - me: PropTypes.number, - onChange: PropTypes.func.isRequired, - onSubmit: PropTypes.func.isRequired, - onClearSuggestions: PropTypes.func.isRequired, - onFetchSuggestions: PropTypes.func.isRequired, - onSuggestionSelected: PropTypes.func.isRequired, - onChangeSpoilerText: PropTypes.func.isRequired, - onPaste: PropTypes.func.isRequired, - onPickEmoji: PropTypes.func.isRequired, - showSearch: PropTypes.bool, -}; - -ComposeForm.defaultProps = { - showSearch: false -}; - export default injectIntl(ComposeForm); diff --git a/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js b/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js @@ -40,28 +40,26 @@ let EmojiPicker; // load asynchronously class EmojiPickerDropdown extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.setRef = this.setRef.bind(this); - this.handleChange = this.handleChange.bind(this); - this.onHideDropdown = this.onHideDropdown.bind(this); - this.onShowDropdown = this.onShowDropdown.bind(this); - this.state = { - active: false, - loading: false - }; - } + static propTypes = { + intl: PropTypes.object.isRequired, + onPickEmoji: PropTypes.func.isRequired + }; + + state = { + active: false, + loading: false + }; - setRef (c) { + setRef = (c) => { this.dropdown = c; } - handleChange (data) { + handleChange = (data) => { this.dropdown.hide(); this.props.onPickEmoji(data); } - onShowDropdown () { + onShowDropdown = () => { this.setState({active: true}); if (!EmojiPicker) { this.setState({loading: true}); @@ -75,7 +73,7 @@ class EmojiPickerDropdown extends React.PureComponent { } } - onHideDropdown () { + onHideDropdown = () => { this.setState({active: false}); } @@ -138,9 +136,4 @@ class EmojiPickerDropdown extends React.PureComponent { } -EmojiPickerDropdown.propTypes = { - intl: PropTypes.object.isRequired, - onPickEmoji: PropTypes.func.isRequired -}; - export default injectIntl(EmojiPickerDropdown); diff --git a/app/javascript/mastodon/features/compose/components/navigation_bar.js b/app/javascript/mastodon/features/compose/components/navigation_bar.js @@ -10,6 +10,10 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; class NavigationBar extends ImmutablePureComponent { + static propTypes = { + account: ImmutablePropTypes.map.isRequired + }; + render () { return ( <div className='navigation-bar'> @@ -30,8 +34,4 @@ class NavigationBar extends ImmutablePureComponent { } -NavigationBar.propTypes = { - account: ImmutablePropTypes.map.isRequired -}; - export default NavigationBar; diff --git a/app/javascript/mastodon/features/compose/components/privacy_dropdown.js b/app/javascript/mastodon/features/compose/components/privacy_dropdown.js @@ -22,28 +22,27 @@ const iconStyle = { class PrivacyDropdown extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.state = { - open: false - }; - this.handleToggle = this.handleToggle.bind(this); - this.handleClick = this.handleClick.bind(this); - this.onGlobalClick = this.onGlobalClick.bind(this); - this.setRef = this.setRef.bind(this); - } + static propTypes = { + value: PropTypes.string.isRequired, + onChange: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + + state = { + open: false + }; - handleToggle () { + handleToggle = () => { this.setState({ open: !this.state.open }); } - handleClick (value, e) { + handleClick = (value, e) => { e.preventDefault(); this.setState({ open: false }); this.props.onChange(value); } - onGlobalClick (e) { + onGlobalClick = (e) => { if (e.target !== this.node && !this.node.contains(e.target) && this.state.open) { this.setState({ open: false }); } @@ -59,7 +58,7 @@ class PrivacyDropdown extends React.PureComponent { window.removeEventListener('touchstart', this.onGlobalClick); } - setRef (c) { + setRef = (c) => { this.node = c; } @@ -96,10 +95,4 @@ class PrivacyDropdown extends React.PureComponent { } -PrivacyDropdown.propTypes = { - value: PropTypes.string.isRequired, - onChange: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(PrivacyDropdown); diff --git a/app/javascript/mastodon/features/compose/components/reply_indicator.js b/app/javascript/mastodon/features/compose/components/reply_indicator.js @@ -14,17 +14,21 @@ const messages = defineMessages({ class ReplyIndicator extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - this.handleAccountClick = this.handleAccountClick.bind(this); - } + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + status: ImmutablePropTypes.map, + onCancel: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; - handleClick () { + handleClick = () => { this.props.onCancel(); } - handleAccountClick (e) { + handleAccountClick = (e) => { if (e.button === 0) { e.preventDefault(); this.context.router.push(`/accounts/${this.props.status.getIn(['account', 'id'])}`); @@ -58,14 +62,4 @@ class ReplyIndicator extends ImmutablePureComponent { } -ReplyIndicator.contextTypes = { - router: PropTypes.object -}; - -ReplyIndicator.propTypes = { - status: ImmutablePropTypes.map, - onCancel: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(ReplyIndicator); diff --git a/app/javascript/mastodon/features/compose/components/search.js b/app/javascript/mastodon/features/compose/components/search.js @@ -8,19 +8,21 @@ const messages = defineMessages({ class Search extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleChange = this.handleChange.bind(this); - this.handleKeyDown = this.handleKeyDown.bind(this); - this.handleFocus = this.handleFocus.bind(this); - this.handleClear = this.handleClear.bind(this); - } - - handleChange (e) { + static propTypes = { + value: PropTypes.string.isRequired, + submitted: PropTypes.bool, + onChange: PropTypes.func.isRequired, + onSubmit: PropTypes.func.isRequired, + onClear: PropTypes.func.isRequired, + onShow: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + + handleChange = (e) => { this.props.onChange(e.target.value); } - handleClear (e) { + handleClear = (e) => { e.preventDefault(); if (this.props.value.length > 0 || this.props.submitted) { @@ -28,7 +30,7 @@ class Search extends React.PureComponent { } } - handleKeyDown (e) { + handleKeyDown = (e) => { if (e.key === 'Enter') { e.preventDefault(); this.props.onSubmit(); @@ -39,7 +41,7 @@ class Search extends React.PureComponent { } - handleFocus () { + handleFocus = () => { this.props.onShow(); } @@ -69,14 +71,4 @@ class Search extends React.PureComponent { } -Search.propTypes = { - value: PropTypes.string.isRequired, - submitted: PropTypes.bool, - onChange: PropTypes.func.isRequired, - onSubmit: PropTypes.func.isRequired, - onClear: PropTypes.func.isRequired, - onShow: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(Search); diff --git a/app/javascript/mastodon/features/compose/components/search_results.js b/app/javascript/mastodon/features/compose/components/search_results.js @@ -8,6 +8,10 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; class SearchResults extends ImmutablePureComponent { + static propTypes = { + results: ImmutablePropTypes.map.isRequired + }; + render () { const { results } = this.props; @@ -60,8 +64,4 @@ class SearchResults extends ImmutablePureComponent { } -SearchResults.propTypes = { - results: ImmutablePropTypes.map.isRequired -}; - export default SearchResults; diff --git a/app/javascript/mastodon/features/compose/components/text_icon_button.js b/app/javascript/mastodon/features/compose/components/text_icon_button.js @@ -3,12 +3,15 @@ import PropTypes from 'prop-types'; class TextIconButton extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - } - - handleClick (e) { + static propTypes = { + label: PropTypes.string.isRequired, + title: PropTypes.string, + active: PropTypes.bool, + onClick: PropTypes.func.isRequired, + ariaControls: PropTypes.string + }; + + handleClick = (e) => { e.preventDefault(); this.props.onClick(); } @@ -25,12 +28,4 @@ class TextIconButton extends React.PureComponent { } -TextIconButton.propTypes = { - label: PropTypes.string.isRequired, - title: PropTypes.string, - active: PropTypes.bool, - onClick: PropTypes.func.isRequired, - ariaControls: PropTypes.string -}; - export default TextIconButton; diff --git a/app/javascript/mastodon/features/compose/components/upload_button.js b/app/javascript/mastodon/features/compose/components/upload_button.js @@ -23,24 +23,26 @@ const iconStyle = { class UploadButton extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleChange = this.handleChange.bind(this); - this.handleClick = this.handleClick.bind(this); - this.setRef = this.setRef.bind(this); - } + static propTypes = { + disabled: PropTypes.bool, + onSelectFile: PropTypes.func.isRequired, + style: PropTypes.object, + resetFileKey: PropTypes.number, + acceptContentTypes: PropTypes.arrayOf(PropTypes.string).isRequired, + intl: PropTypes.object.isRequired + }; - handleChange (e) { + handleChange = (e) => { if (e.target.files.length > 0) { this.props.onSelectFile(e.target.files); } } - handleClick () { + handleClick = () => { this.fileElement.click(); } - setRef (c) { + setRef = (c) => { this.fileElement = c; } @@ -67,13 +69,4 @@ class UploadButton extends React.PureComponent { } -UploadButton.propTypes = { - disabled: PropTypes.bool, - onSelectFile: PropTypes.func.isRequired, - style: PropTypes.object, - resetFileKey: PropTypes.number, - acceptContentTypes: PropTypes.arrayOf(PropTypes.string).isRequired, - intl: PropTypes.object.isRequired -}; - export default connect(makeMapStateToProps)(injectIntl(UploadButton)); diff --git a/app/javascript/mastodon/features/compose/components/upload_form.js b/app/javascript/mastodon/features/compose/components/upload_form.js @@ -12,6 +12,12 @@ const messages = defineMessages({ class UploadForm extends React.PureComponent { + static propTypes = { + media: ImmutablePropTypes.list.isRequired, + onRemoveFile: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + render () { const { intl, media } = this.props; @@ -37,10 +43,4 @@ class UploadForm extends React.PureComponent { } -UploadForm.propTypes = { - media: ImmutablePropTypes.list.isRequired, - onRemoveFile: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(UploadForm); diff --git a/app/javascript/mastodon/features/compose/components/upload_progress.js b/app/javascript/mastodon/features/compose/components/upload_progress.js @@ -5,6 +5,11 @@ import { FormattedMessage } from 'react-intl'; class UploadProgress extends React.PureComponent { + static propTypes = { + active: PropTypes.bool, + progress: PropTypes.number + }; + render () { const { active, progress } = this.props; @@ -35,9 +40,4 @@ class UploadProgress extends React.PureComponent { } -UploadProgress.propTypes = { - active: PropTypes.bool, - progress: PropTypes.number -}; - export default UploadProgress; diff --git a/app/javascript/mastodon/features/compose/components/warning.js b/app/javascript/mastodon/features/compose/components/warning.js @@ -3,9 +3,9 @@ import PropTypes from 'prop-types'; class Warning extends React.PureComponent { - constructor (props) { - super(props); - } + static propTypes = { + message: PropTypes.node.isRequired + }; render () { const { message } = this.props; @@ -19,8 +19,4 @@ class Warning extends React.PureComponent { } -Warning.propTypes = { - message: PropTypes.node.isRequired -}; - export default Warning; diff --git a/app/javascript/mastodon/features/compose/containers/sensitive_button_container.js b/app/javascript/mastodon/features/compose/containers/sensitive_button_container.js @@ -25,6 +25,13 @@ const mapDispatchToProps = dispatch => ({ class SensitiveButton extends React.PureComponent { + static propTypes = { + visible: PropTypes.bool, + active: PropTypes.bool, + onClick: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + render () { const { visible, active, onClick, intl } = this.props; @@ -41,11 +48,4 @@ class SensitiveButton extends React.PureComponent { } -SensitiveButton.propTypes = { - visible: PropTypes.bool, - active: PropTypes.bool, - onClick: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(SensitiveButton)); diff --git a/app/javascript/mastodon/features/compose/index.js b/app/javascript/mastodon/features/compose/index.js @@ -25,6 +25,13 @@ const mapStateToProps = state => ({ class Compose extends React.PureComponent { + static propTypes = { + dispatch: PropTypes.func.isRequired, + withHeader: PropTypes.bool, + showSearch: PropTypes.bool, + intl: PropTypes.object.isRequired + }; + componentDidMount () { this.props.dispatch(mountCompose()); } @@ -76,11 +83,4 @@ class Compose extends React.PureComponent { } -Compose.propTypes = { - dispatch: PropTypes.func.isRequired, - withHeader: PropTypes.bool, - showSearch: PropTypes.bool, - intl: PropTypes.object.isRequired -}; - export default connect(mapStateToProps)(injectIntl(Compose)); diff --git a/app/javascript/mastodon/features/favourited_statuses/index.js b/app/javascript/mastodon/features/favourited_statuses/index.js @@ -22,16 +22,19 @@ const mapStateToProps = state => ({ class Favourites extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleScrollToBottom = this.handleScrollToBottom.bind(this); - } + static propTypes = { + dispatch: PropTypes.func.isRequired, + statusIds: ImmutablePropTypes.list.isRequired, + loaded: PropTypes.bool, + intl: PropTypes.object.isRequired, + me: PropTypes.number.isRequired + }; componentWillMount () { this.props.dispatch(fetchFavouritedStatuses()); } - handleScrollToBottom () { + handleScrollToBottom = () => { this.props.dispatch(expandFavouritedStatuses()); } @@ -56,12 +59,4 @@ class Favourites extends ImmutablePureComponent { } -Favourites.propTypes = { - dispatch: PropTypes.func.isRequired, - statusIds: ImmutablePropTypes.list.isRequired, - loaded: PropTypes.bool, - intl: PropTypes.object.isRequired, - me: PropTypes.number.isRequired -}; - export default connect(mapStateToProps)(injectIntl(Favourites)); diff --git a/app/javascript/mastodon/features/favourites/index.js b/app/javascript/mastodon/features/favourites/index.js @@ -16,6 +16,12 @@ const mapStateToProps = (state, props) => ({ class Favourites extends ImmutablePureComponent { + static propTypes = { + params: PropTypes.object.isRequired, + dispatch: PropTypes.func.isRequired, + accountIds: ImmutablePropTypes.list + }; + componentWillMount () { this.props.dispatch(fetchFavourites(Number(this.props.params.statusId))); } @@ -52,10 +58,4 @@ class Favourites extends ImmutablePureComponent { } -Favourites.propTypes = { - params: PropTypes.object.isRequired, - dispatch: PropTypes.func.isRequired, - accountIds: ImmutablePropTypes.list -}; - export default connect(mapStateToProps)(Favourites); diff --git a/app/javascript/mastodon/features/follow_requests/components/account_authorize.js b/app/javascript/mastodon/features/follow_requests/components/account_authorize.js @@ -16,6 +16,13 @@ const messages = defineMessages({ class AccountAuthorize extends ImmutablePureComponent { + static propTypes = { + account: ImmutablePropTypes.map.isRequired, + onAuthorize: PropTypes.func.isRequired, + onReject: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + render () { const { intl, account, onAuthorize, onReject } = this.props; const content = { __html: emojify(account.get('note')) }; @@ -41,11 +48,4 @@ class AccountAuthorize extends ImmutablePureComponent { } -AccountAuthorize.propTypes = { - account: ImmutablePropTypes.map.isRequired, - onAuthorize: PropTypes.func.isRequired, - onReject: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(AccountAuthorize); diff --git a/app/javascript/mastodon/features/follow_requests/index.js b/app/javascript/mastodon/features/follow_requests/index.js @@ -21,16 +21,18 @@ const mapStateToProps = state => ({ class FollowRequests extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleScroll = this.handleScroll.bind(this); - } + static propTypes = { + params: PropTypes.object.isRequired, + dispatch: PropTypes.func.isRequired, + accountIds: ImmutablePropTypes.list, + intl: PropTypes.object.isRequired + }; componentWillMount () { this.props.dispatch(fetchFollowRequests()); } - handleScroll (e) { + handleScroll = (e) => { const { scrollTop, scrollHeight, clientHeight } = e.target; if (scrollTop === scrollHeight - clientHeight) { @@ -62,13 +64,7 @@ class FollowRequests extends ImmutablePureComponent { </Column> ); } -} -FollowRequests.propTypes = { - params: PropTypes.object.isRequired, - dispatch: PropTypes.func.isRequired, - accountIds: ImmutablePropTypes.list, - intl: PropTypes.object.isRequired -}; +} export default connect(mapStateToProps)(injectIntl(FollowRequests)); diff --git a/app/javascript/mastodon/features/followers/index.js b/app/javascript/mastodon/features/followers/index.js @@ -22,25 +22,25 @@ const mapStateToProps = (state, props) => ({ class Followers extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleScroll = this.handleScroll.bind(this); - this.handleLoadMore = this.handleLoadMore.bind(this); - } + static propTypes = { + params: PropTypes.object.isRequired, + dispatch: PropTypes.func.isRequired, + accountIds: ImmutablePropTypes.list + }; componentWillMount () { this.props.dispatch(fetchAccount(Number(this.props.params.accountId))); this.props.dispatch(fetchFollowers(Number(this.props.params.accountId))); } - componentWillReceiveProps(nextProps) { + componentWillReceiveProps (nextProps) { if (nextProps.params.accountId !== this.props.params.accountId && nextProps.params.accountId) { this.props.dispatch(fetchAccount(Number(nextProps.params.accountId))); this.props.dispatch(fetchFollowers(Number(nextProps.params.accountId))); } } - handleScroll (e) { + handleScroll = (e) => { const { scrollTop, scrollHeight, clientHeight } = e.target; if (scrollTop === scrollHeight - clientHeight) { @@ -48,7 +48,7 @@ class Followers extends ImmutablePureComponent { } } - handleLoadMore (e) { + handleLoadMore = (e) => { e.preventDefault(); this.props.dispatch(expandFollowers(Number(this.props.params.accountId))); } @@ -83,10 +83,4 @@ class Followers extends ImmutablePureComponent { } -Followers.propTypes = { - params: PropTypes.object.isRequired, - dispatch: PropTypes.func.isRequired, - accountIds: ImmutablePropTypes.list -}; - export default connect(mapStateToProps)(Followers); diff --git a/app/javascript/mastodon/features/following/index.js b/app/javascript/mastodon/features/following/index.js @@ -22,25 +22,25 @@ const mapStateToProps = (state, props) => ({ class Following extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleScroll = this.handleScroll.bind(this); - this.handleLoadMore = this.handleLoadMore.bind(this); - } + static propTypes = { + params: PropTypes.object.isRequired, + dispatch: PropTypes.func.isRequired, + accountIds: ImmutablePropTypes.list + }; componentWillMount () { this.props.dispatch(fetchAccount(Number(this.props.params.accountId))); this.props.dispatch(fetchFollowing(Number(this.props.params.accountId))); } - componentWillReceiveProps(nextProps) { + componentWillReceiveProps (nextProps) { if (nextProps.params.accountId !== this.props.params.accountId && nextProps.params.accountId) { this.props.dispatch(fetchAccount(Number(nextProps.params.accountId))); this.props.dispatch(fetchFollowing(Number(nextProps.params.accountId))); } } - handleScroll (e) { + handleScroll = (e) => { const { scrollTop, scrollHeight, clientHeight } = e.target; if (scrollTop === scrollHeight - clientHeight) { @@ -48,7 +48,7 @@ class Following extends ImmutablePureComponent { } } - handleLoadMore (e) { + handleLoadMore = (e) => { e.preventDefault(); this.props.dispatch(expandFollowing(Number(this.props.params.accountId))); } @@ -83,10 +83,4 @@ class Following extends ImmutablePureComponent { } -Following.propTypes = { - params: PropTypes.object.isRequired, - dispatch: PropTypes.func.isRequired, - accountIds: ImmutablePropTypes.list -}; - export default connect(mapStateToProps)(Following); diff --git a/app/javascript/mastodon/features/getting_started/index.js b/app/javascript/mastodon/features/getting_started/index.js @@ -30,6 +30,11 @@ const mapStateToProps = state => ({ class GettingStarted extends ImmutablePureComponent { + static propTypes = { + intl: PropTypes.object.isRequired, + me: ImmutablePropTypes.map.isRequired + }; + render () { const { intl, me } = this.props; @@ -66,9 +71,4 @@ class GettingStarted extends ImmutablePureComponent { } } -GettingStarted.propTypes = { - intl: PropTypes.object.isRequired, - me: ImmutablePropTypes.map.isRequired -}; - export default connect(mapStateToProps)(injectIntl(GettingStarted)); diff --git a/app/javascript/mastodon/features/hashtag_timeline/index.js b/app/javascript/mastodon/features/hashtag_timeline/index.js @@ -20,6 +20,14 @@ const mapStateToProps = state => ({ class HashtagTimeline extends React.PureComponent { + static propTypes = { + params: PropTypes.object.isRequired, + dispatch: PropTypes.func.isRequired, + streamingAPIBaseURL: PropTypes.string.isRequired, + accessToken: PropTypes.string.isRequired, + hasUnread: PropTypes.bool + }; + _subscribe (dispatch, id) { const { streamingAPIBaseURL, accessToken } = this.props; @@ -79,12 +87,4 @@ class HashtagTimeline extends React.PureComponent { } -HashtagTimeline.propTypes = { - params: PropTypes.object.isRequired, - dispatch: PropTypes.func.isRequired, - streamingAPIBaseURL: PropTypes.string.isRequired, - accessToken: PropTypes.string.isRequired, - hasUnread: PropTypes.bool -}; - export default connect(mapStateToProps)(HashtagTimeline); diff --git a/app/javascript/mastodon/features/home_timeline/components/column_settings.js b/app/javascript/mastodon/features/home_timeline/components/column_settings.js @@ -13,6 +13,13 @@ const messages = defineMessages({ class ColumnSettings extends React.PureComponent { + static propTypes = { + settings: ImmutablePropTypes.map.isRequired, + onChange: PropTypes.func.isRequired, + onSave: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + render () { const { settings, onChange, onSave, intl } = this.props; @@ -41,11 +48,4 @@ class ColumnSettings extends React.PureComponent { } -ColumnSettings.propTypes = { - settings: ImmutablePropTypes.map.isRequired, - onChange: PropTypes.func.isRequired, - onSave: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -} - export default injectIntl(ColumnSettings); diff --git a/app/javascript/mastodon/features/home_timeline/components/setting_text.js b/app/javascript/mastodon/features/home_timeline/components/setting_text.js @@ -4,12 +4,14 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; class SettingText extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleChange = this.handleChange.bind(this); - } - - handleChange (e) { + static propTypes = { + settings: ImmutablePropTypes.map.isRequired, + settingKey: PropTypes.array.isRequired, + label: PropTypes.string.isRequired, + onChange: PropTypes.func.isRequired + }; + + handleChange = (e) => { this.props.onChange(this.props.settingKey, e.target.value) } @@ -28,11 +30,4 @@ class SettingText extends React.PureComponent { } -SettingText.propTypes = { - settings: ImmutablePropTypes.map.isRequired, - settingKey: PropTypes.array.isRequired, - label: PropTypes.string.isRequired, - onChange: PropTypes.func.isRequired -}; - export default SettingText; diff --git a/app/javascript/mastodon/features/home_timeline/index.js b/app/javascript/mastodon/features/home_timeline/index.js @@ -18,6 +18,12 @@ const mapStateToProps = state => ({ class HomeTimeline extends React.PureComponent { + static propTypes = { + intl: PropTypes.object.isRequired, + hasUnread: PropTypes.bool, + hasFollows: PropTypes.bool + }; + render () { const { intl, hasUnread, hasFollows } = this.props; @@ -45,10 +51,4 @@ class HomeTimeline extends React.PureComponent { } -HomeTimeline.propTypes = { - intl: PropTypes.object.isRequired, - hasUnread: PropTypes.bool, - hasFollows: PropTypes.bool -}; - export default connect(mapStateToProps)(injectIntl(HomeTimeline)); diff --git a/app/javascript/mastodon/features/notifications/components/clear_column_button.js b/app/javascript/mastodon/features/notifications/components/clear_column_button.js @@ -8,6 +8,11 @@ const messages = defineMessages({ class ClearColumnButton extends React.Component { + static propTypes = { + onClick: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + render () { const { intl } = this.props; @@ -19,9 +24,4 @@ class ClearColumnButton extends React.Component { } } -ClearColumnButton.propTypes = { - onClick: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(ClearColumnButton); diff --git a/app/javascript/mastodon/features/notifications/components/column_settings.js b/app/javascript/mastodon/features/notifications/components/column_settings.js @@ -11,6 +11,15 @@ const messages = defineMessages({ class ColumnSettings extends React.PureComponent { + static propTypes = { + settings: ImmutablePropTypes.map.isRequired, + onChange: PropTypes.func.isRequired, + onSave: PropTypes.func.isRequired, + intl: PropTypes.shape({ + formatMessage: PropTypes.func.isRequired + }).isRequired + }; + render () { const { settings, intl, onChange, onSave } = this.props; @@ -59,13 +68,4 @@ class ColumnSettings extends React.PureComponent { } -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/javascript/mastodon/features/notifications/components/notification.js b/app/javascript/mastodon/features/notifications/components/notification.js @@ -11,6 +11,10 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; class Notification extends ImmutablePureComponent { + static propTypes = { + notification: ImmutablePropTypes.map.isRequired + }; + renderFollow (account, link) { return ( <div className='notification notification-follow'> @@ -82,8 +86,4 @@ class Notification extends ImmutablePureComponent { } -Notification.propTypes = { - notification: ImmutablePropTypes.map.isRequired -}; - export default Notification; diff --git a/app/javascript/mastodon/features/notifications/index.js b/app/javascript/mastodon/features/notifications/index.js @@ -33,15 +33,20 @@ const mapStateToProps = state => ({ class Notifications extends React.PureComponent { - 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) { + static propTypes = { + notifications: ImmutablePropTypes.list.isRequired, + dispatch: PropTypes.func.isRequired, + shouldUpdateScroll: PropTypes.func, + intl: PropTypes.object.isRequired, + isLoading: PropTypes.bool, + isUnread: PropTypes.bool + }; + + static defaultProps = { + trackScroll: true + }; + + handleScroll = (e) => { const { scrollTop, scrollHeight, clientHeight } = e.target; const offset = scrollHeight - scrollTop - clientHeight; this._oldScrollPosition = scrollHeight - scrollTop; @@ -61,12 +66,12 @@ class Notifications extends React.PureComponent { } } - handleLoadMore (e) { + handleLoadMore = (e) => { e.preventDefault(); this.props.dispatch(expandNotifications()); } - handleClear () { + handleClear = () => { const { dispatch, intl } = this.props; dispatch(openModal('CONFIRM', { @@ -76,7 +81,7 @@ class Notifications extends React.PureComponent { })); } - setRef (c) { + setRef = (c) => { this.node = c; } @@ -127,17 +132,4 @@ class Notifications extends React.PureComponent { } -Notifications.propTypes = { - notifications: ImmutablePropTypes.list.isRequired, - dispatch: PropTypes.func.isRequired, - shouldUpdateScroll: PropTypes.func, - intl: PropTypes.object.isRequired, - isLoading: PropTypes.bool, - isUnread: PropTypes.bool -}; - -Notifications.defaultProps = { - trackScroll: true -}; - export default connect(mapStateToProps)(injectIntl(Notifications)); diff --git a/app/javascript/mastodon/features/public_timeline/index.js b/app/javascript/mastodon/features/public_timeline/index.js @@ -28,6 +28,14 @@ let subscription; class PublicTimeline extends React.PureComponent { + static propTypes = { + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + streamingAPIBaseURL: PropTypes.string.isRequired, + accessToken: PropTypes.string.isRequired, + hasUnread: PropTypes.bool + }; + componentDidMount () { const { dispatch, streamingAPIBaseURL, accessToken } = this.props; @@ -85,12 +93,4 @@ class PublicTimeline extends React.PureComponent { } -PublicTimeline.propTypes = { - dispatch: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired, - streamingAPIBaseURL: PropTypes.string.isRequired, - accessToken: PropTypes.string.isRequired, - hasUnread: PropTypes.bool -}; - export default connect(mapStateToProps)(injectIntl(PublicTimeline)); diff --git a/app/javascript/mastodon/features/reblogs/index.js b/app/javascript/mastodon/features/reblogs/index.js @@ -16,6 +16,12 @@ const mapStateToProps = (state, props) => ({ class Reblogs extends ImmutablePureComponent { + static propTypes = { + params: PropTypes.object.isRequired, + dispatch: PropTypes.func.isRequired, + accountIds: ImmutablePropTypes.list + }; + componentWillMount () { this.props.dispatch(fetchReblogs(Number(this.props.params.statusId))); } @@ -52,10 +58,4 @@ class Reblogs extends ImmutablePureComponent { } -Reblogs.propTypes = { - params: PropTypes.object.isRequired, - dispatch: PropTypes.func.isRequired, - accountIds: ImmutablePropTypes.list -}; - export default connect(mapStateToProps)(Reblogs); diff --git a/app/javascript/mastodon/features/report/components/status_check_box.js b/app/javascript/mastodon/features/report/components/status_check_box.js @@ -6,6 +6,13 @@ import Toggle from 'react-toggle'; class StatusCheckBox extends React.PureComponent { + static propTypes = { + status: ImmutablePropTypes.map.isRequired, + checked: PropTypes.bool, + onToggle: PropTypes.func.isRequired, + disabled: PropTypes.bool + }; + render () { const { status, checked, onToggle, disabled } = this.props; const content = { __html: emojify(status.get('content')) }; @@ -30,11 +37,4 @@ class StatusCheckBox extends React.PureComponent { } -StatusCheckBox.propTypes = { - status: ImmutablePropTypes.map.isRequired, - checked: PropTypes.bool, - onToggle: PropTypes.func.isRequired, - disabled: PropTypes.bool -}; - export default StatusCheckBox; diff --git a/app/javascript/mastodon/features/report/index.js b/app/javascript/mastodon/features/report/index.js @@ -37,11 +37,18 @@ const makeMapStateToProps = () => { class Report extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleCommentChange = this.handleCommentChange.bind(this); - this.handleSubmit = this.handleSubmit.bind(this); - } + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + isSubmitting: PropTypes.bool, + account: ImmutablePropTypes.map, + statusIds: ImmutablePropTypes.orderedSet.isRequired, + comment: PropTypes.string.isRequired, + dispatch: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; componentWillMount () { if (!this.props.account) { @@ -63,11 +70,11 @@ class Report extends React.PureComponent { } } - handleCommentChange (e) { + handleCommentChange = (e) => { this.props.dispatch(changeReportComment(e.target.value)); } - handleSubmit () { + handleSubmit = () => { this.props.dispatch(submitReport()); this.context.router.replace('/'); } @@ -115,17 +122,4 @@ class Report extends React.PureComponent { } -Report.contextTypes = { - router: PropTypes.object -}; - -Report.propTypes = { - isSubmitting: PropTypes.bool, - account: ImmutablePropTypes.map, - statusIds: ImmutablePropTypes.orderedSet.isRequired, - comment: PropTypes.string.isRequired, - dispatch: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default connect(makeMapStateToProps)(injectIntl(Report)); diff --git a/app/javascript/mastodon/features/status/components/action_bar.js b/app/javascript/mastodon/features/status/components/action_bar.js @@ -17,37 +17,43 @@ const messages = defineMessages({ class ActionBar extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleReplyClick = this.handleReplyClick.bind(this); - this.handleReblogClick = this.handleReblogClick.bind(this); - this.handleFavouriteClick = this.handleFavouriteClick.bind(this); - this.handleDeleteClick = this.handleDeleteClick.bind(this); - this.handleMentionClick = this.handleMentionClick.bind(this); - this.handleReport = this.handleReport.bind(this); - } - - handleReplyClick () { + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + status: ImmutablePropTypes.map.isRequired, + onReply: PropTypes.func.isRequired, + onReblog: PropTypes.func.isRequired, + onFavourite: PropTypes.func.isRequired, + onDelete: PropTypes.func.isRequired, + onMention: PropTypes.func.isRequired, + onReport: PropTypes.func, + me: PropTypes.number.isRequired, + intl: PropTypes.object.isRequired + }; + + handleReplyClick = () => { this.props.onReply(this.props.status); } - handleReblogClick (e) { + handleReblogClick = (e) => { this.props.onReblog(this.props.status, e); } - handleFavouriteClick () { + handleFavouriteClick = () => { this.props.onFavourite(this.props.status); } - handleDeleteClick () { + handleDeleteClick = () => { this.props.onDelete(this.props.status); } - handleMentionClick () { + handleMentionClick = () => { this.props.onMention(this.props.status.get('account'), this.context.router); } - handleReport () { + handleReport = () => { this.props.onReport(this.props.status); this.context.router.push('/report'); } @@ -86,20 +92,4 @@ class ActionBar extends React.PureComponent { } -ActionBar.contextTypes = { - router: PropTypes.object -}; - -ActionBar.propTypes = { - status: ImmutablePropTypes.map.isRequired, - onReply: PropTypes.func.isRequired, - onReblog: PropTypes.func.isRequired, - onFavourite: PropTypes.func.isRequired, - onDelete: PropTypes.func.isRequired, - onMention: PropTypes.func.isRequired, - onReport: PropTypes.func, - me: PropTypes.number.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(ActionBar); diff --git a/app/javascript/mastodon/features/status/components/card.js b/app/javascript/mastodon/features/status/components/card.js @@ -19,6 +19,10 @@ const getHostname = url => { class Card extends React.PureComponent { + static propTypes = { + card: ImmutablePropTypes.map + }; + renderLink () { const { card } = this.props; @@ -93,8 +97,4 @@ class Card extends React.PureComponent { } } -Card.propTypes = { - card: ImmutablePropTypes.map -}; - export default Card; diff --git a/app/javascript/mastodon/features/status/components/detailed_status.js b/app/javascript/mastodon/features/status/components/detailed_status.js @@ -14,12 +14,18 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; class DetailedStatus extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleAccountClick = this.handleAccountClick.bind(this); - } - - handleAccountClick (e) { + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + status: ImmutablePropTypes.map.isRequired, + onOpenMedia: PropTypes.func.isRequired, + onOpenVideo: PropTypes.func.isRequired, + autoPlayGif: PropTypes.bool, + }; + + handleAccountClick = (e) => { if (e.button === 0) { e.preventDefault(); this.context.router.push(`/accounts/${this.props.status.getIn(['account', 'id'])}`); @@ -82,15 +88,4 @@ class DetailedStatus extends ImmutablePureComponent { } -DetailedStatus.contextTypes = { - router: PropTypes.object -}; - -DetailedStatus.propTypes = { - status: ImmutablePropTypes.map.isRequired, - onOpenMedia: PropTypes.func.isRequired, - onOpenVideo: PropTypes.func.isRequired, - autoPlayGif: PropTypes.bool, -}; - export default DetailedStatus; diff --git a/app/javascript/mastodon/features/status/index.js b/app/javascript/mastodon/features/status/index.js @@ -56,18 +56,21 @@ const makeMapStateToProps = () => { class Status extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.handleFavouriteClick = this.handleFavouriteClick.bind(this); - this.handleReplyClick = this.handleReplyClick.bind(this); - this.handleModalReblog = this.handleModalReblog.bind(this); - this.handleReblogClick = this.handleReblogClick.bind(this); - this.handleDeleteClick = this.handleDeleteClick.bind(this); - this.handleMentionClick = this.handleMentionClick.bind(this); - this.handleOpenMedia = this.handleOpenMedia.bind(this); - this.handleOpenVideo = this.handleOpenVideo.bind(this); - this.handleReport = this.handleReport.bind(this); - } + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + params: PropTypes.object.isRequired, + dispatch: PropTypes.func.isRequired, + status: ImmutablePropTypes.map, + ancestorsIds: ImmutablePropTypes.list, + descendantsIds: ImmutablePropTypes.list, + me: PropTypes.number, + boostModal: PropTypes.bool, + autoPlayGif: PropTypes.bool, + intl: PropTypes.object.isRequired + }; componentWillMount () { this.props.dispatch(fetchStatus(Number(this.props.params.statusId))); @@ -79,7 +82,7 @@ class Status extends ImmutablePureComponent { } } - handleFavouriteClick (status) { + handleFavouriteClick = (status) => { if (status.get('favourited')) { this.props.dispatch(unfavourite(status)); } else { @@ -87,15 +90,15 @@ class Status extends ImmutablePureComponent { } } - handleReplyClick (status) { + handleReplyClick = (status) => { this.props.dispatch(replyCompose(status, this.context.router)); } - handleModalReblog (status) { + handleModalReblog = (status) => { this.props.dispatch(reblog(status)); } - handleReblogClick (status, e) { + handleReblogClick = (status, e) => { if (status.get('reblogged')) { this.props.dispatch(unreblog(status)); } else { @@ -107,7 +110,7 @@ class Status extends ImmutablePureComponent { } } - handleDeleteClick (status) { + handleDeleteClick = (status) => { const { dispatch, intl } = this.props; dispatch(openModal('CONFIRM', { @@ -117,19 +120,19 @@ class Status extends ImmutablePureComponent { })); } - handleMentionClick (account, router) { + handleMentionClick = (account, router) => { this.props.dispatch(mentionCompose(account, router)); } - handleOpenMedia (media, index) { + handleOpenMedia = (media, index) => { this.props.dispatch(openModal('MEDIA', { media, index })); } - handleOpenVideo (media, time) { + handleOpenVideo = (media, time) => { this.props.dispatch(openModal('VIDEO', { media, time })); } - handleReport (status) { + handleReport = (status) => { this.props.dispatch(initReport(status.get('account'), status)); } @@ -180,20 +183,4 @@ class Status extends ImmutablePureComponent { } -Status.contextTypes = { - router: PropTypes.object -}; - -Status.propTypes = { - params: PropTypes.object.isRequired, - dispatch: PropTypes.func.isRequired, - status: ImmutablePropTypes.map, - ancestorsIds: ImmutablePropTypes.list, - descendantsIds: ImmutablePropTypes.list, - me: PropTypes.number, - boostModal: PropTypes.bool, - autoPlayGif: PropTypes.bool, - intl: PropTypes.object.isRequired -}; - export default injectIntl(connect(makeMapStateToProps)(Status)); diff --git a/app/javascript/mastodon/features/ui/components/boost_modal.js b/app/javascript/mastodon/features/ui/components/boost_modal.js @@ -16,18 +16,29 @@ const messages = defineMessages({ class BoostModal extends ImmutablePureComponent { + static contextTypes = { + router: PropTypes.object + }; + + static propTypes = { + status: ImmutablePropTypes.map.isRequired, + onReblog: PropTypes.func.isRequired, + onClose: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + constructor (props, context) { super(props, context); this.handleReblog = this.handleReblog.bind(this); this.handleAccountClick = this.handleAccountClick.bind(this); } - handleReblog() { + handleReblog = () => { this.props.onReblog(this.props.status); this.props.onClose(); } - handleAccountClick (e) { + handleAccountClick = (e) => { if (e.button === 0) { e.preventDefault(); this.props.onClose(); @@ -70,15 +81,4 @@ class BoostModal extends ImmutablePureComponent { } -BoostModal.contextTypes = { - router: PropTypes.object -}; - -BoostModal.propTypes = { - status: ImmutablePropTypes.map.isRequired, - onReblog: PropTypes.func.isRequired, - onClose: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(BoostModal); diff --git a/app/javascript/mastodon/features/ui/components/column.js b/app/javascript/mastodon/features/ui/components/column.js @@ -32,14 +32,15 @@ const scrollTop = (node) => { class Column extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleHeaderClick = this.handleHeaderClick.bind(this); - this.handleWheel = this.handleWheel.bind(this); - this.setRef = this.setRef.bind(this); - } + static propTypes = { + heading: PropTypes.string, + icon: PropTypes.string, + children: PropTypes.node, + active: PropTypes.bool, + hideHeadingOnMobile: PropTypes.bool + }; - handleHeaderClick () { + handleHeaderClick = () => { const scrollable = this.node.querySelector('.scrollable'); if (!scrollable) { return; @@ -47,13 +48,13 @@ class Column extends React.PureComponent { this._interruptScrollAnimation = scrollTop(scrollable); } - handleWheel () { + handleWheel = () => { if (typeof this._interruptScrollAnimation !== 'undefined') { this._interruptScrollAnimation(); } } - setRef (c) { + setRef = (c) => { this.node = c; } @@ -82,12 +83,4 @@ class Column extends React.PureComponent { } -Column.propTypes = { - heading: PropTypes.string, - icon: PropTypes.string, - children: PropTypes.node, - active: PropTypes.bool, - hideHeadingOnMobile: PropTypes.bool -}; - export default Column; diff --git a/app/javascript/mastodon/features/ui/components/column_header.js b/app/javascript/mastodon/features/ui/components/column_header.js @@ -3,12 +3,16 @@ import PropTypes from 'prop-types' class ColumnHeader extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - } - - handleClick () { + static propTypes = { + icon: PropTypes.string, + type: PropTypes.string, + active: PropTypes.bool, + onClick: PropTypes.func, + hideOnMobile: PropTypes.bool, + columnHeaderId: PropTypes.string + }; + + handleClick = () => { this.props.onClick(); } @@ -31,13 +35,4 @@ class ColumnHeader extends React.PureComponent { } -ColumnHeader.propTypes = { - icon: PropTypes.string, - type: PropTypes.string, - active: PropTypes.bool, - onClick: PropTypes.func, - hideOnMobile: PropTypes.bool, - columnHeaderId: PropTypes.string -}; - export default ColumnHeader; diff --git a/app/javascript/mastodon/features/ui/components/columns_area.js b/app/javascript/mastodon/features/ui/components/columns_area.js @@ -3,6 +3,10 @@ import PropTypes from 'prop-types'; class ColumnsArea extends React.PureComponent { + static propTypes = { + children: PropTypes.node + }; + render () { return ( <div className='columns-area'> @@ -13,8 +17,4 @@ class ColumnsArea extends React.PureComponent { } -ColumnsArea.propTypes = { - children: PropTypes.node -}; - export default ColumnsArea; diff --git a/app/javascript/mastodon/features/ui/components/confirmation_modal.js b/app/javascript/mastodon/features/ui/components/confirmation_modal.js @@ -5,18 +5,20 @@ import Button from '../../../components/button'; class ConfirmationModal extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleClick = this.handleClick.bind(this); - this.handleCancel = this.handleCancel.bind(this); - } - - handleClick () { + static propTypes = { + message: PropTypes.node.isRequired, + confirm: PropTypes.string.isRequired, + onClose: PropTypes.func.isRequired, + onConfirm: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + + handleClick = () => { this.props.onClose(); this.props.onConfirm(); } - handleCancel (e) { + handleCancel = (e) => { e.preventDefault(); this.props.onClose(); } @@ -40,12 +42,4 @@ class ConfirmationModal extends React.PureComponent { } -ConfirmationModal.propTypes = { - message: PropTypes.node.isRequired, - confirm: PropTypes.string.isRequired, - onClose: PropTypes.func.isRequired, - onConfirm: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(ConfirmationModal); diff --git a/app/javascript/mastodon/features/ui/components/media_modal.js b/app/javascript/mastodon/features/ui/components/media_modal.js @@ -14,25 +14,26 @@ const messages = defineMessages({ class MediaModal extends ImmutablePureComponent { - constructor (props, context) { - super(props, context); - this.state = { - index: null - }; - this.handleNextClick = this.handleNextClick.bind(this); - this.handlePrevClick = this.handlePrevClick.bind(this); - this.handleKeyUp = this.handleKeyUp.bind(this); - } - - handleNextClick () { + static propTypes = { + media: ImmutablePropTypes.list.isRequired, + index: PropTypes.number.isRequired, + onClose: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + + state = { + index: null + }; + + handleNextClick = () => { this.setState({ index: (this.getIndex() + 1) % this.props.media.size}); } - handlePrevClick () { + handlePrevClick = () => { this.setState({ index: (this.getIndex() - 1) % this.props.media.size}); } - handleKeyUp (e) { + handleKeyUp = (e) => { switch(e.key) { case 'ArrowLeft': this.handlePrevClick(); @@ -93,11 +94,4 @@ class MediaModal extends ImmutablePureComponent { } -MediaModal.propTypes = { - media: ImmutablePropTypes.list.isRequired, - index: PropTypes.number.isRequired, - onClose: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(MediaModal); diff --git a/app/javascript/mastodon/features/ui/components/modal_root.js b/app/javascript/mastodon/features/ui/components/modal_root.js @@ -17,12 +17,13 @@ const MODAL_COMPONENTS = { class ModalRoot extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.handleKeyUp = this.handleKeyUp.bind(this); - } + static propTypes = { + type: PropTypes.string, + props: PropTypes.object, + onClose: PropTypes.func.isRequired + }; - handleKeyUp (e) { + handleKeyUp = (e) => { if ((e.key === 'Escape' || e.key === 'Esc' || e.keyCode === 27) && !!this.props.type) { this.props.onClose(); @@ -84,10 +85,4 @@ class ModalRoot extends React.PureComponent { } -ModalRoot.propTypes = { - type: PropTypes.string, - props: PropTypes.object, - onClose: PropTypes.func.isRequired -}; - export default ModalRoot; diff --git a/app/javascript/mastodon/features/ui/components/onboarding_modal.js b/app/javascript/mastodon/features/ui/components/onboarding_modal.js @@ -165,27 +165,29 @@ const mapStateToProps = state => ({ class OnboardingModal extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.state = { - currentIndex: 0 - }; - this.handleSkip = this.handleSkip.bind(this); - this.handleDot = this.handleDot.bind(this); - this.handleNext = this.handleNext.bind(this); - } - - handleSkip (e) { + static propTypes = { + onClose: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + me: ImmutablePropTypes.map.isRequired, + domain: PropTypes.string.isRequired, + admin: ImmutablePropTypes.map + }; + + state = { + currentIndex: 0 + }; + + handleSkip = (e) => { e.preventDefault(); this.props.onClose(); } - handleDot (i, e) { + handleDot = (i, e) => { e.preventDefault(); this.setState({ currentIndex: i }); } - handleNext (maxNum, e) { + handleNext = (maxNum, e) => { e.preventDefault(); if (this.state.currentIndex < maxNum - 1) { @@ -253,12 +255,4 @@ class OnboardingModal extends React.PureComponent { } -OnboardingModal.propTypes = { - onClose: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired, - me: ImmutablePropTypes.map.isRequired, - domain: PropTypes.string.isRequired, - admin: ImmutablePropTypes.map -} - export default connect(mapStateToProps)(injectIntl(OnboardingModal)); diff --git a/app/javascript/mastodon/features/ui/components/upload_area.js b/app/javascript/mastodon/features/ui/components/upload_area.js @@ -5,13 +5,12 @@ import { FormattedMessage } from 'react-intl'; class UploadArea extends React.PureComponent { - constructor (props, context) { - super(props, context); + static propTypes = { + active: PropTypes.bool, + onClose: PropTypes.func + }; - this.handleKeyUp = this.handleKeyUp.bind(this); - } - - handleKeyUp (e) { + handleKeyUp = (e) => { e.preventDefault(); e.stopPropagation(); @@ -52,9 +51,4 @@ class UploadArea extends React.PureComponent { } -UploadArea.propTypes = { - active: PropTypes.bool, - onClose: PropTypes.func -}; - export default UploadArea; diff --git a/app/javascript/mastodon/features/ui/components/video_modal.js b/app/javascript/mastodon/features/ui/components/video_modal.js @@ -13,6 +13,13 @@ const messages = defineMessages({ class VideoModal extends ImmutablePureComponent { + static propTypes = { + media: ImmutablePropTypes.map.isRequired, + time: PropTypes.number, + onClose: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired + }; + render () { const { media, intl, time, onClose } = this.props; @@ -30,11 +37,4 @@ class VideoModal extends ImmutablePureComponent { } -VideoModal.propTypes = { - media: ImmutablePropTypes.map.isRequired, - time: PropTypes.number, - onClose: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired -}; - export default injectIntl(VideoModal); diff --git a/app/javascript/mastodon/features/ui/index.js b/app/javascript/mastodon/features/ui/index.js @@ -20,27 +20,21 @@ const noOp = () => false; class UI extends React.PureComponent { - constructor (props, context) { - super(props, context); - this.state = { - width: window.innerWidth, - draggingOver: false - }; - this.handleResize = debounce(this.handleResize.bind(this), 500); - this.handleDragEnter = this.handleDragEnter.bind(this); - this.handleDragOver = this.handleDragOver.bind(this); - this.handleDrop = this.handleDrop.bind(this); - this.handleDragLeave = this.handleDragLeave.bind(this); - this.handleDragEnd = this.handleDragLeave.bind(this) - this.closeUploadModal = this.closeUploadModal.bind(this) - this.setRef = this.setRef.bind(this); - } + static propTypes = { + dispatch: PropTypes.func.isRequired, + children: PropTypes.node + }; + + state = { + width: window.innerWidth, + draggingOver: false + }; - handleResize () { + handleResize = () => { this.setState({ width: window.innerWidth }); } - handleDragEnter (e) { + handleDragEnter = (e) => { e.preventDefault(); if (!this.dragTargets) { @@ -56,7 +50,7 @@ class UI extends React.PureComponent { } } - handleDragOver (e) { + handleDragOver = (e) => { e.preventDefault(); e.stopPropagation(); @@ -69,7 +63,7 @@ class UI extends React.PureComponent { return false; } - handleDrop (e) { + handleDrop = (e) => { e.preventDefault(); this.setState({ draggingOver: false }); @@ -79,7 +73,7 @@ class UI extends React.PureComponent { } } - handleDragLeave (e) { + handleDragLeave = (e) => { e.preventDefault(); e.stopPropagation(); @@ -92,7 +86,7 @@ class UI extends React.PureComponent { this.setState({ draggingOver: false }); } - closeUploadModal() { + closeUploadModal = () => { this.setState({ draggingOver: false }); } @@ -117,7 +111,7 @@ class UI extends React.PureComponent { document.removeEventListener('dragend', this.handleDragEnd); } - setRef (c) { + setRef = (c) => { this.node = c; } @@ -160,9 +154,4 @@ class UI extends React.PureComponent { } -UI.propTypes = { - dispatch: PropTypes.func.isRequired, - children: PropTypes.node -}; - export default connect()(UI); diff --git a/package.json b/package.json @@ -27,6 +27,7 @@ "babel-plugin-react-intl": "^2.3.1", "babel-plugin-react-transform": "^2.0.2", "babel-plugin-syntax-dynamic-import": "^6.18.0", + "babel-plugin-transform-class-properties": "^6.24.1", "babel-plugin-transform-object-rest-spread": "^6.23.0", "babel-plugin-transform-react-jsx-self": "^6.22.0", "babel-plugin-transform-react-jsx-source": "^6.22.0", diff --git a/yarn.lock b/yarn.lock @@ -727,6 +727,15 @@ babel-plugin-transform-class-properties@^6.22.0: babel-runtime "^6.22.0" babel-template "^6.22.0" +babel-plugin-transform-class-properties@^6.24.1: + version "6.24.1" + resolved "https://registry.yarnpkg.com/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz#6a79763ea61d33d36f37b611aa9def81a81b46ac" + dependencies: + babel-helper-function-name "^6.24.1" + babel-plugin-syntax-class-properties "^6.8.0" + babel-runtime "^6.22.0" + babel-template "^6.24.1" + babel-plugin-transform-decorators@^6.22.0: version "6.22.0" resolved "https://registry.yarnpkg.com/babel-plugin-transform-decorators/-/babel-plugin-transform-decorators-6.22.0.tgz#c03635b27a23b23b7224f49232c237a73988d27c"