diff --git a/web/chat/chat-message-list-container.react.js b/web/chat/chat-message-list-container.react.js --- a/web/chat/chat-message-list-container.react.js +++ b/web/chat/chat-message-list-container.react.js @@ -21,6 +21,7 @@ import { InputStateContext } from '../input/input-state'; import { useSelector } from '../redux/redux-utils'; +import { newThreadID } from '../selectors/nav-selectors'; import { updateNavInfoActionType } from '../types/nav-types'; import ChatInputBar from './chat-input-bar.react'; import css from './chat-message-list-container.css'; @@ -53,7 +54,6 @@ }), ); - const newThreadID = 'pending/new_thread'; const pendingNewThread = React.useMemo( () => ({ ...createPendingThread({ diff --git a/web/chat/chat-thread-composer.react.js b/web/chat/chat-thread-composer.react.js --- a/web/chat/chat-thread-composer.react.js +++ b/web/chat/chat-thread-composer.react.js @@ -5,6 +5,7 @@ import { userSearchIndexForPotentialMembers } from 'lib/selectors/user-selectors'; import { getPotentialMemberItems } from 'lib/shared/search-utils'; +import { threadIsPending } from 'lib/shared/thread-utils'; import type { AccountUserInfo, UserListItem } from 'lib/types/user-types'; import Label from '../components/label.react'; @@ -22,6 +23,8 @@ +inputState: InputState, }; +type ActiveThreadBehaviour = 'renew-active-thread' | 'keep-active-thread'; + function ChatThreadComposer(props: Props): React.Node { const { userInfoInputArray, otherUserInfos, threadID, inputState } = props; @@ -105,15 +108,26 @@ usernameInputText, ]); - const hideSearch = React.useCallback(() => { - dispatch({ - type: updateNavInfoActionType, - payload: { - chatMode: 'view', - activeChatThreadID: threadID, - }, - }); - }, [dispatch, threadID]); + const hideSearch = React.useCallback( + (threadBehaviour: ActiveThreadBehaviour = 'keep-active-thread') => { + dispatch({ + type: updateNavInfoActionType, + payload: { + chatMode: 'view', + activeChatThreadID: + threadBehaviour === 'keep-active-thread' || + !threadIsPending(threadID) + ? threadID + : '', + }, + }); + }, + [dispatch, threadID], + ); + + const onCloseSearch = React.useCallback(() => { + hideSearch('renew-active-thread'); + }, [hideSearch]); const tagsList = React.useMemo(() => { if (!userInfoInputArray?.length) { @@ -155,7 +169,7 @@ placeholder="Select users for chat" /> -
+
diff --git a/web/selectors/nav-selectors.js b/web/selectors/nav-selectors.js --- a/web/selectors/nav-selectors.js +++ b/web/selectors/nav-selectors.js @@ -128,6 +128,8 @@ }, ); +const newThreadID = 'pending/new_thread'; + function useOnClickThread( thread: ?ThreadInfo, ): (event: SyntheticEvent) => void { @@ -140,7 +142,15 @@ ); event.preventDefault(); const { id: threadID } = thread; - if (threadID.includes('pending')) { + if (threadID === newThreadID) { + dispatch({ + type: updateNavInfoActionType, + payload: { + chatMode: 'view', + activeChatThreadID: '', + }, + }); + } else if (threadID.includes('pending')) { dispatch({ type: updateNavInfoActionType, payload: { @@ -236,6 +246,7 @@ useThreadIsActive, useOnClickPendingSidebar, useOnClickNewThread, + newThreadID, navTabSelector, navSettingsSectionSelector, };