diff --git a/app/containers/RoomItem/index.tsx b/app/containers/RoomItem/index.tsx index 5dd7d5469..121750c23 100644 --- a/app/containers/RoomItem/index.tsx +++ b/app/containers/RoomItem/index.tsx @@ -12,7 +12,7 @@ import { ROW_HEIGHT, ROW_HEIGHT_CONDENSED } from './styles'; export { ROW_HEIGHT, ROW_HEIGHT_CONDENSED }; -const attrs = ['width', 'isFocused', 'showLastMessage', 'autoJoin', 'showAvatar', 'displayMode']; +// const attrs = ['width', 'isFocused', 'showLastMessage', 'autoJoin', 'showAvatar', 'displayMode']; const RoomItemContainer = React.memo( ({ @@ -129,8 +129,8 @@ const RoomItemContainer = React.memo( sourceType={item.source} /> ); - }, - (props, nextProps) => attrs.every(key => props[key] === nextProps[key]) + } + // (props, nextProps) => attrs.every(key => props[key] === nextProps[key]) ); export default RoomItemContainer; diff --git a/app/views/RoomsListView/index.tsx b/app/views/RoomsListView/index.tsx index 84062f715..5e11e55ea 100644 --- a/app/views/RoomsListView/index.tsx +++ b/app/views/RoomsListView/index.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { BackHandler, FlatList, Keyboard, NativeEventSubscription, RefreshControl, Text, View } from 'react-native'; +import { BackHandler, Keyboard, NativeEventSubscription, RefreshControl, Text, View } from 'react-native'; import { batch, connect } from 'react-redux'; import { dequal } from 'dequal'; import Orientation from 'react-native-orientation-locker'; @@ -8,6 +8,7 @@ import { withSafeAreaInsets } from 'react-native-safe-area-context'; import { Subscription } from 'rxjs'; import { StackNavigationOptions } from '@react-navigation/stack'; import { Header } from '@react-navigation/elements'; +import { FlashList } from '@shopify/flash-list'; import database from '../../lib/database'; import RoomItem, { ROW_HEIGHT, ROW_HEIGHT_CONDENSED } from '../../containers/RoomItem'; @@ -986,22 +987,23 @@ class RoomsListView extends React.Component getItemLayout(data, index, height)} - removeClippedSubviews={isIOS} + estimatedItemSize={height} + // getItemLayout={(data, index) => getItemLayout(data, index, height)} + // removeClippedSubviews={isIOS} keyboardShouldPersistTaps='always' - initialNumToRender={INITIAL_NUM_TO_RENDER} + // initialNumToRender={INITIAL_NUM_TO_RENDER} refreshControl={ } - windowSize={9} + // windowSize={9} onEndReached={this.onEndReached} onEndReachedThreshold={0.5} /> @@ -1010,13 +1012,36 @@ class RoomsListView extends React.Component { console.count(`${this.constructor.name}.render calls`); - const { showServerDropdown, theme, navigation } = this.props; + const { loading, chats, search, searching } = this.state; + const { showServerDropdown, theme, navigation, displayMode, refreshing } = this.props; + + const height = displayMode === DisplayMode.Condensed ? ROW_HEIGHT_CONDENSED : ROW_HEIGHT; return ( {this.renderHeader()} - {this.renderScroll()} + {/* {this.renderScroll()} */} + getItemLayout(data, index, height)} + // removeClippedSubviews={isIOS} + keyboardShouldPersistTaps='always' + // initialNumToRender={INITIAL_NUM_TO_RENDER} + refreshControl={ + + } + // windowSize={9} + onEndReached={this.onEndReached} + onEndReachedThreshold={0.5} + /> {/* TODO - this ts-ignore is here because the route props, on IBaseScreen*/} {/* @ts-ignore*/} {showServerDropdown ? : null}