Chore: Evaluate RoomMembersView - TypeScript (#4116)

* Chore: Evaluate RoomMembersView - TypeScript

* evaluate show action sheet

* fix tsubscriptionmodel

app/containers/ActionSheet/Item.tsx

@@ -2,20 +2,14 @@ import React from 'react';
 import { Text, View } from 'react-native';
 
 import { themes } from '../../lib/constants';
-import { CustomIcon, TIconsName } from '../CustomIcon';
+import { CustomIcon } from '../CustomIcon';
 import { useTheme } from '../../theme';
 import { Button } from './Button';
+import { TActionSheetOptionsItem } from './Provider';
 import styles from './styles';
 
 export interface IActionSheetItem {
-	item: {
+	item: TActionSheetOptionsItem;
-		title: string;
-		icon: TIconsName;
-		danger?: boolean;
-		testID?: string;
-		onPress: () => void;
-		right?: Function;
-	};
 	hide(): void;
 }
 

app/containers/ActionSheet/Provider.tsx

@@ -3,7 +3,14 @@ import React, { ForwardedRef, forwardRef, useContext, useRef } from 'react';
 import ActionSheet from './ActionSheet';
 import { TIconsName } from '../CustomIcon';
 
-export type TActionSheetOptionsItem = { title: string; icon: TIconsName; onPress: () => void; danger?: boolean };
+export type TActionSheetOptionsItem = {
+	title: string;
+	icon: TIconsName;
+	danger?: boolean;
+	testID?: string;
+	onPress: () => void;
+	right?: () => React.ReactElement;
+};
 
 export type TActionSheetOptions = {
 	options: TActionSheetOptionsItem[];

app/lib/methods/helpers.ts

@@ -85,7 +85,7 @@ export function hasRole(role): boolean {
 	return userRoles.indexOf(role) > -1;
 }
 
-export async function hasPermission(permissions, rid?: any) {
+export async function hasPermission(permissions, rid?: any): boolean[] {
 	let roomRoles = [];
 	if (rid) {
 		const db = database.active;

app/stacks/MasterDetailStack/types.ts

@@ -3,8 +3,7 @@ import { NavigatorScreenParams } from '@react-navigation/core';
 
 import { IAttachment } from '../../definitions/IAttachment';
 import { IMessage } from '../../definitions/IMessage';
-import { ISubscription, SubscriptionType } from '../../definitions/ISubscription';
+import { ISubscription, SubscriptionType, TSubscriptionModel } from '../../definitions/ISubscription';
-import { TRoomModel } from '../../definitions';
 
 export type MasterDetailChatsStackParamList = {
 	RoomView: {
@@ -56,7 +55,7 @@ export type ModalStackParamList = {
 	};
 	RoomMembersView: {
 		rid: string;
-		room: TRoomModel;
+		room: TSubscriptionModel;
 	};
 	DiscussionsView: {
 		rid: string;

app/views/LivechatEditView.tsx

@@ -66,7 +66,7 @@ const LivechatEditView = ({
 }: ILivechatEditViewProps) => {
 	const [customFields, setCustomFields] = useState<ICustomFields>({});
 	const [availableUserTags, setAvailableUserTags] = useState<string[]>([]);
-	const [permissions, setPermissions] = useState([]);
+	const [permissions, setPermissions] = useState<boolean[]>([]);
 
 	const params = {} as TParams;
 	const inputs = {} as IInputsRefs;

app/views/RoomInfoEditView/index.tsx

@@ -43,7 +43,7 @@ import { Services } from '../../lib/services';
 interface IRoomInfoEditViewState {
 	room: ISubscription;
 	avatar: IAvatar;
-	permissions: Record<TSupportedPermissions, string>;
+	permissions: { [key in TSupportedPermissions]?: boolean };
 	name: string;
 	description?: string;
 	topic?: string;
@@ -93,7 +93,7 @@ class RoomInfoEditView extends React.Component<IRoomInfoEditViewProps, IRoomInfo
 		this.state = {
 			room: {} as ISubscription,
 			avatar: {} as IAvatar,
-			permissions: {} as Record<TSupportedPermissions, string>,
+			permissions: {},
 			name: '',
 			description: '',
 			topic: '',
@@ -158,7 +158,6 @@ class RoomInfoEditView extends React.Component<IRoomInfoEditViewProps, IRoomInfo
 			);
 
 			this.setState({
-				// @ts-ignore - Solved by migrating the hasPermission function
 				permissions: {
 					'set-readonly': result[0],
 					'set-react-when-readonly': result[1],

app/views/RoomMembersView/index.tsx

@@ -5,7 +5,7 @@ import { connect } from 'react-redux';
 import { Observable, Subscription } from 'rxjs';
 
 import { themes } from '../../lib/constants';
-import { withActionSheet } from '../../containers/ActionSheet';
+import { TActionSheetOptions, TActionSheetOptionsItem, withActionSheet } from '../../containers/ActionSheet';
 import ActivityIndicator from '../../containers/ActivityIndicator';
 import * as HeaderButton from '../../containers/HeaderButton';
 import * as List from '../../containers/List';
@@ -13,7 +13,7 @@ import SafeAreaView from '../../containers/SafeAreaView';
 import SearchBox from '../../containers/SearchBox';
 import StatusBar from '../../containers/StatusBar';
 import { LISTENER } from '../../containers/Toast';
-import { IApplicationState, IBaseScreen, IUser, SubscriptionType, TRoomModel, TUserModel } from '../../definitions';
+import { IApplicationState, IBaseScreen, IUser, SubscriptionType, TSubscriptionModel, TUserModel } from '../../definitions';
 import I18n from '../../i18n';
 import database from '../../lib/database';
 import { CustomIcon } from '../../containers/CustomIcon';
@@ -27,6 +27,7 @@ import { goRoom, TGoRoomItem } from '../../utils/goRoom';
 import { showConfirmationAlert, showErrorAlert } from '../../utils/info';
 import log from '../../utils/log';
 import scrollPersistTaps from '../../utils/scrollPersistTaps';
+import { TSupportedPermissions } from '../../reducers/permissions';
 import { getRoomTitle, hasPermission, isGroupChat, RoomTypes } from '../../lib/methods';
 import styles from './styles';
 import { Services } from '../../lib/services';
@@ -37,13 +38,13 @@ interface IRoomMembersViewProps extends IBaseScreen<ModalStackParamList, 'RoomMe
 	rid: string;
 	members: string[];
 	baseUrl: string;
-	room: TRoomModel;
+	room: TSubscriptionModel;
 	user: {
 		id: string;
 		token: string;
 		roles: string[];
 	};
-	showActionSheet: (params: any) => {}; // TODO: this work?
+	showActionSheet: (params: TActionSheetOptions) => {};
 	theme: TSupportedThemes;
 	isMasterDetail: boolean;
 	useRealName: boolean;
@@ -64,14 +65,14 @@ interface IRoomMembersViewState {
 	rid: string;
 	members: TUserModel[];
 	membersFiltered: TUserModel[];
-	room: TRoomModel;
+	room: TSubscriptionModel;
 	end: boolean;
 }
 
 class RoomMembersView extends React.Component<IRoomMembersViewProps, IRoomMembersViewState> {
 	private mounted: boolean;
-	private permissions: any; // TODO: fix when get props from api
+	private permissions: { [key in TSupportedPermissions]?: boolean };
-	private roomObservable!: Observable<TRoomModel>;
+	private roomObservable!: Observable<TSubscriptionModel>;
 	private subscription!: Subscription;
 	private roomRoles: any;
 
@@ -88,7 +89,7 @@ class RoomMembersView extends React.Component<IRoomMembersViewProps, IRoomMember
 			rid,
 			members: [],
 			membersFiltered: [],
-			room: room || ({} as TRoomModel),
+			room: room || ({} as TSubscriptionModel),
 			end: false
 		};
 		if (room && room.observe) {
@@ -109,7 +110,6 @@ class RoomMembersView extends React.Component<IRoomMembersViewProps, IRoomMember
 		this.mounted = true;
 		this.fetchMembers();
 
-		// @ts-ignore - TODO: room param is wrong
 		if (isGroupChat(room)) {
 			return;
 		}
@@ -285,7 +285,7 @@ class RoomMembersView extends React.Component<IRoomMembersViewProps, IRoomMember
 		const { room } = this.state;
 		const { showActionSheet, user, theme } = this.props;
 
-		const options: {}[] = [
+		const options: TActionSheetOptionsItem[] = [
 			{
 				icon: 'message',
 				title: I18n.t('Direct_message'),