diff --git a/app/components/channel_actions/add_people_box/add_people_box.tsx b/app/components/channel_actions/add_people_box/add_people_box.tsx index eb81ad9518..345a3a3af6 100644 --- a/app/components/channel_actions/add_people_box/add_people_box.tsx +++ b/app/components/channel_actions/add_people_box/add_people_box.tsx @@ -8,22 +8,20 @@ import {StyleProp, ViewStyle} from 'react-native'; import OptionBox from '@components/option_box'; import {Screens} from '@constants'; import {useTheme} from '@context/theme'; -import {ChannelModel} from '@database/models/server'; import {dismissBottomSheet, goToScreen, showModal} from '@screens/navigation'; import {changeOpacity} from '@utils/theme'; type Props = { - channel: ChannelModel; + channelId: string; containerStyle?: StyleProp; + displayName: string; inModal?: boolean; testID?: string; } -const AddPeopleBox = ({channel, containerStyle, inModal, testID}: Props) => { +const AddPeopleBox = ({channelId, containerStyle, displayName, inModal, testID}: Props) => { const intl = useIntl(); const theme = useTheme(); - const channelId = channel.id; - const displayName = channel.displayName; const onAddPeople = useCallback(async () => { const title = intl.formatMessage({id: 'mobile.channel_add_people.title', defaultMessage: 'Add Members'}); diff --git a/app/components/channel_actions/add_people_box/index.tsx b/app/components/channel_actions/add_people_box/index.tsx index d6f03cf435..c387fa9751 100644 --- a/app/components/channel_actions/add_people_box/index.tsx +++ b/app/components/channel_actions/add_people_box/index.tsx @@ -3,6 +3,8 @@ import {withDatabase} from '@nozbe/watermelondb/DatabaseProvider'; import withObservables from '@nozbe/with-observables'; +import {of as of$} from 'rxjs'; +import {switchMap} from 'rxjs/operators'; import {observeChannel} from '@queries/servers/channel'; @@ -15,8 +17,11 @@ type Props = WithDatabaseArgs & { } const enhanced = withObservables(['channelId'], ({channelId, database}: Props) => { + const channel = observeChannel(database, channelId); + const displayName = channel.pipe(switchMap((c) => of$(c?.displayName))); + return { - channel: observeChannel(database, channelId), + displayName, }; });