Chore: Migrate ShareListView to Typescript

app/externalModules.d.ts

@@ -9,3 +9,4 @@ declare module '@rocket.chat/ui-kit';
 declare module '@rocket.chat/sdk';
 declare module 'react-native-config-reader';
 declare module 'react-native-keycommands';
+declare module 'react-native-mime-types';

app/presentation/DirectoryItem/index.tsx

@@ -10,7 +10,7 @@ import { themes } from '../../constants/colors';
 export { ROW_HEIGHT };
 
 interface IDirectoryItemLabel {
-	text: string;
+	text?: string;
 	theme: string;
 }
 
@@ -21,9 +21,9 @@ interface IDirectoryItem {
 	type: string;
 	onPress(): void;
 	testID: string;
-	style: any;
-	rightLabel: string;
-	rid: string;
+	style?: any;
+	rightLabel?: string;
+	rid?: string;
 	theme: string;
 	teamMain?: boolean;
 }
@@ -32,7 +32,7 @@ const DirectoryItemLabel = React.memo(({ text, theme }: IDirectoryItemLabel) =>
 	if (!text) {
 		return null;
 	}
-	return <Text style={[styles.directoryItemLabel, { color: themes[theme!].auxiliaryText }]}>{text}</Text>;
+	return <Text style={[styles.directoryItemLabel, { color: themes[theme].auxiliaryText }]}>{text}</Text>;
 });
 
 const DirectoryItem = ({

app/views/ShareListView/Header/Header.android.js → app/views/ShareListView/Header/Header.android.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { StyleSheet, Text, View } from 'react-native';
-import PropTypes from 'prop-types';
 
 import TextInput from '../../../presentation/TextInput';
 import I18n from '../../../i18n';
@@ -24,7 +23,13 @@ const styles = StyleSheet.create({
 	}
 });
 
-const Header = React.memo(({ searching, onChangeSearchText, theme }) => {
+interface IHeader {
+	searching: boolean;
+	onChangeSearchText(text: string): void;
+	theme: string;
+}
+
+const Header = React.memo(({ searching, onChangeSearchText, theme }: IHeader) => {
 	const titleColorStyle = { color: themes[theme].headerTintColor };
 	const isLight = theme === 'light';
 	if (searching) {
@@ -43,10 +48,4 @@ const Header = React.memo(({ searching, onChangeSearchText, theme }) => {
 	return <Text style={[styles.title, titleColorStyle]}>{I18n.t('Send_to')}</Text>;
 });
 
-Header.propTypes = {
-	searching: PropTypes.bool,
-	onChangeSearchText: PropTypes.func,
-	theme: PropTypes.string
-};
-
 export default Header;

app/views/ShareListView/Header/Header.ios.js → app/views/ShareListView/Header/Header.ios.tsx

@@ -1,5 +1,4 @@
 import React, { useState } from 'react';
-import PropTypes from 'prop-types';
 import { Keyboard, StyleSheet, View } from 'react-native';
 import ShareExtension from 'rn-extensions-share';
 
@@ -16,10 +15,18 @@ const styles = StyleSheet.create({
 	}
 });
 
-const Header = React.memo(({ searching, onChangeSearchText, initSearch, cancelSearch, theme }) => {
+interface IHeader {
+	searching: boolean;
+	onChangeSearchText(text: string): void;
+	initSearch: Function;
+	cancelSearch: Function;
+	theme: string;
+}
+
+const Header = React.memo(({ searching, onChangeSearchText, initSearch, cancelSearch, theme }: IHeader) => {
 	const [text, setText] = useState('');
 
-	const onChangeText = searchText => {
+	const onChangeText = (searchText: string) => {
 		onChangeSearchText(searchText);
 		setText(searchText);
 	};
@@ -59,12 +66,4 @@ const Header = React.memo(({ searching, onChangeSearchText, initSearch, cancelSe
 	);
 });
 
-Header.propTypes = {
-	searching: PropTypes.bool,
-	onChangeSearchText: PropTypes.func,
-	initSearch: PropTypes.func,
-	cancelSearch: PropTypes.func,
-	theme: PropTypes.string
-};
-
 export default Header;

app/views/ShareListView/Header/index.js → app/views/ShareListView/Header/index.tsx

@@ -1,10 +1,19 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 
+// @ts-ignore
+// eslint-disable-next-line import/extensions,import/no-unresolved
 import Header from './Header';
 
-const ShareListHeader = React.memo(({ searching, initSearch, cancelSearch, search, theme }) => {
-	const onSearchChangeText = text => {
+interface IShareListHeader {
+	searching: boolean;
+	initSearch?: () => void;
+	cancelSearch?: () => void;
+	search(text: string): void;
+	theme: string;
+}
+
+const ShareListHeader = React.memo(({ searching, initSearch, cancelSearch, search, theme }: IShareListHeader) => {
+	const onSearchChangeText = (text: string) => {
 		search(text.trim());
 	};
 
@@ -19,12 +28,4 @@ const ShareListHeader = React.memo(({ searching, initSearch, cancelSearch, searc
 	);
 });
 
-ShareListHeader.propTypes = {
-	searching: PropTypes.bool,
-	initSearch: PropTypes.func,
-	cancelSearch: PropTypes.func,
-	search: PropTypes.func,
-	theme: PropTypes.string
-};
-
 export default ShareListHeader;