move loading component to members_modal

app/screens/create_direct_message/create_direct_message.tsx

@@ -3,12 +3,11 @@
 
 import React, {useCallback, useEffect, useMemo, useReducer, useRef, useState} from 'react';
 import {defineMessages, useIntl} from 'react-intl';
-import {Keyboard, View} from 'react-native';
+import {Keyboard} from 'react-native';
 
 import {makeDirectChannel, makeGroupChannel} from '@actions/remote/channel';
 import {fetchProfiles, fetchProfilesInTeam, searchProfiles} from '@actions/remote/user';
 import CompassIcon from '@components/compass_icon';
-import Loading from '@components/loading';
 import {General} from '@constants';
 import {useServerUrl} from '@context/server';
 import {useTheme} from '@context/theme';
@@ -18,7 +17,6 @@ import {t} from '@i18n';
 import MembersModal from '@screens/members_modal';
 import {dismissModal, setButtons} from '@screens/navigation';
 import {alertErrorWithFallback} from '@utils/draft';
-import {makeStyleSheetFromTheme} from '@utils/theme';
 import {displayUsername, filterProfilesMatchingTerm} from '@utils/user';
 
 const START_BUTTON = 'start-conversation';
@@ -48,14 +46,6 @@ const close = () => {
     dismissModal();
 };
 
-const getStyleFromTheme = makeStyleSheetFromTheme(() => {
-    return {
-        container: {
-            flex: 1,
-        },
-    };
-});
-
 function reduceProfiles(state: UserProfile[], action: {type: 'add'; values?: UserProfile[]}) {
     if (action.type === 'add' && action.values?.length) {
         return [...state, ...action.values];
@@ -72,7 +62,6 @@ export default function CreateDirectMessage({
 }: Props) {
     const serverUrl = useServerUrl();
     const theme = useTheme();
-    const style = getStyleFromTheme(theme);
     const intl = useIntl();
     const {formatMessage} = intl;
 
@@ -297,14 +286,6 @@ export default function CreateDirectMessage({
         return profiles;
     }, [term, isSearch && selectedCount, isSearch && searchResults, profiles]);
 
-    if (startingConversation) {
-        return (
-            <View style={style.container}>
-                <Loading color={theme.centerChannelColor}/>
-            </View>
-        );
-    }
-
     return (
         <MembersModal
             data={data}
@@ -318,6 +299,7 @@ export default function CreateDirectMessage({
             term={term}
             page={page}
             selectedIds={selectedIds}
+            startingConversation={startingConversation}
         />
     );
 }

app/screens/members_modal/members_modal.tsx

@@ -6,6 +6,7 @@ import {useIntl} from 'react-intl';
 import {Platform, View} from 'react-native';
 import {SafeAreaView} from 'react-native-safe-area-context';
 
+import Loading from '@components/loading';
 import Search from '@components/search';
 import {General} from '@constants';
 import {useTheme} from '@context/theme';
@@ -57,6 +58,7 @@ type Props = {
     page: React.RefObject<any>;
     search: () => void;
     selectedIds: {[id: string]: UserProfile};
+    startingConversation: boolean;
     teammateNameDisplay: string;
     term: string;
     tutorialWatched: boolean;
@@ -74,6 +76,7 @@ export default function MembersModal({
     page,
     search,
     selectedIds,
+    startingConversation,
     teammateNameDisplay,
     term,
     tutorialWatched,
@@ -100,6 +103,14 @@ export default function MembersModal({
         onRemoveProfile(id);
     }, [onRemoveProfile]);
 
+    if (startingConversation) {
+        return (
+            <View style={style.container}>
+                <Loading color={theme.centerChannelColor}/>
+            </View>
+        );
+    }
+
     return (
         <SafeAreaView
             style={style.container}