From 86d5529cfd0ce1310abd1983a1ca6f2b5c1a5f5f Mon Sep 17 00:00:00 2001
From: Diego Mello <diegolmello@gmail.com>
Date: Mon, 19 Sep 2022 17:46:15 -0300
Subject: [PATCH] RoomView

---
 app/containers/message/index.tsx | 34 ++++++++++++++++----------------
 app/views/RoomView/List/List.tsx | 22 ++++++++++-----------
 app/views/RoomView/index.tsx     |  2 +-
 3 files changed, 29 insertions(+), 29 deletions(-)

diff --git a/app/containers/message/index.tsx b/app/containers/message/index.tsx
index 39e236f98..452e807e8 100644
--- a/app/containers/message/index.tsx
+++ b/app/containers/message/index.tsx
@@ -91,23 +91,23 @@ class MessageContainer extends React.Component<IMessageContainerProps, IMessageC
 		}
 	}
 
-	shouldComponentUpdate(nextProps: IMessageContainerProps, nextState: IMessageContainerState) {
-		const { isManualUnignored } = this.state;
-		const { threadBadgeColor, isIgnored, highlighted } = this.props;
-		if (nextProps.highlighted !== highlighted) {
-			return true;
-		}
-		if (nextProps.threadBadgeColor !== threadBadgeColor) {
-			return true;
-		}
-		if (nextProps.isIgnored !== isIgnored) {
-			return true;
-		}
-		if (nextState.isManualUnignored !== isManualUnignored) {
-			return true;
-		}
-		return false;
-	}
+	// shouldComponentUpdate(nextProps: IMessageContainerProps, nextState: IMessageContainerState) {
+	// 	const { isManualUnignored } = this.state;
+	// 	const { threadBadgeColor, isIgnored, highlighted } = this.props;
+	// 	if (nextProps.highlighted !== highlighted) {
+	// 		return true;
+	// 	}
+	// 	if (nextProps.threadBadgeColor !== threadBadgeColor) {
+	// 		return true;
+	// 	}
+	// 	if (nextProps.isIgnored !== isIgnored) {
+	// 		return true;
+	// 	}
+	// 	if (nextState.isManualUnignored !== isManualUnignored) {
+	// 		return true;
+	// 	}
+	// 	return false;
+	// }
 
 	componentWillUnmount() {
 		if (this.subscription && this.subscription.unsubscribe) {
diff --git a/app/views/RoomView/List/List.tsx b/app/views/RoomView/List/List.tsx
index 50b25f448..17d6c3dc0 100644
--- a/app/views/RoomView/List/List.tsx
+++ b/app/views/RoomView/List/List.tsx
@@ -1,13 +1,14 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import { FlatListProps, StyleSheet } from 'react-native';
-import { FlatList } from 'react-native-gesture-handler';
+// import { FlatList } from 'react-native-gesture-handler';
+import { FlashList } from '@shopify/flash-list';
 import Animated from 'react-native-reanimated';
 
 import { isIOS } from '../../../lib/methods/helpers';
 import scrollPersistTaps from '../../../lib/methods/helpers/scrollPersistTaps';
 
-const AnimatedFlatList = Animated.createAnimatedComponent(FlatList);
+const AnimatedFlatList = Animated.createAnimatedComponent(FlashList);
 
 const styles = StyleSheet.create({
 	list: {
@@ -18,11 +19,9 @@ const styles = StyleSheet.create({
 	}
 });
 
-export type TListRef = React.RefObject<FlatList & { getNode: () => FlatList }>;
+// export type TListRef = React.RefObject<FlatList & { getNode: () => FlatList }>;
 
-export interface IListProps extends FlatListProps<any> {
-	listRef: TListRef;
-}
+export type IListProps = FlatListProps<any>;
 
 const List = ({ listRef, ...props }: IListProps) => (
 	<AnimatedFlatList
@@ -30,13 +29,14 @@ const List = ({ listRef, ...props }: IListProps) => (
 		ref={listRef}
 		keyExtractor={(item: any) => item.id}
 		contentContainerStyle={styles.contentContainer}
-		style={styles.list}
+		// style={styles.list}
 		inverted
-		removeClippedSubviews={isIOS}
-		initialNumToRender={7}
+		estimatedItemSize={150}
+		// removeClippedSubviews={isIOS}
+		// initialNumToRender={7}
 		onEndReachedThreshold={0.5}
-		maxToRenderPerBatch={5}
-		windowSize={10}
+		// maxToRenderPerBatch={5}
+		// windowSize={10}
 		{...props}
 		{...scrollPersistTaps}
 	/>
diff --git a/app/views/RoomView/index.tsx b/app/views/RoomView/index.tsx
index 4b7213f80..0506a296e 100644
--- a/app/views/RoomView/index.tsx
+++ b/app/views/RoomView/index.tsx
@@ -1365,8 +1365,8 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 		if (showUnreadSeparator || dateSeparator) {
 			return (
 				<>
-					{content}
 					<Separator ts={dateSeparator} unread={showUnreadSeparator} />
+					{content}
 				</>
 			);
 		}