Rewrite `<LoadMore />` as FC and TS (#25259)
This commit is contained in:
		
							parent
							
								
									50a8f5b8a7
								
							
						
					
					
						commit
						fb5bf5cbf8
					
				| 
						 | 
					@ -1,28 +0,0 @@
 | 
				
			||||||
import PropTypes from 'prop-types';
 | 
					 | 
				
			||||||
import { PureComponent } from 'react';
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
import { FormattedMessage } from 'react-intl';
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
export default class LoadMore extends PureComponent {
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  static propTypes = {
 | 
					 | 
				
			||||||
    onClick: PropTypes.func,
 | 
					 | 
				
			||||||
    disabled: PropTypes.bool,
 | 
					 | 
				
			||||||
    visible: PropTypes.bool,
 | 
					 | 
				
			||||||
  };
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  static defaultProps = {
 | 
					 | 
				
			||||||
    visible: true,
 | 
					 | 
				
			||||||
  };
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  render() {
 | 
					 | 
				
			||||||
    const { disabled, visible } = this.props;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    return (
 | 
					 | 
				
			||||||
      <button type='button' className='load-more' disabled={disabled || !visible} style={{ visibility: visible ? 'visible' : 'hidden' }} onClick={this.props.onClick}>
 | 
					 | 
				
			||||||
        <FormattedMessage id='status.load_more' defaultMessage='Load more' />
 | 
					 | 
				
			||||||
      </button>
 | 
					 | 
				
			||||||
    );
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
| 
						 | 
					@ -0,0 +1,24 @@
 | 
				
			||||||
 | 
					import { FormattedMessage } from 'react-intl';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					interface Props {
 | 
				
			||||||
 | 
					  onClick: (event: React.MouseEvent) => void;
 | 
				
			||||||
 | 
					  disabled?: boolean;
 | 
				
			||||||
 | 
					  visible?: boolean;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					export const LoadMore: React.FC<Props> = ({
 | 
				
			||||||
 | 
					  onClick,
 | 
				
			||||||
 | 
					  disabled,
 | 
				
			||||||
 | 
					  visible = true,
 | 
				
			||||||
 | 
					}) => {
 | 
				
			||||||
 | 
					  return (
 | 
				
			||||||
 | 
					    <button
 | 
				
			||||||
 | 
					      type='button'
 | 
				
			||||||
 | 
					      className='load-more'
 | 
				
			||||||
 | 
					      disabled={disabled || !visible}
 | 
				
			||||||
 | 
					      style={{ visibility: visible ? 'visible' : 'hidden' }}
 | 
				
			||||||
 | 
					      onClick={onClick}
 | 
				
			||||||
 | 
					    >
 | 
				
			||||||
 | 
					      <FormattedMessage id='status.load_more' defaultMessage='Load more' />
 | 
				
			||||||
 | 
					    </button>
 | 
				
			||||||
 | 
					  );
 | 
				
			||||||
 | 
					};
 | 
				
			||||||
| 
						 | 
					@ -15,7 +15,7 @@ import IntersectionObserverArticleContainer from '../containers/intersection_obs
 | 
				
			||||||
import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from '../features/ui/util/fullscreen';
 | 
					import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from '../features/ui/util/fullscreen';
 | 
				
			||||||
import IntersectionObserverWrapper from '../features/ui/util/intersection_observer_wrapper';
 | 
					import IntersectionObserverWrapper from '../features/ui/util/intersection_observer_wrapper';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import LoadMore from './load_more';
 | 
					import { LoadMore } from './load_more';
 | 
				
			||||||
import LoadPending from './load_pending';
 | 
					import LoadPending from './load_pending';
 | 
				
			||||||
import LoadingIndicator from './loading_indicator';
 | 
					import LoadingIndicator from './loading_indicator';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -9,7 +9,7 @@ import { connect } from 'react-redux';
 | 
				
			||||||
import { lookupAccount, fetchAccount } from 'mastodon/actions/accounts';
 | 
					import { lookupAccount, fetchAccount } from 'mastodon/actions/accounts';
 | 
				
			||||||
import { openModal } from 'mastodon/actions/modal';
 | 
					import { openModal } from 'mastodon/actions/modal';
 | 
				
			||||||
import ColumnBackButton from 'mastodon/components/column_back_button';
 | 
					import ColumnBackButton from 'mastodon/components/column_back_button';
 | 
				
			||||||
import LoadMore from 'mastodon/components/load_more';
 | 
					import { LoadMore } from 'mastodon/components/load_more';
 | 
				
			||||||
import LoadingIndicator from 'mastodon/components/loading_indicator';
 | 
					import LoadingIndicator from 'mastodon/components/loading_indicator';
 | 
				
			||||||
import ScrollContainer from 'mastodon/containers/scroll_container';
 | 
					import ScrollContainer from 'mastodon/containers/scroll_container';
 | 
				
			||||||
import BundleColumnError from 'mastodon/features/ui/components/bundle_column_error';
 | 
					import BundleColumnError from 'mastodon/features/ui/components/bundle_column_error';
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -6,7 +6,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 | 
				
			||||||
import ImmutablePureComponent from 'react-immutable-pure-component';
 | 
					import ImmutablePureComponent from 'react-immutable-pure-component';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import { Icon }  from 'mastodon/components/icon';
 | 
					import { Icon }  from 'mastodon/components/icon';
 | 
				
			||||||
import LoadMore from 'mastodon/components/load_more';
 | 
					import { LoadMore } from 'mastodon/components/load_more';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import { ImmutableHashtag as Hashtag } from '../../../components/hashtag';
 | 
					import { ImmutableHashtag as Hashtag } from '../../../components/hashtag';
 | 
				
			||||||
import AccountContainer from '../../../containers/account_container';
 | 
					import AccountContainer from '../../../containers/account_container';
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -13,7 +13,7 @@ import { addColumn, removeColumn, moveColumn, changeColumnParams } from 'mastodo
 | 
				
			||||||
import { fetchDirectory, expandDirectory } from 'mastodon/actions/directory';
 | 
					import { fetchDirectory, expandDirectory } from 'mastodon/actions/directory';
 | 
				
			||||||
import Column from 'mastodon/components/column';
 | 
					import Column from 'mastodon/components/column';
 | 
				
			||||||
import ColumnHeader from 'mastodon/components/column_header';
 | 
					import ColumnHeader from 'mastodon/components/column_header';
 | 
				
			||||||
import LoadMore from 'mastodon/components/load_more';
 | 
					import { LoadMore } from 'mastodon/components/load_more';
 | 
				
			||||||
import LoadingIndicator from 'mastodon/components/loading_indicator';
 | 
					import LoadingIndicator from 'mastodon/components/loading_indicator';
 | 
				
			||||||
import { RadioButton } from 'mastodon/components/radio_button';
 | 
					import { RadioButton } from 'mastodon/components/radio_button';
 | 
				
			||||||
import ScrollContainer from 'mastodon/containers/scroll_container';
 | 
					import ScrollContainer from 'mastodon/containers/scroll_container';
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -11,7 +11,7 @@ import { connect } from 'react-redux';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import { expandSearch } from 'mastodon/actions/search';
 | 
					import { expandSearch } from 'mastodon/actions/search';
 | 
				
			||||||
import { ImmutableHashtag as Hashtag } from 'mastodon/components/hashtag';
 | 
					import { ImmutableHashtag as Hashtag } from 'mastodon/components/hashtag';
 | 
				
			||||||
import LoadMore from 'mastodon/components/load_more';
 | 
					import { LoadMore } from 'mastodon/components/load_more';
 | 
				
			||||||
import LoadingIndicator from 'mastodon/components/loading_indicator';
 | 
					import LoadingIndicator from 'mastodon/components/loading_indicator';
 | 
				
			||||||
import Account from 'mastodon/containers/account_container';
 | 
					import Account from 'mastodon/containers/account_container';
 | 
				
			||||||
import Status from 'mastodon/containers/status_container';
 | 
					import Status from 'mastodon/containers/status_container';
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in New Issue