Beginning to reformat propTypes and set redux, intl functions to end of component files

• Beginning:
- to reformat propTypes and set redux, intl functions to end of component files

app/javascript/gabsocial/components/about_sidebar.js

@@ -10,24 +10,8 @@ import Heading from './heading'
 import BackButton from './back_button'
 import ResponsiveClassesComponent from '../features/ui/util/responsive_classes_component'
 
-const messages = defineMessages({
-  blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
-  mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
-  preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
-  menu: { id: 'menu', defaultMessage: 'Menu' },
-})
-
-export default
-@injectIntl
 class AboutSidebar extends ImmutablePureComponent {
 
-  static propTypes = {
-    intl: PropTypes.object.isRequired,
-    account: ImmutablePropTypes.map,
-    title: PropTypes.string,
-    items: PropTypes.array.isRequired,
-  }
-
   render() {
     const {
       intl,
@@ -76,4 +60,20 @@ class AboutSidebar extends ImmutablePureComponent {
     )
   }
 
-}
+}
+
+const messages = defineMessages({
+  blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
+  mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
+  preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
+  menu: { id: 'menu', defaultMessage: 'Menu' },
+})
+
+AboutSidebar.propTypes = {
+  intl: PropTypes.object.isRequired,
+  account: ImmutablePropTypes.map,
+  title: PropTypes.string,
+  items: PropTypes.array.isRequired,
+}
+
+export default injectIntl(AboutSidebar)

app/javascript/gabsocial/features/compose/components/compose_extra_button.js

@@ -5,16 +5,7 @@ import Button from '../../../components/button'
 
 const cx = classNames.bind(_s)
 
-export default class ComposeExtraButton extends React.PureComponent {
+class ComposeExtraButton extends React.PureComponent {
-  static propTypes = {
-    title: PropTypes.string,
-    disabled: PropTypes.bool,
-    onClick: PropTypes.func,
-    icon: PropTypes.string,
-    small: PropTypes.bool,
-    active: PropTypes.bool,
-    buttonRef: PropTypes.func,
-  }
 
   render() {
     const {
@@ -79,4 +70,17 @@ export default class ComposeExtraButton extends React.PureComponent {
       </div>
     )
   }
-}
+
+}
+
+ComposeExtraButton.propTypes = {
+  title: PropTypes.string,
+  disabled: PropTypes.bool,
+  onClick: PropTypes.func,
+  icon: PropTypes.string,
+  small: PropTypes.bool,
+  active: PropTypes.bool,
+  buttonRef: PropTypes.func,
+}
+
+export default ComposeExtraButton

app/javascript/gabsocial/features/compose/components/compose_form.js

@@ -41,8 +41,6 @@ const messages = defineMessages({
   schedulePost: { id: 'compose_form.schedule_post', defaultMessage: 'Schedule Post' },
 })
 
-export default
-@injectIntl
 class ComposeForm extends ImmutablePureComponent {
 
   static contextTypes = {
@@ -53,53 +51,6 @@ class ComposeForm extends ImmutablePureComponent {
     composeFocused: false,
   }
 
-  static propTypes = {
-    intl: PropTypes.object.isRequired,
-    edit: PropTypes.bool,
-    isMatch: PropTypes.bool,
-    text: PropTypes.string.isRequired,
-    markdown: PropTypes.string,
-    suggestions: ImmutablePropTypes.list,
-    account: ImmutablePropTypes.map.isRequired,
-    status: ImmutablePropTypes.map,
-    spoiler: PropTypes.bool,
-    privacy: PropTypes.string,
-    spoilerText: PropTypes.string,
-    focusDate: PropTypes.instanceOf(Date),
-    caretPosition: PropTypes.number,
-    preselectDate: PropTypes.instanceOf(Date),
-    isSubmitting: PropTypes.bool,
-    isChangingUpload: PropTypes.bool,
-    isUploading: PropTypes.bool,
-    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,
-    anyMedia: PropTypes.bool,
-    shouldCondense: PropTypes.bool,
-    autoFocus: PropTypes.bool,
-    groupId: PropTypes.string,
-    isModalOpen: PropTypes.bool,
-    scheduledAt: PropTypes.instanceOf(Date),
-    setScheduledAt: PropTypes.func.isRequired,
-    replyToId: PropTypes.string,
-    reduxReplyToId: PropTypes.string,
-    hasPoll: PropTypes.bool,
-    selectedGifSrc: PropTypes.string,
-    isPro: PropTypes.bool,
-    hidePro: PropTypes.bool,
-    autoJoinGroup: PropTypes.bool,
-  }
-
-  static defaultProps = {
-    showSearch: false,
-  };
-
   handleChange = (e, selectionStart) => {
     this.props.onChange(e.target.value, e.target.markdown, this.props.replyToId, selectionStart)
   }
@@ -528,4 +479,53 @@ class ComposeForm extends ImmutablePureComponent {
     )
   }
 
-}
+}
+
+ComposeForm.propTypes = {
+  intl: PropTypes.object.isRequired,
+  edit: PropTypes.bool,
+  isMatch: PropTypes.bool,
+  text: PropTypes.string.isRequired,
+  markdown: PropTypes.string,
+  suggestions: ImmutablePropTypes.list,
+  account: ImmutablePropTypes.map.isRequired,
+  status: ImmutablePropTypes.map,
+  spoiler: PropTypes.bool,
+  privacy: PropTypes.string,
+  spoilerText: PropTypes.string,
+  focusDate: PropTypes.instanceOf(Date),
+  caretPosition: PropTypes.number,
+  preselectDate: PropTypes.instanceOf(Date),
+  isSubmitting: PropTypes.bool,
+  isChangingUpload: PropTypes.bool,
+  isUploading: PropTypes.bool,
+  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,
+  anyMedia: PropTypes.bool,
+  shouldCondense: PropTypes.bool,
+  autoFocus: PropTypes.bool,
+  groupId: PropTypes.string,
+  isModalOpen: PropTypes.bool,
+  scheduledAt: PropTypes.instanceOf(Date),
+  setScheduledAt: PropTypes.func.isRequired,
+  replyToId: PropTypes.string,
+  reduxReplyToId: PropTypes.string,
+  hasPoll: PropTypes.bool,
+  selectedGifSrc: PropTypes.string,
+  isPro: PropTypes.bool,
+  hidePro: PropTypes.bool,
+  autoJoinGroup: PropTypes.bool,
+}
+
+ComposeForm.defaultProps = {
+  showSearch: false,
+}
+
+export default injectIntl(ComposeForm)

app/javascript/gabsocial/features/compose/components/emoji_picker_button.js

@@ -5,37 +5,8 @@ import { defineMessages, injectIntl } from 'react-intl'
 import { openPopover } from '../../../actions/popover'
 import ComposeExtraButton from './compose_extra_button'
 
-const messages = defineMessages({
-  emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
-})
-
-const mapStateToProps = (state) => ({
-  active: state.getIn(['popover', 'popoverType']) === 'EMOJI_PICKER',
-})
-
-const mapDispatchToProps = (dispatch) => ({
-
-  onClick(targetRef) {
-    dispatch(openPopover('EMOJI_PICKER', {
-      targetRef,
-    }))
-  },
-
-})
-
-export default
-@injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class EmojiPickerButton extends React.PureComponent {
 
-  static propTypes = {
-    intl: PropTypes.object.isRequired,
-    onClick: PropTypes.func.isRequired,
-    active: PropTypes.bool,
-    small: PropTypes.bool,
-    isMatch: PropTypes.bool,
-  }
-
   handleClick = (e) => {
     e.preventDefault()
     this.props.onClick(this.button)
@@ -66,3 +37,31 @@ class EmojiPickerButton extends React.PureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
+})
+
+const mapStateToProps = (state) => ({
+  active: state.getIn(['popover', 'popoverType']) === 'EMOJI_PICKER',
+})
+
+const mapDispatchToProps = (dispatch) => ({
+
+  onClick(targetRef) {
+    dispatch(openPopover('EMOJI_PICKER', {
+      targetRef,
+    }))
+  },
+
+})
+
+EmojiPickerButton.propTypes = {
+  intl: PropTypes.object.isRequired,
+  onClick: PropTypes.func.isRequired,
+  active: PropTypes.bool,
+  small: PropTypes.bool,
+  isMatch: PropTypes.bool,
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(EmojiPickerButton))

app/javascript/gabsocial/features/compose/components/expires_post_button.js

@@ -8,42 +8,8 @@ import { me } from '../../../initial_state'
 import { POPOVER_STATUS_EXPIRATION_OPTIONS } from '../../../constants'
 import ComposeExtraButton from './compose_extra_button'
 
-const messages = defineMessages({
-  expires: { id: 'expiration.title', defaultMessage: 'Add status expiration' },
-})
-
-const mapStateToProps = (state) => ({
-  hasScheduledAt: !!state.getIn(['compose', 'scheduled_at']),
-  active: !!state.getIn(['compose', 'expires_at']) || state.getIn(['popover', 'popoverType']) === POPOVER_STATUS_EXPIRATION_OPTIONS,
-  isPro: state.getIn(['accounts', me, 'is_pro']),
-})
-
-const mapDispatchToProps = (dispatch) => ({
-  onOpenExpirationPopover(targetRef) {
-    dispatch(openPopover(POPOVER_STATUS_EXPIRATION_OPTIONS, {
-      targetRef,
-    }))
-  },
-  onOpenProUpgradeModal() {
-    dispatch(openModal('PRO_UPGRADE'))
-  },
-})
-
-export default
-@injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class ExpiresPostButton extends React.PureComponent {
 
-  static propTypes = {
-    active: PropTypes.bool.isRequired,
-    intl: PropTypes.object.isRequired,
-    isPro: PropTypes.bool,
-    hasScheduledAt: PropTypes.bool,
-    onOpenProUpgradeModal: PropTypes.func.isRequired,
-    onOpenExpirationPopover: PropTypes.func.isRequired,
-    small: PropTypes.bool,
-  }
-
   handleToggle = () => {
     if (!this.props.isPro) {
       this.props.onOpenProUpgradeModal()
@@ -79,3 +45,36 @@ class ExpiresPostButton extends React.PureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  expires: { id: 'expiration.title', defaultMessage: 'Add status expiration' },
+})
+
+const mapStateToProps = (state) => ({
+  hasScheduledAt: !!state.getIn(['compose', 'scheduled_at']),
+  active: !!state.getIn(['compose', 'expires_at']) || state.getIn(['popover', 'popoverType']) === POPOVER_STATUS_EXPIRATION_OPTIONS,
+  isPro: state.getIn(['accounts', me, 'is_pro']),
+})
+
+const mapDispatchToProps = (dispatch) => ({
+  onOpenExpirationPopover(targetRef) {
+    dispatch(openPopover(POPOVER_STATUS_EXPIRATION_OPTIONS, {
+      targetRef,
+    }))
+  },
+  onOpenProUpgradeModal() {
+    dispatch(openModal('PRO_UPGRADE'))
+  },
+})
+
+ExpiresPostButton.propTypes = {
+  active: PropTypes.bool.isRequired,
+  intl: PropTypes.object.isRequired,
+  isPro: PropTypes.bool,
+  hasScheduledAt: PropTypes.bool,
+  onOpenProUpgradeModal: PropTypes.func.isRequired,
+  onOpenExpirationPopover: PropTypes.func.isRequired,
+  small: PropTypes.bool,
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(ExpiresPostButton))

app/javascript/gabsocial/features/compose/components/gif_form.js

@@ -4,23 +4,8 @@ import { connect } from 'react-redux'
 import { clearSelectedGif } from '../../../actions/tenor'
 import Image from '../../../components/image'
 
-const mapDispatchToProps = (dispatch) => ({
-  onClearSelectedGif() {
-    dispatch(clearSelectedGif())
-  },
-})
-
-export default
-@connect(null, mapDispatchToProps)
 class GifForm extends React.PureComponent {
 
-  static propTypes = {
-    onClearSelectedGif: PropTypes.func.isRequired,
-    replyToId: PropTypes.string,
-    small: PropTypes.bool,
-    selectedGifSrc: PropTypes.string.isRequired,
-  }
-
   render () {
     const {
       selectedGifSrc,
@@ -43,3 +28,18 @@ class GifForm extends React.PureComponent {
   }
 
 }
+
+const mapDispatchToProps = (dispatch) => ({
+  onClearSelectedGif() {
+    dispatch(clearSelectedGif())
+  },
+})
+
+GifForm.propTypes = {
+  onClearSelectedGif: PropTypes.func.isRequired,
+  replyToId: PropTypes.string,
+  small: PropTypes.bool,
+  selectedGifSrc: PropTypes.string.isRequired,
+}
+
+export default connect(null, mapDispatchToProps)(GifForm)

app/javascript/gabsocial/features/compose/components/gif_selector_button.js

@@ -5,36 +5,8 @@ import { injectIntl, defineMessages } from 'react-intl'
 import ComposeExtraButton from './compose_extra_button'
 import { openModal } from '../../../actions/modal'
 
-const messages = defineMessages({
-  marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
-  unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
-  title: { id: 'compose_form.gif.title', defaultMessage: 'Insert gif' },
-})
-
-const mapStateToProps = (state) => ({
-  active: !!state.getIn(['compose', 'gif']) || state.getIn(['modal', 'modalType']) === 'GIF_PICKER',
-})
-
-const mapDispatchToProps = (dispatch) => ({
-
-  onClick() {
-    dispatch(openModal('GIF_PICKER'))
-  },
-
-})
-
-export default
-@injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class GifSelectorButton extends React.PureComponent {
 
-  static propTypes = {
-    intl: PropTypes.object.isRequired,
-    onClick: PropTypes.func.isRequired,
-    active: PropTypes.bool,
-    small: PropTypes.bool,
-  }
-
   handleClick = (e) => {
     e.preventDefault()
     this.props.onClick(this.button)
@@ -60,3 +32,30 @@ class GifSelectorButton extends React.PureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
+  unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
+  title: { id: 'compose_form.gif.title', defaultMessage: 'Insert gif' },
+})
+
+const mapStateToProps = (state) => ({
+  active: !!state.getIn(['compose', 'gif']) || state.getIn(['modal', 'modalType']) === 'GIF_PICKER',
+})
+
+const mapDispatchToProps = (dispatch) => ({
+
+  onClick() {
+    dispatch(openModal('GIF_PICKER'))
+  },
+
+})
+
+GifSelectorButton.propTypes = {
+  intl: PropTypes.object.isRequired,
+  onClick: PropTypes.func.isRequired,
+  active: PropTypes.bool,
+  small: PropTypes.bool,
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(GifSelectorButton))

app/javascript/gabsocial/features/compose/components/media_upload_button.js

@@ -7,42 +7,8 @@ import { defineMessages, injectIntl } from 'react-intl'
 import { uploadCompose } from '../../../actions/compose'
 import ComposeExtraButton from './compose_extra_button'
 
-const messages = defineMessages({
-  upload: { id: 'upload_button.label', defaultMessage: 'Add media (JPEG, PNG, GIF, WebM, MP4, MOV)' },
-  title: { id: 'upload_button.title', defaultMessage: 'Photo/Video' },
-})
-
-const makeMapStateToProps = () => {
-  const mapStateToProps = (state) => ({
-    acceptContentTypes: state.getIn(['media_attachments', 'accept_content_types']),
-    disabled: state.getIn(['compose', 'is_uploading']) || (state.getIn(['compose', 'media_attachments']).size + state.getIn(['compose', 'pending_media_attachments']) > 3 || state.getIn(['compose', 'media_attachments']).some(m => ['video', 'audio', 'gifv'].includes(m.get('type')))),
-    unavailable: state.getIn(['compose', 'poll']) !== null,
-    resetFileKey: state.getIn(['compose', 'resetFileKey']),
-  })
-
-  return mapStateToProps
-}
-
-const mapDispatchToProps = (dispatch) => ({
-  onSelectFile: (files) => dispatch(uploadCompose(files)),
-})
-
-export default
-@connect(makeMapStateToProps, mapDispatchToProps)
-@injectIntl
 class UploadButton extends ImmutablePureComponent {
 
-  static propTypes = {
-    disabled: PropTypes.bool,
-    unavailable: PropTypes.bool,
-    onSelectFile: PropTypes.func.isRequired,
-    style: PropTypes.object,
-    resetFileKey: PropTypes.number,
-    acceptContentTypes: ImmutablePropTypes.listOf(PropTypes.string).isRequired,
-    intl: PropTypes.object.isRequired,
-    small: PropTypes.bool,
-  }
-
   handleChange = (e) => {
     if (e.target.files.length > 0) {
       this.props.onSelectFile(e.target.files)
@@ -88,3 +54,36 @@ class UploadButton extends ImmutablePureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  upload: { id: 'upload_button.label', defaultMessage: 'Add media (JPEG, PNG, GIF, WebM, MP4, MOV)' },
+  title: { id: 'upload_button.title', defaultMessage: 'Photo/Video' },
+})
+
+const makeMapStateToProps = () => {
+  const mapStateToProps = (state) => ({
+    acceptContentTypes: state.getIn(['media_attachments', 'accept_content_types']),
+    disabled: state.getIn(['compose', 'is_uploading']) || (state.getIn(['compose', 'media_attachments']).size + state.getIn(['compose', 'pending_media_attachments']) > 3 || state.getIn(['compose', 'media_attachments']).some(m => ['video', 'audio', 'gifv'].includes(m.get('type')))),
+    unavailable: state.getIn(['compose', 'poll']) !== null,
+    resetFileKey: state.getIn(['compose', 'resetFileKey']),
+  })
+
+  return mapStateToProps
+}
+
+const mapDispatchToProps = (dispatch) => ({
+  onSelectFile: (files) => dispatch(uploadCompose(files)),
+})
+
+UploadButton.propTypes = {
+  disabled: PropTypes.bool,
+  unavailable: PropTypes.bool,
+  onSelectFile: PropTypes.func.isRequired,
+  style: PropTypes.object,
+  resetFileKey: PropTypes.number,
+  acceptContentTypes: ImmutablePropTypes.listOf(PropTypes.string).isRequired,
+  intl: PropTypes.object.isRequired,
+  small: PropTypes.bool,
+}
+
+export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(UploadButton))

app/javascript/gabsocial/features/compose/components/media_upload_item.js

@@ -14,44 +14,12 @@ import Text from '../../../components/text'
 
 const cx = classNames.bind(_s)
 
-const messages = defineMessages({
-  description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' },
-  delete: { id: 'upload_form.undo', defaultMessage: 'Delete' },
-})
-
-const mapStateToProps = (state, { id }) => ({
-  media: state.getIn(['compose', 'media_attachments']).find(item => item.get('id') === id),
-})
-
-const mapDispatchToProps = (dispatch) => ({
-  onUndo: (id) => {
-    dispatch(undoUploadCompose(id))
-  },
-  onDescriptionChange: (id, description) => {
-    dispatch(changeUploadCompose(id, { description }))
-  },
-  onSubmit () {
-    dispatch(submitCompose())
-  },
-});
-
-export default
-@injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class Upload extends ImmutablePureComponent {
 
   static contextTypes = {
     router: PropTypes.object,
   }
 
-  static propTypes = {
-    media: ImmutablePropTypes.map.isRequired,
-    intl: PropTypes.object.isRequired,
-    onUndo: PropTypes.func.isRequired,
-    onDescriptionChange: PropTypes.func.isRequired,
-    onSubmit: PropTypes.func.isRequired,
-  }
-
   state = {
     hovered: false,
     focused: false,
@@ -177,3 +145,34 @@ class Upload extends ImmutablePureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' },
+  delete: { id: 'upload_form.undo', defaultMessage: 'Delete' },
+})
+
+const mapStateToProps = (state, { id }) => ({
+  media: state.getIn(['compose', 'media_attachments']).find(item => item.get('id') === id),
+})
+
+const mapDispatchToProps = (dispatch) => ({
+  onUndo: (id) => {
+    dispatch(undoUploadCompose(id))
+  },
+  onDescriptionChange: (id, description) => {
+    dispatch(changeUploadCompose(id, { description }))
+  },
+  onSubmit () {
+    dispatch(submitCompose())
+  },
+});
+
+Upload.propTypes = {
+  media: ImmutablePropTypes.map.isRequired,
+  intl: PropTypes.object.isRequired,
+  onUndo: PropTypes.func.isRequired,
+  onDescriptionChange: PropTypes.func.isRequired,
+  onSubmit: PropTypes.func.isRequired,
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(Upload))

app/javascript/gabsocial/features/compose/components/poll_button.js

@@ -5,6 +5,31 @@ import { defineMessages, injectIntl } from 'react-intl'
 import { addPoll, removePoll } from '../../../actions/compose'
 import ComposeExtraButton from './compose_extra_button'
 
+class PollButton extends React.PureComponent {
+
+  handleClick = () => {
+    this.props.onClick()
+  }
+
+  render() {
+    const { intl, active, unavailable, disabled, small } = this.props
+
+    if (unavailable) return null
+
+    return (
+      <ComposeExtraButton
+        title={intl.formatMessage(active ? messages.remove_poll : messages.title)}
+        disabled={disabled}
+        onClick={this.handleClick}
+        icon='poll'
+        small={small}
+        active={active}
+      />
+    )
+  }
+
+}
+
 const messages = defineMessages({
   add_poll: { id: 'poll_button.add_poll', defaultMessage: 'Add poll' },
   title: { id: 'poll_button.title', defaultMessage: 'Poll' },
@@ -30,39 +55,13 @@ const mapDispatchToProps = (dispatch) => ({
 
 })
 
-export default
+PollButton.propTypes = {
-@connect(mapStateToProps, mapDispatchToProps)
+  disabled: PropTypes.bool,
-@injectIntl
+  unavailable: PropTypes.bool,
-class PollButton extends React.PureComponent {
+  active: PropTypes.bool,
-
+  onClick: PropTypes.func.isRequired,
-  static propTypes = {
+  intl: PropTypes.object.isRequired,
-    disabled: PropTypes.bool,
+  small: PropTypes.bool,
-    unavailable: PropTypes.bool,
-    active: PropTypes.bool,
-    onClick: PropTypes.func.isRequired,
-    intl: PropTypes.object.isRequired,
-    small: PropTypes.bool,
-  }
-
-  handleClick = () => {
-    this.props.onClick()
-  }
-
-  render() {
-    const { intl, active, unavailable, disabled, small } = this.props
-
-    if (unavailable) return null
-
-    return (
-      <ComposeExtraButton
-        title={intl.formatMessage(active ? messages.remove_poll : messages.title)}
-        disabled={disabled}
-        onClick={this.handleClick}
-        icon='poll'
-        small={small}
-        active={active}
-      />
-    )
-  }
-
 }
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(PollButton))

app/javascript/gabsocial/features/compose/components/poll_form.js

@@ -18,57 +18,8 @@ import Input from '../../../components/input'
 
 const cx = classNames.bind(_s)
 
-const messages = defineMessages({
-  option_placeholder: { id: 'compose_form.poll.option_placeholder', defaultMessage: 'Choice {number}' },
-  add_option: { id: 'compose_form.poll.add_option', defaultMessage: 'Add a choice' },
-  remove_option: { id: 'compose_form.poll.remove_option', defaultMessage: 'Remove this choice' },
-  poll_duration: { id: 'compose_form.poll.duration', defaultMessage: 'Poll duration' },
-  minutes: { id: 'intervals.full.minutes', defaultMessage: '{number, plural, one {# minute} other {# minutes}}' },
-  hours: { id: 'intervals.full.hours', defaultMessage: '{number, plural, one {# hour} other {# hours}}' },
-  days: { id: 'intervals.full.days', defaultMessage: '{number, plural, one {# day} other {# days}}' },
-})
-
-const mapStateToProps = (state) => ({
-  options: state.getIn(['compose', 'poll', 'options']),
-  expiresIn: state.getIn(['compose', 'poll', 'expires_in']),
-  isMultiple: state.getIn(['compose', 'poll', 'multiple']),
-})
-
-const mapDispatchToProps = (dispatch) => ({
-  onAddOption() {
-    dispatch(addPollOption(''))
-  },
-
-  onRemoveOption(index) {
-    dispatch(removePollOption(index))
-  },
-
-  onChangeOption(index, title) {
-    dispatch(changePollOption(index, title))
-  },
-
-  onChangeSettings(expiresIn, isMultiple) {
-    dispatch(changePollSettings(expiresIn, isMultiple))
-  },
-
-})
-
-export default
-@injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class PollForm extends ImmutablePureComponent {
 
-  static propTypes = {
-    options: ImmutablePropTypes.list,
-    expiresIn: PropTypes.number,
-    isMultiple: PropTypes.bool,
-    onChangeOption: PropTypes.func.isRequired,
-    onAddOption: PropTypes.func.isRequired,
-    onRemoveOption: PropTypes.func.isRequired,
-    onChangeSettings: PropTypes.func.isRequired,
-    intl: PropTypes.object.isRequired,
-  }
-
   handleSelectDuration = (e) => {
     this.props.onChangeSettings(e.target.value, this.props.isMultiple)
   }
@@ -243,3 +194,51 @@ class PollFormOption extends ImmutablePureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  option_placeholder: { id: 'compose_form.poll.option_placeholder', defaultMessage: 'Choice {number}' },
+  add_option: { id: 'compose_form.poll.add_option', defaultMessage: 'Add a choice' },
+  remove_option: { id: 'compose_form.poll.remove_option', defaultMessage: 'Remove this choice' },
+  poll_duration: { id: 'compose_form.poll.duration', defaultMessage: 'Poll duration' },
+  minutes: { id: 'intervals.full.minutes', defaultMessage: '{number, plural, one {# minute} other {# minutes}}' },
+  hours: { id: 'intervals.full.hours', defaultMessage: '{number, plural, one {# hour} other {# hours}}' },
+  days: { id: 'intervals.full.days', defaultMessage: '{number, plural, one {# day} other {# days}}' },
+})
+
+const mapStateToProps = (state) => ({
+  options: state.getIn(['compose', 'poll', 'options']),
+  expiresIn: state.getIn(['compose', 'poll', 'expires_in']),
+  isMultiple: state.getIn(['compose', 'poll', 'multiple']),
+})
+
+const mapDispatchToProps = (dispatch) => ({
+  onAddOption() {
+    dispatch(addPollOption(''))
+  },
+
+  onRemoveOption(index) {
+    dispatch(removePollOption(index))
+  },
+
+  onChangeOption(index, title) {
+    dispatch(changePollOption(index, title))
+  },
+
+  onChangeSettings(expiresIn, isMultiple) {
+    dispatch(changePollSettings(expiresIn, isMultiple))
+  },
+
+})
+
+PollForm.propTypes = {
+  options: ImmutablePropTypes.list,
+  expiresIn: PropTypes.number,
+  isMultiple: PropTypes.bool,
+  onChangeOption: PropTypes.func.isRequired,
+  onAddOption: PropTypes.func.isRequired,
+  onRemoveOption: PropTypes.func.isRequired,
+  onChangeSettings: PropTypes.func.isRequired,
+  intl: PropTypes.object.isRequired,
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(PollForm))

app/javascript/gabsocial/features/compose/components/rich_text_editor_button.js

@@ -7,42 +7,8 @@ import { openModal } from '../../../actions/modal'
 import { me } from '../../../initial_state'
 import ComposeExtraButton from './compose_extra_button'
 
-const messages = defineMessages({
-  marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
-  unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
-  title: { id: 'compose_form.rte.title', defaultMessage: 'Rich Text Editor' },
-})
-
-const mapStateToProps = (state) => ({
-  active: state.getIn(['compose', 'rte_controls_visible']),
-  isPro: state.getIn(['accounts', me, 'is_pro']),
-})
-
-const mapDispatchToProps = (dispatch) => ({
-
-  onChangeRichTextEditorControlsVisibility() {
-    dispatch(changeRichTextEditorControlsVisibility())
-  },
-
-  onOpenProUpgradeModal() {
-    dispatch(openModal('PRO_UPGRADE'))
-  },
-})
-
-export default
-@injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class RichTextEditorButton extends React.PureComponent {
 
-  static propTypes = {
-    active: PropTypes.bool,
-    intl: PropTypes.object.isRequired,
-    small: PropTypes.bool,
-    isPro: PropTypes.bool,
-    onOpenProUpgradeModal: PropTypes.func.isRequired,
-    onChangeRichTextEditorControlsVisibility: PropTypes.func.isRequired,
-  }
-
   handleClick = (e) => {
     e.preventDefault()
     if (!this.props.isPro) {
@@ -67,3 +33,36 @@ class RichTextEditorButton extends React.PureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
+  unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
+  title: { id: 'compose_form.rte.title', defaultMessage: 'Rich Text Editor' },
+})
+
+const mapStateToProps = (state) => ({
+  active: state.getIn(['compose', 'rte_controls_visible']),
+  isPro: state.getIn(['accounts', me, 'is_pro']),
+})
+
+const mapDispatchToProps = (dispatch) => ({
+
+  onChangeRichTextEditorControlsVisibility() {
+    dispatch(changeRichTextEditorControlsVisibility())
+  },
+
+  onOpenProUpgradeModal() {
+    dispatch(openModal('PRO_UPGRADE'))
+  },
+})
+
+RichTextEditorButton.propTypes = {
+  active: PropTypes.bool,
+  intl: PropTypes.object.isRequired,
+  small: PropTypes.bool,
+  isPro: PropTypes.bool,
+  onOpenProUpgradeModal: PropTypes.func.isRequired,
+  onChangeRichTextEditorControlsVisibility: PropTypes.func.isRequired,
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(RichTextEditorButton))

app/javascript/gabsocial/features/compose/components/schedule_post_button.js

@@ -9,48 +9,8 @@ import ComposeExtraButton from './compose_extra_button'
 
 // import 'react-datepicker/dist/react-datepicker.css'
 
-const messages = defineMessages({
-  schedule_status: { id: 'schedule_status.title', defaultMessage: 'Schedule' },
-})
-
-const mapStateToProps = (state) => ({
-  hasExpiresAt: !!state.getIn(['compose', 'expires_at']),
-  active: !!state.getIn(['compose', 'scheduled_at']) || state.getIn(['popover', 'popoverType']) === 'DATE_PICKER',
-  isPro: state.getIn(['accounts', me, 'is_pro']),
-})
-
-const mapDispatchToProps = (dispatch) => ({
-  onOpenDatePickerPopover(targetRef) {
-    dispatch(openPopover('DATE_PICKER', {
-      targetRef,
-    }))
-  },
-
-  onCloseDatePickerPopover() {
-    dispatch(closePopover())
-  },
-
-  onOpenProUpgradeModal() {
-    dispatch(openModal('PRO_UPGRADE'))
-  },
-})
-
-export default
-@injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class SchedulePostButton extends React.PureComponent {
 
-  static propTypes = {
-    active: PropTypes.bool.isRequired,
-    intl: PropTypes.object.isRequired,
-    isPro: PropTypes.bool,
-    hasExpiresAt: PropTypes.bool,
-    onOpenProUpgradeModal: PropTypes.func.isRequired,
-    onOpenDatePickerPopover: PropTypes.func.isRequired,
-    onCloseDatePickerPopover: PropTypes.func.isRequired,
-    small: PropTypes.bool,
-  }
-
   handleToggle = () => {
     if (!this.props.isPro) {
       this.props.onOpenProUpgradeModal()
@@ -86,3 +46,42 @@ class SchedulePostButton extends React.PureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  schedule_status: { id: 'schedule_status.title', defaultMessage: 'Schedule' },
+})
+
+const mapStateToProps = (state) => ({
+  hasExpiresAt: !!state.getIn(['compose', 'expires_at']),
+  active: !!state.getIn(['compose', 'scheduled_at']) || state.getIn(['popover', 'popoverType']) === 'DATE_PICKER',
+  isPro: state.getIn(['accounts', me, 'is_pro']),
+})
+
+const mapDispatchToProps = (dispatch) => ({
+  onOpenDatePickerPopover(targetRef) {
+    dispatch(openPopover('DATE_PICKER', {
+      targetRef,
+    }))
+  },
+
+  onCloseDatePickerPopover() {
+    dispatch(closePopover())
+  },
+
+  onOpenProUpgradeModal() {
+    dispatch(openModal('PRO_UPGRADE'))
+  },
+})
+
+SchedulePostButton.propTypes = {
+  active: PropTypes.bool.isRequired,
+  intl: PropTypes.object.isRequired,
+  isPro: PropTypes.bool,
+  hasExpiresAt: PropTypes.bool,
+  onOpenProUpgradeModal: PropTypes.func.isRequired,
+  onOpenDatePickerPopover: PropTypes.func.isRequired,
+  onCloseDatePickerPopover: PropTypes.func.isRequired,
+  small: PropTypes.bool,
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(SchedulePostButton))

app/javascript/gabsocial/features/compose/components/sensitive_media_button.js

@@ -5,35 +5,8 @@ import { injectIntl, defineMessages } from 'react-intl'
 import { changeComposeSensitivity } from '../../../actions/compose'
 import Switch from '../../../components/switch'
 
-const messages = defineMessages({
-  markAsSensitive: { id: 'compose_form.sensitive.hide', defaultMessage: 'Mark media as sensitive' },
-})
-
-const mapStateToProps = (state) => ({
-  active: state.getIn(['compose', 'sensitive']),
-  disabled: state.getIn(['compose', 'spoiler']),
-})
-
-const mapDispatchToProps = (dispatch) => ({
-
-  onClick () {
-    dispatch(changeComposeSensitivity())
-  },
-
-})
-
-export default
-@injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class SensitiveMediaButton extends React.PureComponent {
 
-  static propTypes = {
-    active: PropTypes.bool,
-    disabled: PropTypes.bool,
-    onClick: PropTypes.func.isRequired,
-    intl: PropTypes.object.isRequired,
-  }
-
   render () {
     const { active, disabled, onClick, intl } = this.props
 
@@ -52,3 +25,29 @@ class SensitiveMediaButton extends React.PureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  markAsSensitive: { id: 'compose_form.sensitive.hide', defaultMessage: 'Mark media as sensitive' },
+})
+
+const mapStateToProps = (state) => ({
+  active: state.getIn(['compose', 'sensitive']),
+  disabled: state.getIn(['compose', 'spoiler']),
+})
+
+const mapDispatchToProps = (dispatch) => ({
+
+  onClick () {
+    dispatch(changeComposeSensitivity())
+  },
+
+})
+
+SensitiveMediaButton.propTypes = {
+  active: PropTypes.bool,
+  disabled: PropTypes.bool,
+  onClick: PropTypes.func.isRequired,
+  intl: PropTypes.object.isRequired,
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(SensitiveMediaButton))

app/javascript/gabsocial/features/compose/components/spoiler_button.js

@@ -5,35 +5,8 @@ import { injectIntl, defineMessages } from 'react-intl'
 import { changeComposeSpoilerness } from '../../../actions/compose'
 import ComposeExtraButton from './compose_extra_button'
 
-const messages = defineMessages({
-  marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
-  unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
-  title: { id: 'compose_form.spoiler.title', defaultMessage: 'Warning' },
-})
-
-const mapStateToProps = (state) => ({
-  active: state.getIn(['compose', 'spoiler']),
-})
-
-const mapDispatchToProps = (dispatch) => ({
-
-  onClick () {
-    dispatch(changeComposeSpoilerness())
-  },
-
-})
-
-export default
-@injectIntl
-@connect(mapStateToProps, mapDispatchToProps)
 class SpoilerButton extends React.PureComponent {
 
-  static propTypes = {
-    active: PropTypes.bool,
-    intl: PropTypes.object.isRequired,
-    small: PropTypes.bool,
-  }
-
   handleClick = (e) => {
     e.preventDefault()
     this.props.onClick()
@@ -54,3 +27,29 @@ class SpoilerButton extends React.PureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
+  unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
+  title: { id: 'compose_form.spoiler.title', defaultMessage: 'Warning' },
+})
+
+const mapStateToProps = (state) => ({
+  active: state.getIn(['compose', 'spoiler']),
+})
+
+const mapDispatchToProps = (dispatch) => ({
+
+  onClick () {
+    dispatch(changeComposeSpoilerness())
+  },
+
+})
+
+SpoilerButton.propTypes = {
+  active: PropTypes.bool,
+  intl: PropTypes.object.isRequired,
+  small: PropTypes.bool,
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(SpoilerButton))

app/javascript/gabsocial/features/compose/components/status_visibility_button.js

@@ -5,38 +5,8 @@ import { defineMessages, injectIntl } from 'react-intl'
 import { openPopover } from '../../../actions/popover'
 import ComposeExtraButton from './compose_extra_button'
 
-const messages = defineMessages({
-  visibility: { id: 'privacy.visibility', defaultMessage: 'Visibility' },
-})
-
-const mapStateToProps = (state) => ({
-  value: state.getIn(['compose', 'privacy']),
-})
-
-const mapDispatchToProps = (dispatch) => ({
-  onOpenPopover(targetRef) {
-    dispatch(openPopover('STATUS_VISIBILITY', {
-      targetRef,
-    }))
-  },
-})
-
-export default
-@connect(mapStateToProps, mapDispatchToProps)
-@injectIntl
 class StatusVisibilityButton extends React.PureComponent {
 
-  static propTypes = {
-    intl: PropTypes.object.isRequired,
-    small: PropTypes.bool,
-    onOpenPopover: PropTypes.func.isRequired,
-    value: PropTypes.oneOf([
-      'private',
-      'unlisted',
-      'public',
-    ]),
-  }
-
   handleOnClick = () => {
     this.props.onOpenPopover(this.button)
   }
@@ -77,3 +47,32 @@ class StatusVisibilityButton extends React.PureComponent {
   }
 
 }
+
+const messages = defineMessages({
+  visibility: { id: 'privacy.visibility', defaultMessage: 'Visibility' },
+})
+
+const mapStateToProps = (state) => ({
+  value: state.getIn(['compose', 'privacy']),
+})
+
+const mapDispatchToProps = (dispatch) => ({
+  onOpenPopover(targetRef) {
+    dispatch(openPopover('STATUS_VISIBILITY', {
+      targetRef,
+    }))
+  },
+})
+
+StatusVisibilityButton.propTypes = {
+  intl: PropTypes.object.isRequired,
+  small: PropTypes.bool,
+  onOpenPopover: PropTypes.func.isRequired,
+  value: PropTypes.oneOf([
+    'private',
+    'unlisted',
+    'public',
+  ]),
+}
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(StatusVisibilityButton))

app/javascript/gabsocial/features/compose/components/upload_form.js

@@ -7,23 +7,8 @@ import ProgressBar from '../../../components/progress_bar'
 import Upload from './media_upload_item'
 import SensitiveMediaButton from './sensitive_media_button'
 
-const mapStateToProps = (state) => ({
-  mediaIds: state.getIn(['compose', 'media_attachments']).map(item => item.get('id')),
-  isUploading: state.getIn(['compose', 'is_uploading']),
-  uploadProgress: state.getIn(['compose', 'progress'], 0),
-});
-
-export default
-@connect(mapStateToProps)
 class UploadForm extends ImmutablePureComponent {
 
-  static propTypes = {
-    isModalOpen: PropTypes.bool,
-    isUploading: PropTypes.bool,
-    mediaIds: ImmutablePropTypes.list.isRequired,
-    uploadProgress: PropTypes.number,
-  };
-
   render () {
     const {
       mediaIds,
@@ -55,3 +40,18 @@ class UploadForm extends ImmutablePureComponent {
   }
 
 }
+
+const mapStateToProps = (state) => ({
+  mediaIds: state.getIn(['compose', 'media_attachments']).map(item => item.get('id')),
+  isUploading: state.getIn(['compose', 'is_uploading']),
+  uploadProgress: state.getIn(['compose', 'progress'], 0),
+})
+
+UploadForm.propTypes = {
+  isModalOpen: PropTypes.bool,
+  isUploading: PropTypes.bool,
+  mediaIds: ImmutablePropTypes.list.isRequired,
+  uploadProgress: PropTypes.number,
+}
+
+export default connect(mapStateToProps)(UploadForm)

app/javascript/gabsocial/features/compose/compose.js

@@ -4,18 +4,8 @@ import { connect } from 'react-redux'
 import { clearCompose } from '../../actions/compose'
 import ComposeFormContainer from './containers/compose_form_container'
 
-const mapDispatchToProps = (dispatch) => ({
-  onClearCompose:() => dispatch(clearCompose())
-})
-
-export default
-@connect(null, mapDispatchToProps)
 class Compose extends React.PureComponent {
 
-  static propTypes = {
-    onClearCompose: PropTypes.func.isRequired,
-  }
-
   componentWillUnmount() {
     this.props.onClearCompose()
   }
@@ -29,3 +19,13 @@ class Compose extends React.PureComponent {
   }
 
 }
+
+const mapDispatchToProps = (dispatch) => ({
+  onClearCompose:() => dispatch(clearCompose())
+})
+
+Compose.propTypes = {
+  onClearCompose: PropTypes.func.isRequired,
+}
+
+export default connect(null, mapDispatchToProps)(Compose)

app/javascript/gabsocial/features/ui/ui.js

@@ -131,12 +131,6 @@ const keyMap = {
 
 class SwitchingArea extends React.PureComponent {
 
-  static propTypes = {
-    children: PropTypes.node,
-    location: PropTypes.object,
-    onLayoutChange: PropTypes.func.isRequired,
-  }
-
   componentDidMount() {
     window.addEventListener('resize', this.handleResize, {
       passive: true
@@ -264,26 +258,18 @@ class SwitchingArea extends React.PureComponent {
   }
 }
 
-export default
+SwitchingArea.propTypes = {
-@connect(mapStateToProps)
+  children: PropTypes.node,
-@injectIntl
+  location: PropTypes.object,
-@withRouter
+  onLayoutChange: PropTypes.func.isRequired,
+}
+
 class UI extends React.PureComponent {
 
   static contextTypes = {
     router: PropTypes.object.isRequired,
   }
 
-  static propTypes = {
-    dispatch: PropTypes.func.isRequired,
-    children: PropTypes.node,
-    isComposing: PropTypes.bool,
-    hasComposingText: PropTypes.bool,
-    hasMediaAttachments: PropTypes.bool,
-    location: PropTypes.object,
-    intl: PropTypes.object.isRequired,
-  }
-
   state = {
     fetchedHome: false,
     fetchedNotifications: false,
@@ -589,3 +575,15 @@ class UI extends React.PureComponent {
   }
 
 }
+
+UI.propTypes = {
+  dispatch: PropTypes.func.isRequired,
+  children: PropTypes.node,
+  isComposing: PropTypes.bool,
+  hasComposingText: PropTypes.bool,
+  hasMediaAttachments: PropTypes.bool,
+  location: PropTypes.object,
+  intl: PropTypes.object.isRequired,
+}
+
+export default injectIntl(withRouter(connect(mapStateToProps)(UI)))

app/javascript/gabsocial/features/ui/util/bundle.js

@@ -7,45 +7,11 @@ import {
   fetchBundleFail,
 } from '../../../actions/bundles'
 
-const mapDispatchToProps = (dispatch) => ({
-  onFetch() {
-    dispatch(fetchBundleRequest())
-  },
-  onFetchSuccess() {
-    dispatch(fetchBundleSuccess())
-  },
-  onFetchFail(error) {
-    dispatch(fetchBundleFail(error))
-  },
-})
-
 const emptyComponent = () => null
 const noop = () => { }
 
-export default
-@connect(null, mapDispatchToProps)
 class Bundle extends React.PureComponent {
 
-  static propTypes = {
-    fetchComponent: PropTypes.func.isRequired,
-    loading: PropTypes.func,
-    error: PropTypes.func,
-    children: PropTypes.func.isRequired,
-    renderDelay: PropTypes.number,
-    onFetch: PropTypes.func,
-    onFetchSuccess: PropTypes.func,
-    onFetchFail: PropTypes.func,
-  }
-
-  static defaultProps = {
-    loading: emptyComponent,
-    error: emptyComponent,
-    renderDelay: 0,
-    onFetch: noop,
-    onFetchSuccess: noop,
-    onFetchFail: noop,
-  }
-
   static cache = new Map
 
   state = {
@@ -145,3 +111,37 @@ class Bundle extends React.PureComponent {
   }
 
 }
+
+const mapDispatchToProps = (dispatch) => ({
+  onFetch() {
+    dispatch(fetchBundleRequest())
+  },
+  onFetchSuccess() {
+    dispatch(fetchBundleSuccess())
+  },
+  onFetchFail(error) {
+    dispatch(fetchBundleFail(error))
+  },
+})
+
+Bundle.propTypes = {
+  fetchComponent: PropTypes.func.isRequired,
+  loading: PropTypes.func,
+  error: PropTypes.func,
+  children: PropTypes.func.isRequired,
+  renderDelay: PropTypes.number,
+  onFetch: PropTypes.func,
+  onFetchSuccess: PropTypes.func,
+  onFetchFail: PropTypes.func,
+}
+
+Bundle.defaultProps = {
+  loading: emptyComponent,
+  error: emptyComponent,
+  renderDelay: 0,
+  onFetch: noop,
+  onFetchSuccess: noop,
+  onFetchFail: noop,
+}
+
+export default connect(null, mapDispatchToProps)(Bundle)

app/javascript/gabsocial/features/ui/util/reduced_motion.js

@@ -13,12 +13,6 @@ const extractValue = (value) => {
 
 class ReducedMotion extends React.PureComponent {
 
-  static propTypes = {
-    defaultStyle: PropTypes.object,
-    style: PropTypes.object,
-    children: PropTypes.func,
-  }
-
   render() {
 
     const { style, defaultStyle, children } = this.props;
@@ -41,4 +35,10 @@ class ReducedMotion extends React.PureComponent {
 
 }
 
-export default ReducedMotion;
+ReducedMotion.propTypes = {
+  defaultStyle: PropTypes.object,
+  style: PropTypes.object,
+  children: PropTypes.func,
+}
+
+export default ReducedMotion

app/javascript/gabsocial/features/ui/util/responsive_classes_component.js

@@ -11,16 +11,7 @@ import { getWindowDimension } from '../../../utils/is_mobile'
 
 const initialState = getWindowDimension()
 
-export default class ResponsiveClassesComponent extends React.PureComponent {
+class ResponsiveClassesComponent extends React.PureComponent {
-
-  static propTypes = {
-    classNames: PropTypes.string,
-    classNamesXL: PropTypes.string,
-    classNamesLarge: PropTypes.string,
-    classNamesMedium: PropTypes.string,
-    classNamesSmall: PropTypes.string,
-    classNamesXS: PropTypes.string,
-  }
 
   state = {
     width: initialState.width,
@@ -75,4 +66,15 @@ export default class ResponsiveClassesComponent extends React.PureComponent {
     )
   }
 
-}
+}
+
+ResponsiveClassesComponent.propTypes = {
+  classNames: PropTypes.string,
+  classNamesXL: PropTypes.string,
+  classNamesLarge: PropTypes.string,
+  classNamesMedium: PropTypes.string,
+  classNamesSmall: PropTypes.string,
+  classNamesXS: PropTypes.string,
+}
+
+export default ResponsiveClassesComponent

app/javascript/gabsocial/features/ui/util/responsive_component.js

@@ -4,17 +4,7 @@ import { getWindowDimension } from '../../../utils/is_mobile'
 
 const initialState = getWindowDimension()
 
-export default class Responsive extends React.PureComponent {
+class Responsive extends React.PureComponent {
-
-  static propTypes = {
-    min: PropTypes.number,
-    max: PropTypes.number,
-  }
-
-  static defaultProps = {
-    min: 0,
-    max: Infinity,
-  }
 
   state = {
     width: initialState.width,
@@ -48,4 +38,16 @@ export default class Responsive extends React.PureComponent {
     return shouldRender ? children : null
   }
 
-}
+}
+
+Responsive.propTypes = {
+  min: PropTypes.number,
+  max: PropTypes.number,
+}
+
+Responsive.defaultProps = {
+  min: 0,
+  max: Infinity,
+}
+
+export default Responsive

app/javascript/gabsocial/features/ui/util/wrapped_route.js

@@ -6,18 +6,7 @@ import BundleColumnError from '../../../components/bundle_column_error'
 import Bundle from './bundle'
 import { me } from '../../../initial_state'
 
-export default class WrappedRoute extends React.PureComponent {
+class WrappedRoute extends React.PureComponent {
-  static propTypes = {
-    component: PropTypes.func.isRequired,
-    page: PropTypes.func.isRequired,
-    content: PropTypes.node,
-    componentParams: PropTypes.object,
-    publicRoute: PropTypes.bool,
-  }
-
-  static defaultProps = {
-    componentParams: {},
-  }
 
   renderComponent = ({ match }) => {
     const {
@@ -74,3 +63,17 @@ export default class WrappedRoute extends React.PureComponent {
     return <Route {...rest} render={this.renderComponent} />
   }
 }
+
+WrappedRoute.propTypes = {
+  component: PropTypes.func.isRequired,
+  page: PropTypes.func.isRequired,
+  content: PropTypes.node,
+  componentParams: PropTypes.object,
+  publicRoute: PropTypes.bool,
+}
+
+WrappedRoute.defaultProps = {
+  componentParams: {},
+}
+
+export default WrappedRoute

app/javascript/gabsocial/layouts/about_layout.js

@@ -17,11 +17,7 @@ import {
   SidebarXS,
 } from '../features/ui/util/async_components'
 
-export default class SettingsLayout extends React.PureComponent {
+class SettingsLayout extends React.PureComponent {
-
-  static propTypes = {
-    title: PropTypes.string,
-  }
 
   componentWillMount() {
     this.menuItems = [
@@ -135,3 +131,9 @@ export default class SettingsLayout extends React.PureComponent {
   }
 
 }
+
+SettingsLayout.propTypes = {
+  title: PropTypes.string,
+}
+
+export default SettingsLayout

app/javascript/gabsocial/layouts/explore_layout.js

@@ -16,17 +16,7 @@ import {
   TrendsPanel,
 } from '../features/ui/util/async_components'
 
-export default class ExploreLayout extends ImmutablePureComponent {
+class ExploreLayout extends ImmutablePureComponent {
-
-  static propTypes = {
-    actions: PropTypes.array,
-    children: PropTypes.node,
-    group: ImmutablePropTypes.map,
-    groupId: PropTypes.string,
-    layout: PropTypes.object,
-    relationships: ImmutablePropTypes.map,
-    title: PropTypes.string,
-  }
 
   state = {
     lazyLoaded: false,
@@ -125,4 +115,16 @@ export default class ExploreLayout extends ImmutablePureComponent {
     )
   }
 
-}
+}
+
+ExploreLayout.propTypes = {
+  actions: PropTypes.array,
+  children: PropTypes.node,
+  group: ImmutablePropTypes.map,
+  groupId: PropTypes.string,
+  layout: PropTypes.object,
+  relationships: ImmutablePropTypes.map,
+  title: PropTypes.string,
+}
+
+export default ExploreLayout

app/javascript/gabsocial/layouts/profile_layout.js

@@ -23,15 +23,7 @@ import {
   SignUpPanel,
 } from '../features/ui/util/async_components'
 
-export default class ProfileLayout extends ImmutablePureComponent {
+class ProfileLayout extends ImmutablePureComponent {
-
-  static propTypes = {
-    account: ImmutablePropTypes.map,
-    children: PropTypes.node.isRequired,
-    titleHTML: PropTypes.string,
-    unavailable: PropTypes.bool,
-    noSidebar: PropTypes.bool,
-  }
 
   render() {
     const {
@@ -152,4 +144,14 @@ export default class ProfileLayout extends ImmutablePureComponent {
     )
   }
 
-}
+}
+
+ProfileLayout.propTypes = {
+  account: ImmutablePropTypes.map,
+  children: PropTypes.node.isRequired,
+  titleHTML: PropTypes.string,
+  unavailable: PropTypes.bool,
+  noSidebar: PropTypes.bool,
+}
+
+export default ProfileLayout

app/javascript/gabsocial/layouts/settings_layout.js

@@ -15,11 +15,7 @@ import {
   SidebarXS,
 } from '../features/ui/util/async_components'
 
-export default class SettingsLayout extends React.PureComponent {
+class SettingsLayout extends React.PureComponent {
-
-  static propTypes = {
-    title: PropTypes.string,
-  }
 
   render() {
     const { children, title } = this.props
@@ -85,3 +81,9 @@ export default class SettingsLayout extends React.PureComponent {
   }
 
 }
+
+SettingsLayout.propTypes = {
+  title: PropTypes.string,
+}
+
+export default SettingsLayout