Unverified Commit d6da8665 authored by Gerzon Z's avatar Gerzon Z Committed by GitHub
Browse files

[IMPROVEMENT] Remove lodash.isEqual (#2893)



* Added dequal and react-fast-compare as substitutes to lodash.isEqual

* Update ReplyPreview.js

* Remove react-fast-compare

* Removed deep-equal and upgrade babel-eslint dev dependency

* Fix avatar

* Fix Messagebox

* Fix CreateDiscussionView

* ModalBlockView

* NewMessageView

* ProfileView

* RoomInfoEditView

* ServerDropdown

* Return local search as object instead of observable

* SelectedUsersView
Co-authored-by: default avatarDiego Mello <diegolmello@gmail.com>
parent 09576710
......@@ -6,7 +6,7 @@ module.exports = {
}
}
},
"parser": "babel-eslint",
"parser": "@babel/eslint-parser",
"extends": "airbnb",
"parserOptions": {
"sourceType": "module",
......@@ -21,7 +21,8 @@ module.exports = {
"react",
"jsx-a11y",
"import",
"react-native"
"react-native",
"@babel"
],
"env": {
"browser": true,
......@@ -148,7 +149,8 @@ module.exports = {
"react/jsx-curly-newline": [0],
"react/state-in-constructor": [0],
"no-async-promise-executor": [0],
"max-classes-per-file": [0]
"max-classes-per-file": [0],
"no-multiple-empty-lines": [0]
},
"globals": {
"__DEV__": true
......
......@@ -2,7 +2,6 @@ import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Q } from '@nozbe/watermelondb';
import isEqual from 'react-fast-compare';
import database from '../../lib/database';
import { getUserSelector } from '../../selectors/login';
......@@ -34,7 +33,8 @@ class AvatarContainer extends React.Component {
}
componentDidUpdate(prevProps) {
if (!isEqual(prevProps, this.props)) {
const { text, type } = this.props;
if (prevProps.text !== text || prevProps.type !== type) {
this.init();
}
}
......
......@@ -2,7 +2,7 @@ import React, { Component } from 'react';
import { View } from 'react-native';
import PropTypes from 'prop-types';
import ScrollableTabView from 'react-native-scrollable-tab-view';
import equal from 'deep-equal';
import { dequal } from 'dequal';
import { connect } from 'react-redux';
import orderBy from 'lodash/orderBy';
import { sanitizedRaw } from '@nozbe/watermelondb/RawRecord';
......@@ -67,7 +67,7 @@ class EmojiPicker extends Component {
if (nextState.width !== width) {
return true;
}
if (!equal(nextState.frequentlyUsed, frequentlyUsed)) {
if (!dequal(nextState.frequentlyUsed, frequentlyUsed)) {
return true;
}
return false;
......
......@@ -2,7 +2,7 @@ import React, { memo, useEffect } from 'react';
import PropTypes from 'prop-types';
import { NotifierRoot, Notifier, Easing } from 'react-native-notifier';
import { connect } from 'react-redux';
import isEqual from 'deep-equal';
import { dequal } from 'dequal';
import NotifierComponent from './NotifierComponent';
import EventEmitter from '../../utils/events';
......@@ -38,7 +38,7 @@ const InAppNotification = memo(({ rooms }) => {
}, [rooms]);
return <NotifierRoot />;
}, (prevProps, nextProps) => isEqual(prevProps.rooms, nextProps.rooms));
}, (prevProps, nextProps) => dequal(prevProps.rooms, nextProps.rooms));
const mapStateToProps = state => ({
rooms: state.room.rooms
......
import React from 'react';
import { FlatList } from 'react-native';
import PropTypes from 'prop-types';
import equal from 'deep-equal';
import { dequal } from 'dequal';
import Item from './Item';
import styles from '../styles';
......@@ -31,7 +31,7 @@ const CommandsPreview = React.memo(({ theme, commandPreview, showCommandPreview
if (prevProps.showCommandPreview !== nextProps.showCommandPreview) {
return false;
}
if (!equal(prevProps.commandPreview, nextProps.commandPreview)) {
if (!dequal(prevProps.commandPreview, nextProps.commandPreview)) {
return false;
}
return true;
......
import React from 'react';
import { FlatList, View } from 'react-native';
import PropTypes from 'prop-types';
import equal from 'deep-equal';
import { dequal } from 'dequal';
import styles from '../styles';
import MentionItem from './MentionItem';
......@@ -30,7 +30,7 @@ const Mentions = React.memo(({ mentions, trackingType, theme }) => {
if (prevProps.trackingType !== nextProps.trackingType) {
return false;
}
if (!equal(prevProps.mentions, nextProps.mentions)) {
if (!dequal(prevProps.mentions, nextProps.mentions)) {
return false;
}
return true;
......
......@@ -3,7 +3,6 @@ import { View, Text, StyleSheet } from 'react-native';
import PropTypes from 'prop-types';
import moment from 'moment';
import { connect } from 'react-redux';
import isEqual from 'lodash/isEqual';
import Markdown from '../markdown';
import { CustomIcon } from '../../lib/Icons';
......@@ -75,7 +74,7 @@ const ReplyPreview = React.memo(({
<CustomIcon name='close' color={themes[theme].auxiliaryText} size={20} style={styles.close} onPress={close} />
</View>
);
}, (prevProps, nextProps) => prevProps.replying === nextProps.replying && prevProps.theme === nextProps.theme && isEqual(prevProps.message, nextProps.message));
}, (prevProps, nextProps) => prevProps.replying === nextProps.replying && prevProps.theme === nextProps.theme && prevProps.message.id === nextProps.message.id);
ReplyPreview.propTypes = {
replying: PropTypes.bool,
......
......@@ -6,7 +6,7 @@ import {
import { connect } from 'react-redux';
import { KeyboardAccessoryView } from 'react-native-ui-lib/keyboard';
import ImagePicker from 'react-native-image-crop-picker';
import equal from 'deep-equal';
import { dequal } from 'dequal';
import DocumentPicker from 'react-native-document-picker';
import { Q } from '@nozbe/watermelondb';
import { TouchableWithoutFeedback } from 'react-native-gesture-handler';
......@@ -271,7 +271,7 @@ class MessageBox extends Component {
} = this.state;
const {
roomType, replying, editing, isFocused, message, theme, children
roomType, replying, editing, isFocused, message, theme
} = this.props;
if (nextProps.theme !== theme) {
return true;
......@@ -300,16 +300,13 @@ class MessageBox extends Component {
if (nextState.tshow !== tshow) {
return true;
}
if (!equal(nextState.mentions, mentions)) {
if (!dequal(nextState.mentions, mentions)) {
return true;
}
if (!equal(nextState.commandPreview, commandPreview)) {
if (!dequal(nextState.commandPreview, commandPreview)) {
return true;
}
if (!equal(nextProps.message, message)) {
return true;
}
if (!equal(nextProps.children, children)) {
if (!dequal(nextProps.message?.id, message?.id)) {
return true;
}
return false;
......
import React from 'react';
import isEqual from 'lodash/isEqual';
import { dequal } from 'dequal';
import PropTypes from 'prop-types';
import Image from './Image';
......@@ -28,7 +28,7 @@ const Attachments = React.memo(({
// eslint-disable-next-line react/no-array-index-key
return <Reply key={index} index={index} attachment={file} timeFormat={timeFormat} getCustomEmoji={getCustomEmoji} theme={theme} />;
});
}, (prevProps, nextProps) => isEqual(prevProps.attachments, nextProps.attachments) && prevProps.theme === nextProps.theme);
}, (prevProps, nextProps) => dequal(prevProps.attachments, nextProps.attachments) && prevProps.theme === nextProps.theme);
Attachments.propTypes = {
attachments: PropTypes.array,
......
......@@ -6,7 +6,7 @@ import {
import { Audio } from 'expo-av';
import Slider from '@react-native-community/slider';
import moment from 'moment';
import equal from 'deep-equal';
import { dequal } from 'dequal';
import { activateKeepAwake, deactivateKeepAwake } from 'expo-keep-awake';
import Touchable from './Touchable';
......@@ -150,7 +150,7 @@ class MessageAudio extends React.Component {
if (nextState.paused !== paused) {
return true;
}
if (!equal(nextProps.file, file)) {
if (!dequal(nextProps.file, file)) {
return true;
}
if (nextState.loading !== loading) {
......
import React, { useContext } from 'react';
import { Text, View } from 'react-native';
import PropTypes from 'prop-types';
import equal from 'deep-equal';
import { dequal } from 'dequal';
import I18n from '../../i18n';
import styles from './styles';
......@@ -108,10 +108,10 @@ const Content = React.memo((props) => {
if (prevProps.isIgnored !== nextProps.isIgnored) {
return false;
}
if (!equal(prevProps.mentions, nextProps.mentions)) {
if (!dequal(prevProps.mentions, nextProps.mentions)) {
return false;
}
if (!equal(prevProps.channels, nextProps.channels)) {
if (!dequal(prevProps.channels, nextProps.channels)) {
return false;
}
return true;
......
......@@ -2,7 +2,7 @@ import React, { useContext } from 'react';
import { View } from 'react-native';
import PropTypes from 'prop-types';
import FastImage from '@rocket.chat/react-native-fast-image';
import equal from 'deep-equal';
import { dequal } from 'dequal';
import { createImageProgress } from 'react-native-image-progress';
import * as Progress from 'react-native-progress';
......@@ -66,7 +66,7 @@ const ImageContainer = React.memo(({
<MessageImage img={img} theme={theme} />
</Button>
);
}, (prevProps, nextProps) => equal(prevProps.file, nextProps.file) && prevProps.theme === nextProps.theme);
}, (prevProps, nextProps) => dequal(prevProps.file, nextProps.file) && prevProps.theme === nextProps.theme);
ImageContainer.propTypes = {
file: PropTypes.object,
......
......@@ -2,7 +2,7 @@ import React, { useContext } from 'react';
import { View, Text, StyleSheet } from 'react-native';
import PropTypes from 'prop-types';
import moment from 'moment';
import isEqual from 'deep-equal';
import { dequal } from 'dequal';
import Touchable from './Touchable';
import Markdown from '../markdown';
......@@ -125,7 +125,7 @@ const Fields = React.memo(({ attachment, theme }) => {
))}
</View>
);
}, (prevProps, nextProps) => isEqual(prevProps.attachment.fields, nextProps.attachment.fields) && prevProps.theme === nextProps.theme);
}, (prevProps, nextProps) => dequal(prevProps.attachment.fields, nextProps.attachment.fields) && prevProps.theme === nextProps.theme);
const Reply = React.memo(({
attachment, timeFormat, index, getCustomEmoji, theme
......@@ -187,7 +187,7 @@ const Reply = React.memo(({
/>
</>
);
}, (prevProps, nextProps) => isEqual(prevProps.attachment, nextProps.attachment) && prevProps.theme === nextProps.theme);
}, (prevProps, nextProps) => dequal(prevProps.attachment, nextProps.attachment) && prevProps.theme === nextProps.theme);
Reply.propTypes = {
attachment: PropTypes.object,
......
......@@ -4,7 +4,7 @@ import {
} from 'react-native';
import PropTypes from 'prop-types';
import FastImage from '@rocket.chat/react-native-fast-image';
import isEqual from 'lodash/isEqual';
import { dequal } from 'dequal';
import Touchable from './Touchable';
import openLink from '../../utils/openLink';
......@@ -112,7 +112,7 @@ const Url = React.memo(({ url, index, theme }) => {
</>
</Touchable>
);
}, (oldProps, newProps) => isEqual(oldProps.url, newProps.url) && oldProps.theme === newProps.theme);
}, (oldProps, newProps) => dequal(oldProps.url, newProps.url) && oldProps.theme === newProps.theme);
const Urls = React.memo(({ urls, theme }) => {
if (!urls || urls.length === 0) {
......@@ -122,7 +122,7 @@ const Urls = React.memo(({ urls, theme }) => {
return urls.map((url, index) => (
<Url url={url} key={url.url} index={index} theme={theme} />
));
}, (oldProps, newProps) => isEqual(oldProps.urls, newProps.urls) && oldProps.theme === newProps.theme);
}, (oldProps, newProps) => dequal(oldProps.urls, newProps.urls) && oldProps.theme === newProps.theme);
UrlImage.propTypes = {
image: PropTypes.string
......
import React, { useContext } from 'react';
import PropTypes from 'prop-types';
import { StyleSheet } from 'react-native';
import isEqual from 'deep-equal';
import { dequal } from 'dequal';
import Touchable from './Touchable';
import Markdown from '../markdown';
......@@ -57,7 +57,7 @@ const Video = React.memo(({
<Markdown msg={file.description} baseUrl={baseUrl} username={user.username} getCustomEmoji={getCustomEmoji} theme={theme} />
</>
);
}, (prevProps, nextProps) => isEqual(prevProps.file, nextProps.file) && prevProps.theme === nextProps.theme);
}, (prevProps, nextProps) => dequal(prevProps.file, nextProps.file) && prevProps.theme === nextProps.theme);
Video.propTypes = {
file: PropTypes.object,
......
......@@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { FlatList } from 'react-native';
import { connect } from 'react-redux';
import isEqual from 'react-fast-compare';
import { dequal } from 'dequal';
import I18n from '../../../i18n';
import RoomItem, { ROW_HEIGHT } from '../../../presentation/RoomItem';
......@@ -56,7 +56,7 @@ class QueueListView extends React.Component {
shouldComponentUpdate(nextProps) {
const { queued } = this.props;
if (!isEqual(nextProps.queued, queued)) {
if (!dequal(nextProps.queued, queued)) {
return true;
}
......
......@@ -620,19 +620,15 @@ const RocketChat = {
data = data.slice(0, 7);
data = data.map((sub) => {
if (sub.t !== 'd') {
return {
rid: sub.rid,
name: sub.name,
fname: sub.fname,
avatarETag: sub.avatarETag,
t: sub.t,
encrypted: sub.encrypted
};
}
return sub;
});
data = data.map(sub => ({
rid: sub.rid,
name: sub.name,
fname: sub.fname,
avatarETag: sub.avatarETag,
t: sub.t,
encrypted: sub.encrypted,
lastMessage: sub.lastMessage
}));
return data;
},
......
import React from 'react';
import PropTypes from 'prop-types';
import isEqual from 'lodash/isEqual';
import { dequal } from 'dequal';
import I18n from '../../i18n';
import styles from './styles';
......@@ -45,7 +45,7 @@ const formatMsg = ({
return `${ prefix }${ lastMessage.msg }`;
};
const arePropsEqual = (oldProps, newProps) => isEqual(oldProps, newProps);
const arePropsEqual = (oldProps, newProps) => dequal(oldProps, newProps);
const LastMessage = React.memo(({
lastMessage, type, showLastMessage, username, alert, useRealName, theme
......
......@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
import {
View, Text, Switch, ScrollView, StyleSheet, FlatList
} from 'react-native';
import equal from 'deep-equal';
import { dequal } from 'dequal';
import TextInput from '../presentation/TextInput';
import Loading from '../containers/Loading';
......@@ -133,7 +133,7 @@ class CreateChannelView extends React.Component {
if (nextProps.encryptionEnabled !== encryptionEnabled) {
return true;
}
if (!equal(nextProps.users, users)) {
if (!dequal(nextProps.users, users)) {
return true;
}
return false;
......
......@@ -2,7 +2,6 @@ import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { ScrollView, Text, Switch } from 'react-native';
import isEqual from 'lodash/isEqual';
import Loading from '../../containers/Loading';
import KeyboardView from '../../presentation/KeyboardView';
......@@ -63,11 +62,12 @@ class CreateChannelView extends React.Component {
}
componentDidUpdate(prevProps, prevState) {
const { channel, name } = this.state;
const {
loading, failure, error, result, isMasterDetail
} = this.props;
if (!isEqual(this.state, prevState)) {
if (channel?.rid !== prevState.channel?.rid || name !== prevState.name) {
this.setHeader();
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment