From 8720d052421d17f2327b233e84222111b1c95c02 Mon Sep 17 00:00:00 2001 From: DS Boyce <260543580+ds-boyce@users.noreply.github.com> Date: Tue, 9 Jun 2026 23:47:13 -0700 Subject: [PATCH] Clear search term after adding chat member (#10831) --- src/components/dms/AddMembersFlow.tsx | 29 ++++++++++++---- src/components/dms/InitiateChatFlow.tsx | 44 +++++++++++++++++-------- 2 files changed, 53 insertions(+), 20 deletions(-) diff --git a/src/components/dms/AddMembersFlow.tsx b/src/components/dms/AddMembersFlow.tsx index 0c0b171e02..e7e831f9a9 100644 --- a/src/components/dms/AddMembersFlow.tsx +++ b/src/components/dms/AddMembersFlow.tsx @@ -67,6 +67,7 @@ type Item = LabelItem | ProfileItem | EmptyItem | PlaceholderItem | LoadingItem export type State = { groupChatDids: string[] groupChatProfiles: bsky.profile.AnyProfileView[] + searchText: string } export type Action = @@ -80,6 +81,10 @@ export type Action = groupChatDids: string[] groupChatProfiles: bsky.profile.AnyProfileView[] } + | { + type: 'setSearchText' + searchText: string + } function reducer(state: State, action: Action): State { switch (action.type) { @@ -88,6 +93,7 @@ function reducer(state: State, action: Action): State { ...state, groupChatDids: action.groupChatDids, groupChatProfiles: action.groupChatProfiles, + searchText: '', } } case 'removeDids': { @@ -97,6 +103,12 @@ function reducer(state: State, action: Action): State { groupChatProfiles: action.groupChatProfiles, } } + case 'setSearchText': { + return { + ...state, + searchText: action.searchText, + } + } } } @@ -121,11 +133,19 @@ export function AddMembersFlow({ const [headerHeight, setHeaderHeight] = useState(0) const [footerHeight, setFooterHeight] = useState(0) - const [searchText, setSearchText] = useState('') const listRef = useRef(null) const inputRef = useRef(null) + const [{groupChatDids, groupChatProfiles, searchText}, dispatch] = useReducer( + reducer, + { + groupChatDids: [], + groupChatProfiles: [], + searchText: '', + }, + ) + const { data: autocompleteResults, isError, @@ -151,11 +171,6 @@ export function AddMembersFlow({ ? Math.max(0, groupMemberLimit - memberListData.length) : undefined - const [{groupChatDids, groupChatProfiles}, dispatch] = useReducer(reducer, { - groupChatDids: [], - groupChatProfiles: [], - }) - const onRemoveDid = useCallback( (did: string) => { LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut) @@ -405,7 +420,7 @@ export function AddMembersFlow({ inputRef={inputRef} value={searchText} onChangeText={text => { - setSearchText(text) + dispatch({type: 'setSearchText', searchText: text}) listRef.current?.scrollToOffset({offset: 0, animated: false}) }} onEscape={control.close} diff --git a/src/components/dms/InitiateChatFlow.tsx b/src/components/dms/InitiateChatFlow.tsx index 5eb2ec3705..0c3adc450b 100644 --- a/src/components/dms/InitiateChatFlow.tsx +++ b/src/components/dms/InitiateChatFlow.tsx @@ -99,6 +99,7 @@ export type State = { groupChatDids: string[] groupChatProfiles: bsky.profile.AnyProfileView[] groupName: string + searchText: string } export type Action = @@ -132,6 +133,10 @@ export type Action = type: 'goBackFromGroupName' screenTitle: string } + | { + type: 'setSearchText' + searchText: string + } function reducer(state: State, action: Action): State { switch (action.type) { @@ -150,6 +155,7 @@ function reducer(state: State, action: Action): State { ...state, groupChatDids: action.groupChatDids, groupChatProfiles: action.groupChatProfiles, + searchText: '', } } case 'removeDids': { @@ -164,6 +170,7 @@ function reducer(state: State, action: Action): State { ...state, chatState: ChatState.GROUP_NAME, screenTitle: action.screenTitle, + searchText: '', } } case 'nameGroup': { @@ -180,6 +187,7 @@ function reducer(state: State, action: Action): State { groupChatDids: [], groupChatProfiles: [], groupName: '', + searchText: '', } } case 'goBackFromGroupName': { @@ -190,6 +198,12 @@ function reducer(state: State, action: Action): State { groupName: '', } } + case 'setSearchText': { + return { + ...state, + searchText: action.searchText, + } + } } } @@ -218,17 +232,15 @@ export function InitiateChatFlow({ const canCreateGroups = chatStatus?.canCreateGroups ?? true const groupMemberLimit = chatStatus?.groupMemberLimit - const [searchText, setSearchText] = useState('') - - const { - data: results, - isError, - isFetching, - } = useActorAutocompleteQuery(searchText, true, 12) - const {data: follows} = useProfileFollowsQuery(currentAccount?.did) - const [ - {chatState, screenTitle, groupChatDids, groupChatProfiles, groupName}, + { + chatState, + screenTitle, + groupChatDids, + groupChatProfiles, + groupName, + searchText, + }, dispatch, ] = useReducer(reducer, { chatState: ChatState.NEW_CHAT, @@ -236,8 +248,16 @@ export function InitiateChatFlow({ groupChatDids: [], groupChatProfiles: [], groupName: '', + searchText: '', }) + const { + data: results, + isError, + isFetching, + } = useActorAutocompleteQuery(searchText, true, 12) + const {data: follows} = useProfileFollowsQuery(currentAccount?.did) + const newGroupChatTitle = l`New group chat` const groupNameTitle = l`Group name` @@ -362,7 +382,6 @@ export function InitiateChatFlow({ case ChatState.NEW_GROUP_CHAT: LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut) dispatch({type: 'goBackFromNewGroupChat', screenTitle: title}) - setSearchText('') break case ChatState.GROUP_NAME: LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut) @@ -383,7 +402,6 @@ export function InitiateChatFlow({ const handlePressNext = useCallback(() => { LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut) dispatch({type: 'startNameGroup', screenTitle: groupNameTitle}) - setSearchText('') }, [groupNameTitle]) const handlePressConfirm = useCallback(() => { @@ -617,7 +635,7 @@ export function InitiateChatFlow({ inputRef={inputRef} value={searchText} onChangeText={text => { - setSearchText(text) + dispatch({type: 'setSearchText', searchText: text}) listRef.current?.scrollToOffset({offset: 0, animated: false}) }} onEscape={control.close}