diff --git a/src/nav/AppNavigator.js b/src/nav/AppNavigator.js index ed116bdb5f7..dd20b4e270b 100644 --- a/src/nav/AppNavigator.js +++ b/src/nav/AppNavigator.js @@ -29,7 +29,7 @@ import MessageReactionsScreen from '../reactions/MessageReactionsScreen'; import AccountDetailsScreen from '../account-info/AccountDetailsScreen'; import PmConversationDetailsScreen from '../chat/PmConversationDetailsScreen'; import SearchMessagesScreen from '../search/SearchMessagesScreen'; -import UsersScreen from '../users/UsersScreen'; +import New1to1PmScreen from '../user-picker/New1to1PmScreen'; import ChatScreen from '../chat/ChatScreen'; import LanguageScreen from '../settings/LanguageScreen'; import PasswordAuthScreen from '../start/PasswordAuthScreen'; @@ -39,7 +39,7 @@ import VariablesScreen from '../diagnostics/VariablesScreen'; import TimingScreen from '../diagnostics/TimingScreen'; import StorageScreen from '../diagnostics/StorageScreen'; import LightboxScreen from '../lightbox/LightboxScreen'; -import CreateGroupScreen from '../user-groups/CreateGroupScreen'; +import NewGroupPmScreen from '../user-picker/NewGroupPmScreen'; import InviteUsersScreen from '../streams/InviteUsersScreen'; import StreamSettingsScreen from '../streams/StreamSettingsScreen'; import CreateStreamScreen from '../streams/CreateStreamScreen'; @@ -70,10 +70,10 @@ export type AppNavigatorParamList = {| +'password-auth': RouteParamsOf, +'realm-input': RouteParamsOf, +'search-messages': RouteParamsOf, - +users: RouteParamsOf, + +'new-1to1-pm': RouteParamsOf, +language: RouteParamsOf, +lightbox: RouteParamsOf, - +'create-group': RouteParamsOf, + +'new-group-pm': RouteParamsOf, +'invite-users': RouteParamsOf, +diagnostics: RouteParamsOf, +variables: RouteParamsOf, @@ -178,10 +178,10 @@ export default function AppNavigator(props: Props): Node { name="search-messages" component={useHaveServerDataGate(SearchMessagesScreen)} /> - + - + diff --git a/src/pm-conversations/PmConversationsScreen.js b/src/pm-conversations/PmConversationsScreen.js index 79a93a37ed6..ca89c48c778 100644 --- a/src/pm-conversations/PmConversationsScreen.js +++ b/src/pm-conversations/PmConversationsScreen.js @@ -63,7 +63,7 @@ export default function PmConversationsScreen(props: Props): Node { style={styles.button} text="New PM" onPress={() => { - setTimeout(() => navigation.push('users')); + setTimeout(() => navigation.push('new-1to1-pm')); }} /> { - setTimeout(() => navigation.push('create-group')); + setTimeout(() => navigation.push('new-group-pm')); }} /> diff --git a/src/users/UsersCard.js b/src/user-picker/New1to1PmScreen.js similarity index 51% rename from src/users/UsersCard.js rename to src/user-picker/New1to1PmScreen.js index cc559b158a4..7eec8e35852 100644 --- a/src/users/UsersCard.js +++ b/src/user-picker/New1to1PmScreen.js @@ -1,25 +1,26 @@ /* @flow strict-local */ - -import React, { useCallback } from 'react'; +import React, { useCallback, useState } from 'react'; import type { Node } from 'react'; +import type { RouteProp } from '../react-navigation'; +import type { AppNavigationProp } from '../nav/AppNavigator'; +import Screen from '../common/Screen'; +import UserList from '../users/UserList'; import type { UserOrBot } from '../types'; import { useSelector, useDispatch } from '../react-redux'; import { pm1to1NarrowFromUser } from '../utils/narrow'; -import UserList from './UserList'; -import { getUsers, getPresence } from '../selectors'; +import { getUsers } from '../selectors'; import { navigateBack, doNarrow } from '../actions'; import { useNavigation } from '../react-navigation'; type Props = $ReadOnly<{| - filter: string, + navigation: AppNavigationProp<'new-1to1-pm'>, + route: RouteProp<'new-1to1-pm', void>, |}>; -export default function UsersCard(props: Props): Node { - const { filter } = props; +export default function New1to1PmScreen(props: Props): Node { const dispatch = useDispatch(); const users = useSelector(getUsers); - const presences = useSelector(getPresence); const navigation = useNavigation(); const handleUserNarrow = useCallback( @@ -30,7 +31,11 @@ export default function UsersCard(props: Props): Node { [dispatch, navigation], ); + const [filter, setFilter] = useState(''); + return ( - + + + ); } diff --git a/src/user-groups/CreateGroupScreen.js b/src/user-picker/NewGroupPmScreen.js similarity index 76% rename from src/user-groups/CreateGroupScreen.js rename to src/user-picker/NewGroupPmScreen.js index 1cf0e92ce85..a00a900163a 100644 --- a/src/user-groups/CreateGroupScreen.js +++ b/src/user-picker/NewGroupPmScreen.js @@ -10,22 +10,22 @@ import Screen from '../common/Screen'; import { doNarrow, navigateBack } from '../actions'; import { pmNarrowFromRecipients } from '../utils/narrow'; import { pmKeyRecipientsFromUsers } from '../utils/recipient'; -import UserPickerCard from '../user-picker/UserPickerCard'; +import UserPickerCard from './UserPickerCard'; import { getOwnUserId } from '../users/userSelectors'; type Props = $ReadOnly<{| - navigation: AppNavigationProp<'create-group'>, - route: RouteProp<'create-group', void>, + navigation: AppNavigationProp<'new-group-pm'>, + route: RouteProp<'new-group-pm', void>, |}>; -export default function CreateGroupScreen(props: Props): Node { +export default function NewGroupPmScreen(props: Props): Node { const { navigation } = props; const dispatch = useDispatch(); const ownUserId = useSelector(getOwnUserId); const [filter, setFilter] = useState(''); - const handleCreateGroup = useCallback( + const handlePickerComplete = useCallback( (selected: $ReadOnlyArray) => { navigation.dispatch(navigateBack()); dispatch(doNarrow(pmNarrowFromRecipients(pmKeyRecipientsFromUsers(selected, ownUserId)))); @@ -35,7 +35,7 @@ export default function CreateGroupScreen(props: Props): Node { return ( - + ); } diff --git a/src/user-picker/UserPickerCard.js b/src/user-picker/UserPickerCard.js index 2353aa170c8..02a55c7e0d9 100644 --- a/src/user-picker/UserPickerCard.js +++ b/src/user-picker/UserPickerCard.js @@ -14,7 +14,7 @@ import { IconDone } from '../common/Icons'; import UserList from '../users/UserList'; import AvatarList from './AvatarList'; import AnimatedScaleComponent from '../animation/AnimatedScaleComponent'; -import { getUsers, getPresence } from '../selectors'; +import { getUsers } from '../selectors'; import { getOwnUserId } from '../users/userSelectors'; const styles = createStyleSheet({ @@ -51,7 +51,6 @@ export default function UserPickerCard(props: Props): Node { const { filter, showOwnUser } = props; const users = useSelector(state => getUsersToShow(state, showOwnUser)); - const presences = useSelector(getPresence); const [selectedState, setSelectedState] = useState<$ReadOnlyArray>([]); const listRef = useRef | null>(null); @@ -80,7 +79,6 @@ export default function UserPickerCard(props: Props): Node { { setSelectedState(state => { diff --git a/src/users/UserList.js b/src/users/UserList.js index 5302ae53cb0..c62d4d4e27a 100644 --- a/src/users/UserList.js +++ b/src/users/UserList.js @@ -4,13 +4,14 @@ import type { Node } from 'react'; import { SectionList } from 'react-native'; import { useSelector } from '../react-redux'; -import type { PresenceState, UserOrBot } from '../types'; +import type { UserOrBot } from '../types'; import { createStyleSheet } from '../styles'; import SectionHeader from '../common/SectionHeader'; import SearchEmptyState from '../common/SearchEmptyState'; import UserItem from './UserItem'; import { sortUserList, filterUserList, groupUsersByStatus } from './userHelpers'; import { getMutedUsers } from '../selectors'; +import { getPresence } from '../directSelectors'; const styles = createStyleSheet({ list: { @@ -22,13 +23,14 @@ type Props = $ReadOnly<{| filter: string, users: $ReadOnlyArray, selected?: $ReadOnlyArray, - presences: PresenceState, onPress: (user: UserOrBot) => void, |}>; export default function UserList(props: Props): Node { - const { filter, users, presences, onPress, selected = [] } = props; + const { filter, users, onPress, selected = [] } = props; const mutedUsers = useSelector(getMutedUsers); + const presences = useSelector(getPresence); + const filteredUsers = filterUserList(users, filter).filter(user => !mutedUsers.has(user.user_id)); if (filteredUsers.length === 0) { diff --git a/src/users/UsersScreen.js b/src/users/UsersScreen.js deleted file mode 100644 index 3ad120bb7b6..00000000000 --- a/src/users/UsersScreen.js +++ /dev/null @@ -1,23 +0,0 @@ -/* @flow strict-local */ -import React, { useState } from 'react'; -import type { Node } from 'react'; - -import type { RouteProp } from '../react-navigation'; -import type { AppNavigationProp } from '../nav/AppNavigator'; -import Screen from '../common/Screen'; -import UsersCard from './UsersCard'; - -type Props = $ReadOnly<{| - navigation: AppNavigationProp<'users'>, - route: RouteProp<'users', void>, -|}>; - -export default function UsersScreen(props: Props): Node { - const [filter, setFilter] = useState(''); - - return ( - - - - ); -}