[IMPROVEMENT] Remove lodash.isEqual

.eslintrc.js

@@ -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

app/containers/Avatar/index.js

@@ -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();
 		}
 	}

app/containers/EmojiPicker/index.js

@@ -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;

app/containers/InAppNotification/index.js

@@ -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

app/containers/MessageBox/CommandsPreview/index.js

@@ -1,7 +1,7 @@
 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;

app/containers/MessageBox/Mentions/index.js

@@ -1,7 +1,7 @@
 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;

app/containers/MessageBox/ReplyPreview.js

@@ -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,

app/containers/MessageBox/index.js

@@ -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;

app/containers/message/Attachments.js

@@ -1,5 +1,5 @@
 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,

app/containers/message/Audio.js

@@ -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) {

app/containers/message/Content.js

@@ -1,7 +1,7 @@
 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;

app/containers/message/Image.js

@@ -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,

app/containers/message/Reply.js

@@ -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,

app/containers/message/Urls.js

@@ -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

app/containers/message/Video.js

@@ -1,7 +1,7 @@
 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,

app/ee/omnichannel/views/QueueListView.js

@@ -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;
 		}
 

app/lib/rocketchat.js

@@ -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;
 	},

app/presentation/RoomItem/LastMessage.js

@@ -1,6 +1,6 @@
 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