Icon, SeriesIndexFooter -> PureComponent

This commit is contained in:
Mark McDowall 2019-02-26 19:46:18 -08:00
parent 78b3c9552b
commit 84fa99a126
3 changed files with 179 additions and 159 deletions

View File

@ -1,11 +1,16 @@
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import React from 'react'; import React, { PureComponent } from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { kinds } from 'Helpers/Props'; import { kinds } from 'Helpers/Props';
import classNames from 'classnames'; import classNames from 'classnames';
import styles from './Icon.css'; import styles from './Icon.css';
function Icon(props) { class Icon extends PureComponent {
//
// Render
render() {
const { const {
containerClassName, containerClassName,
className, className,
@ -15,7 +20,7 @@ function Icon(props) {
title, title,
isSpinning, isSpinning,
...otherProps ...otherProps
} = props; } = this.props;
const icon = ( const icon = (
<FontAwesomeIcon <FontAwesomeIcon
@ -45,6 +50,7 @@ function Icon(props) {
return icon; return icon;
} }
}
Icon.propTypes = { Icon.propTypes = {
containerClassName: PropTypes.string, containerClassName: PropTypes.string,

View File

@ -26,6 +26,13 @@ class PageJumpBar extends Component {
this.computeVisibleItems(); this.computeVisibleItems();
} }
shouldComponentUpdate(nextProps, nextState) {
return (
nextProps.items !== this.props.items ||
nextState.height !== this.state.height
);
}
componentDidUpdate(prevProps, prevState) { componentDidUpdate(prevProps, prevState) {
if ( if (
prevProps.items !== this.props.items || prevProps.items !== this.props.items ||

View File

@ -1,5 +1,5 @@
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import React from 'react'; import React, { PureComponent } from 'react';
import classNames from 'classnames'; import classNames from 'classnames';
import formatBytes from 'Utilities/Number/formatBytes'; import formatBytes from 'Utilities/Number/formatBytes';
import { ColorImpairedConsumer } from 'App/ColorImpairedContext'; import { ColorImpairedConsumer } from 'App/ColorImpairedContext';
@ -7,7 +7,13 @@ import DescriptionList from 'Components/DescriptionList/DescriptionList';
import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem'; import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
import styles from './SeriesIndexFooter.css'; import styles from './SeriesIndexFooter.css';
function SeriesIndexFooter({ series }) { class SeriesIndexFooter extends PureComponent {
//
// Render
render() {
const { series } = this.props;
const count = series.length; const count = series.length;
let episodes = 0; let episodes = 0;
let episodeFiles = 0; let episodeFiles = 0;
@ -143,6 +149,7 @@ function SeriesIndexFooter({ series }) {
</ColorImpairedConsumer> </ColorImpairedConsumer>
); );
} }
}
SeriesIndexFooter.propTypes = { SeriesIndexFooter.propTypes = {
series: PropTypes.arrayOf(PropTypes.object).isRequired series: PropTypes.arrayOf(PropTypes.object).isRequired