From 9788e8a11f1feb96eaff4ccee2995f7d679bacda Mon Sep 17 00:00:00 2001
From: Diego Mello <diegolmello@gmail.com>
Date: Wed, 7 Dec 2022 11:09:51 -0300
Subject: [PATCH] Remove width prop drill

---
 app/containers/RoomItem/Touchable.tsx | 7 ++++++-
 app/containers/RoomItem/index.tsx     | 2 --
 app/containers/RoomItem/interfaces.ts | 2 --
 app/views/RoomsListView/index.tsx     | 9 ++-------
 4 files changed, 8 insertions(+), 12 deletions(-)

diff --git a/app/containers/RoomItem/Touchable.tsx b/app/containers/RoomItem/Touchable.tsx
index 881a24cbf..5132e6ab3 100644
--- a/app/containers/RoomItem/Touchable.tsx
+++ b/app/containers/RoomItem/Touchable.tsx
@@ -13,6 +13,7 @@ import {
 	HandlerStateChangeEventPayload,
 	PanGestureHandlerEventPayload
 } from 'react-native-gesture-handler';
+import { useWindowDimensions } from 'react-native';
 
 import Touch from '../Touch';
 import { ACTION_WIDTH, LONG_SWIPE, SMALL_SWIPE } from './styles';
@@ -20,6 +21,8 @@ import { LeftActions, RightActions } from './Actions';
 import { ITouchableProps } from './interfaces';
 import { useTheme } from '../../theme';
 import I18n from '../../i18n';
+import { MAX_SIDEBAR_WIDTH } from '../../lib/constants';
+import { useAppSelector } from '../../lib/hooks';
 
 const Touchable = ({
 	children,
@@ -27,7 +30,6 @@ const Touchable = ({
 	onPress,
 	onLongPress,
 	testID,
-	width,
 	favorite,
 	isRead,
 	rid,
@@ -39,6 +41,9 @@ const Touchable = ({
 	displayMode
 }: ITouchableProps): React.ReactElement => {
 	const { colors } = useTheme();
+	const { width: deviceWidth } = useWindowDimensions();
+	const isMasterDetail = useAppSelector(state => state.app.isMasterDetail);
+	const width = isMasterDetail ? MAX_SIDEBAR_WIDTH : deviceWidth;
 
 	const rowOffSet = useSharedValue(0);
 	const transX = useSharedValue(0);
diff --git a/app/containers/RoomItem/index.tsx b/app/containers/RoomItem/index.tsx
index e2ccb9c6c..2534894d5 100644
--- a/app/containers/RoomItem/index.tsx
+++ b/app/containers/RoomItem/index.tsx
@@ -16,7 +16,6 @@ const RoomItemContainer = ({
 	id,
 	onPress,
 	onLongPress,
-	width,
 	toggleFav,
 	toggleRead,
 	hideChannel,
@@ -88,7 +87,6 @@ const RoomItemContainer = ({
 			onLongPress={handleOnLongPress}
 			date={date}
 			accessibilityLabel={accessibilityLabel}
-			width={width}
 			favorite={item.f}
 			rid={item.rid}
 			toggleFav={toggleFav}
diff --git a/app/containers/RoomItem/interfaces.ts b/app/containers/RoomItem/interfaces.ts
index bf2cc3604..8e4155644 100644
--- a/app/containers/RoomItem/interfaces.ts
+++ b/app/containers/RoomItem/interfaces.ts
@@ -78,7 +78,6 @@ interface IBaseRoomItem extends IRoomItemTouchables {
 	showAvatar: boolean;
 	swipeEnabled: boolean;
 	autoJoin?: boolean;
-	width: number;
 	username?: string;
 }
 
@@ -131,7 +130,6 @@ export interface ITouchableProps extends IRoomItemTouchables {
 	children: JSX.Element;
 	type: SubscriptionType;
 	testID: string;
-	width: number;
 	favorite: boolean;
 	isRead: boolean;
 	rid: string;
diff --git a/app/views/RoomsListView/index.tsx b/app/views/RoomsListView/index.tsx
index 16705abcc..dca97280d 100644
--- a/app/views/RoomsListView/index.tsx
+++ b/app/views/RoomsListView/index.tsx
@@ -40,7 +40,6 @@ import {
 import { getUserSelector } from '../../selectors/login';
 import { goRoom } from '../../lib/methods/helpers/goRoom';
 import SafeAreaView from '../../containers/SafeAreaView';
-import { withDimensions } from '../../dimensions';
 import { getInquiryQueueSelector } from '../../ee/omnichannel/selectors/inquiry';
 import { IApplicationState, ISubscription, IUser, RootEnum, SubscriptionType, TSubscriptionModel } from '../../definitions';
 import styles from './styles';
@@ -58,7 +57,7 @@ import {
 	debounce,
 	isTablet
 } from '../../lib/methods/helpers';
-import { E2E_BANNER_TYPE, DisplayMode, SortBy, MAX_SIDEBAR_WIDTH, themes } from '../../lib/constants';
+import { E2E_BANNER_TYPE, DisplayMode, SortBy, themes } from '../../lib/constants';
 import { Services } from '../../lib/services';
 
 type TNavigation = CompositeNavigationProp<
@@ -86,7 +85,6 @@ interface IRoomsListViewProps {
 	useRealName: boolean;
 	isMasterDetail: boolean;
 	subscribedRoom: string;
-	width: number;
 	insets: { left: number; bottom: number; right: number; top: number };
 	queueSize: number;
 	inquiryEnabled: boolean;
@@ -814,8 +812,6 @@ class RoomsListView extends React.Component<IRoomsListViewProps, IRoomsListViewS
 			user: { username },
 			StoreLastMessage,
 			useRealName,
-			isMasterDetail,
-			width,
 			showAvatar,
 			displayMode
 		} = this.props;
@@ -829,7 +825,6 @@ class RoomsListView extends React.Component<IRoomsListViewProps, IRoomsListViewS
 				username={username}
 				showLastMessage={StoreLastMessage}
 				onPress={this.onPressItem}
-				width={isMasterDetail ? MAX_SIDEBAR_WIDTH : width}
 				toggleFav={this.toggleFav}
 				toggleRead={this.toggleRead}
 				hideChannel={this.hideChannel}
@@ -925,4 +920,4 @@ const mapStateToProps = (state: IApplicationState) => ({
 	createDiscussionPermission: state.permissions['start-discussion']
 });
 
-export default connect(mapStateToProps)(withDimensions(withTheme(withSafeAreaInsets(RoomsListView))));
+export default connect(mapStateToProps)(withTheme(withSafeAreaInsets(RoomsListView)));