Chore: Clean InAppNotification - TypeScript (#3920)

app/containers/InAppNotification/NotifierComponent.tsx

@@ -14,9 +14,18 @@ import { ROW_HEIGHT } from '../../presentation/RoomItem';
 import { goRoom } from '../../utils/goRoom';
 import Navigation from '../../lib/Navigation';
 import { useOrientation } from '../../dimensions';
+import { IApplicationState, ISubscription, SubscriptionType } from '../../definitions';
 
-interface INotifierComponent {
-	notification: object;
+export interface INotifierComponent {
+	notification: {
+		text: string;
+		payload: {
+			sender: { username: string };
+			type: SubscriptionType;
+		} & Pick<ISubscription, '_id' | 'name' | 'rid' | 'prid'>;
+		title: string;
+		avatar: string;
+	};
 	isMasterDetail: boolean;
 }
 
@@ -67,15 +76,15 @@ const styles = StyleSheet.create({
 const hideNotification = () => Notifier.hideNotification();
 
 const NotifierComponent = React.memo(({ notification, isMasterDetail }: INotifierComponent) => {
-	const { theme }: any = useTheme();
+	const { theme } = useTheme();
 	const insets = useSafeAreaInsets();
 	const { isLandscape } = useOrientation();
 
-	const { text, payload }: any = notification;
+	const { text, payload } = notification;
 	const { type, rid } = payload;
 	const name = type === 'd' ? payload.sender.username : payload.name;
 	// if sub is not on local database, title and avatar will be null, so we use payload from notification
-	const { title = name, avatar = name }: any = notification;
+	const { title = name, avatar = name } = notification;
 
 	const onPress = () => {
 		const { prid, _id } = payload;
@@ -133,7 +142,7 @@ const NotifierComponent = React.memo(({ notification, isMasterDetail }: INotifie
 	);
 });
 
-const mapStateToProps = (state: any) => ({
+const mapStateToProps = (state: IApplicationState) => ({
 	isMasterDetail: state.app.isMasterDetail
 });
 

app/containers/InAppNotification/index.tsx

@@ -3,16 +3,18 @@ import { Easing, Notifier, NotifierRoot } from 'react-native-notifier';
 import { connect } from 'react-redux';
 import { dequal } from 'dequal';
 
-import NotifierComponent from './NotifierComponent';
+import NotifierComponent, { INotifierComponent } from './NotifierComponent';
 import EventEmitter from '../../utils/events';
 import Navigation from '../../lib/Navigation';
 import { getActiveRoute } from '../../utils/navigation';
+import { IApplicationState } from '../../definitions';
+import { IRoom } from '../../reducers/room';
 
 export const INAPP_NOTIFICATION_EMITTER = 'NotificationInApp';
 
 const InAppNotification = memo(
-	({ rooms, appState }: { rooms: any; appState: string }) => {
-		const show = (notification: any) => {
+	({ rooms, appState }: { rooms: IRoom['rooms']; appState: string }) => {
+		const show = (notification: INotifierComponent['notification']) => {
 			if (appState !== 'foreground') {
 				return;
 			}
@@ -46,7 +48,7 @@ const InAppNotification = memo(
 	(prevProps, nextProps) => dequal(prevProps.rooms, nextProps.rooms)
 );
 
-const mapStateToProps = (state: any) => ({
+const mapStateToProps = (state: IApplicationState) => ({
 	rooms: state.room.rooms,
 	appState: state.app.ready && state.app.foreground ? 'foreground' : 'background'
 });