Use React.PureComponent instead of pure-render-decorator

This commit is contained in:
Ken-Håvard Lieng 2017-02-17 01:46:39 +01:00
parent 531792b14a
commit e6892ccd2d
19 changed files with 57 additions and 139 deletions

File diff suppressed because one or more lines are too long

View File

@ -47,7 +47,6 @@
"history": "^4.5.1", "history": "^4.5.1",
"immutable": "^3.8.1", "immutable": "^3.8.1",
"lodash": "^4.17.4", "lodash": "^4.17.4",
"pure-render-decorator": "^1.2.1",
"react": "^15.4.2", "react": "^15.4.2",
"react-dom": "^15.4.2", "react-dom": "^15.4.2",
"react-redux": "^5.0.2", "react-redux": "^5.0.2",

View File

@ -1,11 +1,9 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import { List } from 'immutable'; import { List } from 'immutable';
import pure from 'pure-render-decorator';
import Navicon from '../components/Navicon'; import Navicon from '../components/Navicon';
import { linkify } from '../util'; import { linkify } from '../util';
@pure export default class ChatTitle extends PureComponent {
export default class ChatTitle extends Component {
handleLeaveClick = () => { handleLeaveClick = () => {
const { tab, disconnect, part, closePrivateChat } = this.props; const { tab, disconnect, part, closePrivateChat } = this.props;

View File

@ -1,8 +1,6 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import pure from 'pure-render-decorator';
@pure export default class FileInput extends PureComponent {
export default class FileInput extends Component {
componentWillMount() { componentWillMount() {
this.input = window.document.createElement('input'); this.input = window.document.createElement('input');
this.input.setAttribute('type', 'file'); this.input.setAttribute('type', 'file');

View File

@ -1,9 +1,7 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import pure from 'pure-render-decorator';
import { timestamp, linkify } from '../util'; import { timestamp, linkify } from '../util';
@pure export default class Message extends PureComponent {
export default class Message extends Component {
handleSenderClick = () => { handleSenderClick = () => {
const { message, openPrivateChat, select } = this.props; const { message, openPrivateChat, select } = this.props;

View File

@ -1,10 +1,8 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import { VirtualScroll } from 'react-virtualized'; import { VirtualScroll } from 'react-virtualized';
import pure from 'pure-render-decorator';
import Message from './Message'; import Message from './Message';
@pure export default class MessageBox extends PureComponent {
export default class MessageBox extends Component {
state = { state = {
height: window.innerHeight - 100 height: window.innerHeight - 100
}; };

View File

@ -1,8 +1,6 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import pure from 'pure-render-decorator';
@pure export default class MessageInput extends PureComponent {
export default class MessageInput extends Component {
state = { state = {
value: '' value: ''
}; };

View File

@ -1,10 +1,8 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import pure from 'pure-render-decorator';
import { toggleMenu } from '../actions/ui'; import { toggleMenu } from '../actions/ui';
@pure class Navicon extends PureComponent {
class Navicon extends Component {
handleClick = () => this.props.dispatch(toggleMenu()); handleClick = () => this.props.dispatch(toggleMenu());
render() { render() {

View File

@ -1,9 +1,7 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import pure from 'pure-render-decorator';
import SearchResult from './SearchResult'; import SearchResult from './SearchResult';
@pure export default class Search extends PureComponent {
export default class Search extends Component {
componentDidUpdate(prevProps) { componentDidUpdate(prevProps) {
if (!prevProps.search.show && this.props.search.show) { if (!prevProps.search.show && this.props.search.show) {
this.input.focus(); this.input.focus();

View File

@ -1,10 +1,8 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import Autolinker from 'autolinker'; import Autolinker from 'autolinker';
import pure from 'pure-render-decorator';
import { timestamp } from '../util'; import { timestamp } from '../util';
@pure export default class Search extends PureComponent {
export default class Search extends Component {
render() { render() {
const { result } = this.props; const { result } = this.props;
const content = Autolinker.link(result.content, { stripPrefix: false }); const content = Autolinker.link(result.content, { stripPrefix: false });

View File

@ -1,9 +1,7 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import pure from 'pure-render-decorator';
import TabListItem from './TabListItem'; import TabListItem from './TabListItem';
@pure export default class TabList extends PureComponent {
export default class TabList extends Component {
handleTabClick = (server, target) => { handleTabClick = (server, target) => {
this.props.select(server, target, target && target.charAt(0) !== '#'); this.props.select(server, target, target && target.charAt(0) !== '#');
this.props.hideMenu(); this.props.hideMenu();

View File

@ -1,8 +1,6 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import pure from 'pure-render-decorator';
@pure export default class TabListItem extends PureComponent {
export default class TabListItem extends Component {
handleClick = () => { handleClick = () => {
const { server, target, onClick } = this.props; const { server, target, onClick } = this.props;
onClick(server, target); onClick(server, target);

View File

@ -1,10 +1,8 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import { VirtualScroll } from 'react-virtualized'; import { VirtualScroll } from 'react-virtualized';
import pure from 'pure-render-decorator';
import UserListItem from './UserListItem'; import UserListItem from './UserListItem';
@pure export default class UserList extends PureComponent {
export default class UserList extends Component {
state = { state = {
height: window.innerHeight - 100 height: window.innerHeight - 100
}; };

View File

@ -1,8 +1,6 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import pure from 'pure-render-decorator';
@pure export default class UserListItem extends PureComponent {
export default class UserListItem extends Component {
handleClick = () => { handleClick = () => {
const { tab, user, openPrivateChat, select } = this.props; const { tab, user, openPrivateChat, select } = this.props;

View File

@ -1,13 +1,11 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { push } from 'react-router-redux'; import { push } from 'react-router-redux';
import pure from 'pure-render-decorator';
import TabList from '../components/TabList'; import TabList from '../components/TabList';
import { select } from '../actions/tab'; import { select } from '../actions/tab';
import { hideMenu } from '../actions/ui'; import { hideMenu } from '../actions/ui';
@pure class App extends PureComponent {
class App extends Component {
render() { render() {
const { showTabList, children } = this.props; const { showTabList, children } = this.props;
const mainClass = showTabList ? 'main-container off-canvas' : 'main-container'; const mainClass = showTabList ? 'main-container off-canvas' : 'main-container';

View File

@ -1,9 +1,8 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import { bindActionCreators } from 'redux'; import { bindActionCreators } from 'redux';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { createSelector, createStructuredSelector } from 'reselect'; import { createSelector, createStructuredSelector } from 'reselect';
import { List, Map } from 'immutable'; import { List, Map } from 'immutable';
import pure from 'pure-render-decorator';
import ChatTitle from '../components/ChatTitle'; import ChatTitle from '../components/ChatTitle';
import Search from '../components/Search'; import Search from '../components/Search';
import MessageBox from '../components/MessageBox'; import MessageBox from '../components/MessageBox';
@ -36,8 +35,7 @@ function updateCharWidth() {
return setCharWidth(charWidth); return setCharWidth(charWidth);
} }
@pure class Chat extends PureComponent {
class Chat extends Component {
componentWillMount() { componentWillMount() {
const { dispatch } = this.props; const { dispatch } = this.props;
dispatch(updateCharWidth()); dispatch(updateCharWidth());

View File

@ -1,13 +1,11 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import pure from 'pure-render-decorator';
import Navicon from '../components/Navicon'; import Navicon from '../components/Navicon';
import * as serverActions from '../actions/server'; import * as serverActions from '../actions/server';
import { join } from '../actions/channel'; import { join } from '../actions/channel';
import { select } from '../actions/tab'; import { select } from '../actions/tab';
@pure class Connect extends PureComponent {
class Connect extends Component {
state = { state = {
showOptionals: false, showOptionals: false,
passwordTouched: false passwordTouched: false

View File

@ -1,12 +1,10 @@
import React, { Component } from 'react'; import React, { PureComponent } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import pure from 'pure-render-decorator';
import Navicon from '../components/Navicon'; import Navicon from '../components/Navicon';
import FileInput from '../components/FileInput'; import FileInput from '../components/FileInput';
import { setCert, setKey, uploadCert } from '../actions/settings'; import { setCert, setKey, uploadCert } from '../actions/settings';
@pure class Settings extends PureComponent {
class Settings extends Component {
handleCertChange = (name, data) => this.props.dispatch(setCert(name, data)); handleCertChange = (name, data) => this.props.dispatch(setCert(name, data));
handleKeyChange = (name, data) => this.props.dispatch(setKey(name, data)); handleKeyChange = (name, data) => this.props.dispatch(setKey(name, data));
handleCertUpload = () => this.props.dispatch(uploadCert()); handleCertUpload = () => this.props.dispatch(uploadCert());

View File

@ -427,13 +427,7 @@ babel-loader@^6.3.1:
mkdirp "^0.5.1" mkdirp "^0.5.1"
object-assign "^4.0.1" object-assign "^4.0.1"
babel-messages@^6.22.0: babel-messages@^6.22.0, babel-messages@^6.23.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-messages/-/babel-messages-6.22.0.tgz#36066a214f1217e4ed4164867669ecb39e3ea575"
dependencies:
babel-runtime "^6.22.0"
babel-messages@^6.23.0:
version "6.23.0" version "6.23.0"
resolved "https://registry.yarnpkg.com/babel-messages/-/babel-messages-6.23.0.tgz#f3cdf4703858035b2a2951c6ec5edf6c62f2630e" resolved "https://registry.yarnpkg.com/babel-messages/-/babel-messages-6.23.0.tgz#f3cdf4703858035b2a2951c6ec5edf6c62f2630e"
dependencies: dependencies:
@ -922,17 +916,7 @@ babel-runtime@^6.18.0, babel-runtime@^6.2.0, babel-runtime@^6.22.0:
core-js "^2.4.0" core-js "^2.4.0"
regenerator-runtime "^0.10.0" regenerator-runtime "^0.10.0"
babel-template@^6.22.0, babel-template@^6.3.0: babel-template@^6.22.0, babel-template@^6.23.0, babel-template@^6.3.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.22.0.tgz#403d110905a4626b317a2a1fcb8f3b73204b2edb"
dependencies:
babel-runtime "^6.22.0"
babel-traverse "^6.22.0"
babel-types "^6.22.0"
babylon "^6.11.0"
lodash "^4.2.0"
babel-template@^6.23.0:
version "6.23.0" version "6.23.0"
resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.23.0.tgz#04d4f270adbb3aa704a8143ae26faa529238e638" resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.23.0.tgz#04d4f270adbb3aa704a8143ae26faa529238e638"
dependencies: dependencies:
@ -942,21 +926,7 @@ babel-template@^6.23.0:
babylon "^6.11.0" babylon "^6.11.0"
lodash "^4.2.0" lodash "^4.2.0"
babel-traverse@^6.15.0, babel-traverse@^6.22.0: babel-traverse@^6.15.0, babel-traverse@^6.22.0, babel-traverse@^6.23.0, babel-traverse@^6.23.1:
version "6.22.1"
resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.22.1.tgz#3b95cd6b7427d6f1f757704908f2fc9748a5f59f"
dependencies:
babel-code-frame "^6.22.0"
babel-messages "^6.22.0"
babel-runtime "^6.22.0"
babel-types "^6.22.0"
babylon "^6.15.0"
debug "^2.2.0"
globals "^9.0.0"
invariant "^2.2.0"
lodash "^4.2.0"
babel-traverse@^6.23.0, babel-traverse@^6.23.1:
version "6.23.1" version "6.23.1"
resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.23.1.tgz#d3cb59010ecd06a97d81310065f966b699e14f48" resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.23.1.tgz#d3cb59010ecd06a97d81310065f966b699e14f48"
dependencies: dependencies:
@ -970,16 +940,7 @@ babel-traverse@^6.23.0, babel-traverse@^6.23.1:
invariant "^2.2.0" invariant "^2.2.0"
lodash "^4.2.0" lodash "^4.2.0"
babel-types@^6.15.0, babel-types@^6.19.0, babel-types@^6.22.0: babel-types@^6.15.0, babel-types@^6.19.0, babel-types@^6.22.0, babel-types@^6.23.0:
version "6.22.0"
resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.22.0.tgz#2a447e8d0ea25d2512409e4175479fd78cc8b1db"
dependencies:
babel-runtime "^6.22.0"
esutils "^2.0.2"
lodash "^4.2.0"
to-fast-properties "^1.0.1"
babel-types@^6.23.0:
version "6.23.0" version "6.23.0"
resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.23.0.tgz#bb17179d7538bad38cd0c9e115d340f77e7e9acf" resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.23.0.tgz#bb17179d7538bad38cd0c9e115d340f77e7e9acf"
dependencies: dependencies:
@ -988,14 +949,10 @@ babel-types@^6.23.0:
lodash "^4.2.0" lodash "^4.2.0"
to-fast-properties "^1.0.1" to-fast-properties "^1.0.1"
babylon@^6.11.0, babylon@^6.15.0: babylon@^6.11.0, babylon@^6.13.0, babylon@^6.15.0:
version "6.15.0" version "6.15.0"
resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.15.0.tgz#ba65cfa1a80e1759b0e89fb562e27dccae70348e" resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.15.0.tgz#ba65cfa1a80e1759b0e89fb562e27dccae70348e"
babylon@^6.13.0:
version "6.14.1"
resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.14.1.tgz#956275fab72753ad9b3435d7afe58f8bf0a29815"
backo@^1.1.0: backo@^1.1.0:
version "1.1.0" version "1.1.0"
resolved "https://registry.yarnpkg.com/backo/-/backo-1.1.0.tgz#a36c4468923f2d265c9e8a709ea56ecdaff807e6" resolved "https://registry.yarnpkg.com/backo/-/backo-1.1.0.tgz#a36c4468923f2d265c9e8a709ea56ecdaff807e6"
@ -2161,7 +2118,7 @@ fastparse@^1.1.1:
version "1.1.1" version "1.1.1"
resolved "https://registry.yarnpkg.com/fastparse/-/fastparse-1.1.1.tgz#d1e2643b38a94d7583b479060e6c4affc94071f8" resolved "https://registry.yarnpkg.com/fastparse/-/fastparse-1.1.1.tgz#d1e2643b38a94d7583b479060e6c4affc94071f8"
fbjs@^0.8.0, fbjs@^0.8.1, fbjs@^0.8.4: fbjs@^0.8.1, fbjs@^0.8.4:
version "0.8.8" version "0.8.8"
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.8.tgz#02f1b6e0ea0d46c24e0b51a2d24df069563a5ad6" resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.8.tgz#02f1b6e0ea0d46c24e0b51a2d24df069563a5ad6"
dependencies: dependencies:
@ -4307,12 +4264,6 @@ punycode@^1.2.4, punycode@^1.4.1:
version "1.4.1" version "1.4.1"
resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e" resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e"
pure-render-decorator@^1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/pure-render-decorator/-/pure-render-decorator-1.2.1.tgz#568870eeca17a1cee536b4fe94a3477fcd31eeb9"
dependencies:
fbjs "^0.8.0"
q@^1.1.2: q@^1.1.2:
version "1.4.1" version "1.4.1"
resolved "https://registry.yarnpkg.com/q/-/q-1.4.1.tgz#55705bcd93c5f3673530c2c2cbc0c2b3addc286e" resolved "https://registry.yarnpkg.com/q/-/q-1.4.1.tgz#55705bcd93c5f3673530c2c2cbc0c2b3addc286e"