diff --git a/web/modals/threads/create/compose-subchannel-modal.react.js b/web/modals/threads/create/compose-subchannel-modal.react.js --- a/web/modals/threads/create/compose-subchannel-modal.react.js +++ b/web/modals/threads/create/compose-subchannel-modal.react.js @@ -87,10 +87,10 @@ const dispatchActionPromise = useDispatchActionPromise(); const dispatch = useDispatch(); + const threadType = getThreadType(visibilityType, announcement); + const createSubchannel = React.useCallback(async () => { try { - const threadType = getThreadType(visibilityType, announcement); - const query = calendarQuery(); const result = await callNewThinThread({ name: channelName, @@ -107,11 +107,10 @@ return null; } }, [ - visibilityType, - announcement, calendarQuery, callNewThinThread, channelName, + threadType, parentThreadInfo.id, parentThreadInfo.color, pendingUsersToAdd, @@ -184,8 +183,13 @@ ); const subchannelMembers = React.useMemo( - () => , - [parentThreadInfo], + () => ( + + ), + [parentThreadInfo, threadType], ); const modalName = diff --git a/web/modals/threads/create/steps/subchannel-members.react.js b/web/modals/threads/create/steps/subchannel-members.react.js --- a/web/modals/threads/create/steps/subchannel-members.react.js +++ b/web/modals/threads/create/steps/subchannel-members.react.js @@ -3,6 +3,7 @@ import * as React from 'react'; import type { ThreadInfo } from 'lib/types/minimally-encoded-thread-permissions-types.js'; +import type { ThreadType } from 'lib/types/thread-types-enum.js'; import css from './subchannel-members.css'; import Search from '../../../../components/search.react.js'; @@ -11,17 +12,19 @@ type SubchannelMembersProps = { +parentThreadInfo: ThreadInfo, + +threadType: ThreadType, }; function SubchannelMembers(props: SubchannelMembersProps): React.Node { - const { parentThreadInfo } = props; + const { parentThreadInfo, threadType } = props; const [searchUserText, setSearchUserText] = React.useState(''); const { userInfos, sortedUsersWithENSNames } = useSubchannelAddMembersListUserInfos({ - parentThreadID: parentThreadInfo.id, + parentThreadInfo, searchText: searchUserText, + threadType, }); return ( diff --git a/web/settings/relationship/add-users-list.react.js b/web/settings/relationship/add-users-list.react.js --- a/web/settings/relationship/add-users-list.react.js +++ b/web/settings/relationship/add-users-list.react.js @@ -15,7 +15,7 @@ type Props = { +searchModeActive: boolean, +userInfos: { - [string]: T, + +[string]: T, }, +sortedUsersWithENSNames: $ReadOnlyArray, }; diff --git a/web/settings/relationship/add-users-utils.js b/web/settings/relationship/add-users-utils.js --- a/web/settings/relationship/add-users-utils.js +++ b/web/settings/relationship/add-users-utils.js @@ -1,19 +1,20 @@ // @flow +import _keyBy from 'lodash/fp/keyBy.js'; import * as React from 'react'; import { useSortedENSResolvedUsers } from 'lib/hooks/ens-cache.js'; import { useUserSearchIndex } from 'lib/selectors/nav-selectors.js'; import { threadInfoSelector } from 'lib/selectors/thread-selectors.js'; import { userInfoSelectorForPotentialMembers } from 'lib/selectors/user-selectors.js'; -import { useAncestorThreads } from 'lib/shared/ancestor-threads.js'; import { useSearchUsers, usePotentialMemberItems, } from 'lib/shared/search-utils.js'; import { threadActualMembers } from 'lib/shared/thread-utils.js'; -import type { RelativeMemberInfo } from 'lib/types/minimally-encoded-thread-permissions-types.js'; +import type { ThreadInfo } from 'lib/types/minimally-encoded-thread-permissions-types.js'; import type { UserRelationshipStatus } from 'lib/types/relationship-types.js'; +import type { ThreadType } from 'lib/types/thread-types-enum.js'; import type { GlobalAccountUserInfo, AccountUserInfo, @@ -185,72 +186,52 @@ } type UseSubchannelAddMembersListUserInfosParams = { - +parentThreadID: string, + +parentThreadInfo: ThreadInfo, +searchText: string, + +threadType: ThreadType, }; function useSubchannelAddMembersListUserInfos( params: UseSubchannelAddMembersListUserInfosParams, ): { +userInfos: { - [string]: RelativeMemberInfo, + +[string]: UserListItem, }, - +sortedUsersWithENSNames: $ReadOnlyArray, + +sortedUsersWithENSNames: $ReadOnlyArray, } { - const { parentThreadID, searchText } = params; - - const { previouslySelectedUsers } = useAddUsersListContext(); - - const parentThreadInfo = useSelector( - state => threadInfoSelector(state)[parentThreadID], - ); - - const currentUserID = useSelector(state => state.currentUserInfo?.id); - - const ancestorThreads = useAncestorThreads(parentThreadInfo); - - const communityThreadInfo = ancestorThreads[0] ?? parentThreadInfo; - - const userInfos = React.useMemo(() => { - const infos: { [string]: RelativeMemberInfo } = {}; - - for (const member of communityThreadInfo.members) { - infos[member.id] = member; - } - - return infos; - }, [communityThreadInfo.members]); - - const userSearchIndex = useUserSearchIndex(communityThreadInfo.members); + const { searchText, parentThreadInfo, threadType } = params; - const searchResult = React.useMemo( - () => new Set(userSearchIndex.getSearchResults(searchText)), - [userSearchIndex, searchText], + const otherUserInfos = useSelector(userInfoSelectorForPotentialMembers); + const { community } = parentThreadInfo; + const communityThreadInfo = useSelector(state => + community ? threadInfoSelector(state)[community] : null, ); - const filterOutOtherMembersWithENSNames = React.useCallback( - (members: $ReadOnlyArray) => - members.filter( - user => - !previouslySelectedUsers.has(user.id) && - user.id !== currentUserID && - (searchResult.has(user.id) || searchText.length === 0), - ), - [currentUserID, previouslySelectedUsers, searchResult, searchText.length], + const { previouslySelectedUsers } = useAddUsersListContext(); + const previouslySelectedUserIDs = React.useMemo( + () => [...previouslySelectedUsers].map(([key]) => key), + [previouslySelectedUsers], ); - const otherMemberListWithoutENSNames = React.useMemo( - () => filterOutOtherMembersWithENSNames(communityThreadInfo.members), - [communityThreadInfo.members, filterOutOtherMembersWithENSNames], - ); + const userSearchResults = usePotentialMemberItems({ + text: searchText, + userInfos: otherUserInfos, + excludeUserIDs: previouslySelectedUserIDs, + inputParentThreadInfo: parentThreadInfo, + inputCommunityThreadInfo: communityThreadInfo, + threadType, + }); + const userSearchResultWithENSNames = + useSortedENSResolvedUsers(userSearchResults); - const sortedUsersWithENSNames = useSortedENSResolvedUsers( - otherMemberListWithoutENSNames, + const userResults: { [id: string]: UserListItem } = React.useMemo( + () => _keyBy('id')(userSearchResults), + [userSearchResults], ); return { - userInfos, - sortedUsersWithENSNames, + userInfos: userResults, + sortedUsersWithENSNames: userSearchResultWithENSNames, }; }