diff --git a/app/views/ThreadMessagesView/Dropdown/DropdownItem.tsx b/app/views/ThreadMessagesView/Dropdown/DropdownItem.tsx index a2eabe7f..c1ac5357 100644 --- a/app/views/ThreadMessagesView/Dropdown/DropdownItem.tsx +++ b/app/views/ThreadMessagesView/Dropdown/DropdownItem.tsx @@ -1,8 +1,7 @@ import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; -import { themes } from '../../../lib/constants'; -import { TSupportedThemes, withTheme } from '../../../theme'; +import { useTheme } from '../../../theme'; import Touch from '../../../utils/touch'; import { CustomIcon, TIconsName } from '../../../containers/CustomIcon'; import sharedStyles from '../../Styles'; @@ -25,17 +24,19 @@ const styles = StyleSheet.create({ interface IDropdownItem { text: string; iconName: TIconsName | null; - theme?: TSupportedThemes; onPress: () => void; } -const DropdownItem = React.memo(({ theme, onPress, iconName, text }: IDropdownItem) => ( - - - {text} - {iconName ? : null} - - -)); +const DropdownItem = React.memo(({ onPress, iconName, text }: IDropdownItem) => { + const { colors, theme } = useTheme(); + return ( + + + {text} + {iconName ? : null} + + + ); +}); -export default withTheme(DropdownItem); +export default DropdownItem; diff --git a/app/views/ThreadMessagesView/Dropdown/index.tsx b/app/views/ThreadMessagesView/Dropdown/index.tsx index 8caade7d..d921fe66 100644 --- a/app/views/ThreadMessagesView/Dropdown/index.tsx +++ b/app/views/ThreadMessagesView/Dropdown/index.tsx @@ -15,7 +15,7 @@ const ANIMATION_DURATION = 200; interface IDropdownProps { isMasterDetail?: boolean; - theme?: TSupportedThemes; + theme: TSupportedThemes; insets?: EdgeInsets; currentFilter: Filter; onClose: () => void; @@ -59,7 +59,7 @@ class Dropdown extends React.Component { }); const backdropOpacity = this.animatedValue.interpolate({ inputRange: [0, 1], - outputRange: [0, themes[theme!].backdropOpacity] + outputRange: [0, themes[theme].backdropOpacity] }); return ( <> @@ -68,7 +68,7 @@ class Dropdown extends React.Component { style={[ styles.backdrop, { - backgroundColor: themes[theme!].backdropColor, + backgroundColor: themes[theme].backdropColor, opacity: backdropOpacity, top: heightDestination } @@ -80,8 +80,8 @@ class Dropdown extends React.Component { styles.dropdownContainer, { transform: [{ translateY }], - backgroundColor: themes[theme!].backgroundColor, - borderColor: themes[theme!].separatorColor + backgroundColor: themes[theme].backgroundColor, + borderColor: themes[theme].separatorColor } ]}> diff --git a/app/views/ThreadMessagesView/Item.tsx b/app/views/ThreadMessagesView/Item.tsx index e5339f43..fb6c863e 100644 --- a/app/views/ThreadMessagesView/Item.tsx +++ b/app/views/ThreadMessagesView/Item.tsx @@ -9,7 +9,7 @@ import { themes } from '../../lib/constants'; import { MarkdownPreview } from '../../containers/markdown'; import { formatDateThreads, makeThreadName } from '../../utils/room'; import ThreadDetails from '../../containers/ThreadDetails'; -import { TThreadModel } from '../../definitions/IThread'; +import { TThreadModel } from '../../definitions'; const styles = StyleSheet.create({ container: { @@ -59,7 +59,7 @@ const styles = StyleSheet.create({ interface IItem { item: TThreadModel; useRealName: boolean; - user: any; + user: { id: string }; badgeColor?: string; onPress: (item: TThreadModel) => void; toggleFollowThread: (isFollowing: boolean, id: string) => void; diff --git a/app/views/ThreadMessagesView/index.tsx b/app/views/ThreadMessagesView/index.tsx index 1d653e9d..ec4340a3 100644 --- a/app/views/ThreadMessagesView/index.tsx +++ b/app/views/ThreadMessagesView/index.tsx @@ -4,8 +4,7 @@ import { connect } from 'react-redux'; import { Q } from '@nozbe/watermelondb'; import { sanitizedRaw } from '@nozbe/watermelondb/RawRecord'; import { EdgeInsets, withSafeAreaInsets } from 'react-native-safe-area-context'; -import { HeaderBackButton, StackNavigationOptions, StackNavigationProp } from '@react-navigation/stack'; -import { RouteProp } from '@react-navigation/native'; +import { HeaderBackButton, StackNavigationOptions } from '@react-navigation/stack'; import { Observable, Subscription } from 'rxjs'; import ActivityIndicator from '../../containers/ActivityIndicator'; @@ -36,20 +35,12 @@ import DropdownItemHeader from './Dropdown/DropdownItemHeader'; import Dropdown from './Dropdown'; import Item from './Item'; import styles from './styles'; -import { IMessage, SubscriptionType, TSubscriptionModel, TThreadModel } from '../../definitions'; +import { IApplicationState, IBaseScreen, IMessage, SubscriptionType, TSubscriptionModel, TThreadModel } from '../../definitions'; import { getUidDirectMessage } from '../../lib/methods'; import { Services } from '../../lib/services'; const API_FETCH_COUNT = 50; -// interface IResultFetch { -// threads: IThreadResult[]; -// count: number; -// offset: number; -// total: number; -// success: boolean; -// } - interface IThreadMessagesViewState { loading: boolean; end: boolean; @@ -62,10 +53,8 @@ interface IThreadMessagesViewState { searchText: string; } -interface IThreadMessagesViewProps { - navigation: StackNavigationProp; - route: RouteProp; - user: any; +interface IThreadMessagesViewProps extends IBaseScreen { + user: { id: string }; baseUrl: string; useRealName: boolean; theme: TSupportedThemes; @@ -80,7 +69,7 @@ class ThreadMessagesView extends React.Component remove.find(i2 => i1.id === i2._id)); @@ -286,7 +275,9 @@ class ThreadMessagesView extends React.Component buildMessage(m)) as IMessage[]; // filter threads - threadsToCreate = update.filter(i1 => !allThreadsRecords.find((i2: { id: string }) => i1._id === i2.id)); + threadsToCreate = update.filter( + i1 => !allThreadsRecords.find((i2: { id: string }) => i1._id === i2.id) + ) as TThreadModel[]; threadsToUpdate = allThreadsRecords.filter((i1: { id: string }) => update.find(i2 => i1.id === i2._id)); threadsToCreate = threadsToCreate.map(thread => threadsCollection.prepareCreate( @@ -298,10 +289,10 @@ class ThreadMessagesView extends React.Component { - const newThread = update.find(t => t._id === thread.id); + const newThread = update.find(t => t._id === thread?.id); try { - return thread.prepareUpdate( - protectedFunction((t: any) => { + return thread?.prepareUpdate( + protectedFunction((t: TThreadModel) => { Object.assign(t, newThread); }) ); @@ -316,7 +307,7 @@ class ThreadMessagesView extends React.Component { + subscription.prepareUpdate(s => { s.lastThreadSync = lastThreadSync; }) ); @@ -421,7 +412,6 @@ class ThreadMessagesView extends React.Component { - // const { currentFilter } = this.state; const { user } = this.props; if (currentFilter === Filter.Following) { return messages?.filter(item => item?.replies?.find(u => u === user.id)); @@ -534,23 +524,29 @@ class ThreadMessagesView extends React.Component {this.renderContent()} {showFilterDropdown ? ( - + ) : null} ); } } -const mapStateToProps = (state: any) => ({ +const mapStateToProps = (state: IApplicationState) => ({ baseUrl: state.server.server, user: getUserSelector(state), - useRealName: state.settings.UI_Use_Real_Name, + useRealName: state.settings.UI_Use_Real_Name as boolean, isMasterDetail: state.app.isMasterDetail });