@planningcenter/chat-react-native 4.3.0 → 4.3.1-qa-989.0

package/src/screens/conversations/conversations_screen.tsx

@@ -3,8 +3,8 @@ import React from 'react'
 import { StyleSheet, View } from 'react-native'
 import { Conversations } from '../../components'
 import { ConversationsContextProvider } from '../../contexts/conversations_context'
-import { availableFeatures, useFeatures } from '../../hooks/use_features'
 import { analyticsEvents, usePublishProductAnalyticsEvent } from '../../hooks/use_product_analytics'
+import { useSearchEnabled } from '../../hooks/use_search_enabled'
 import { AppName } from '../../types/resources/app_name'
 import { GraphId } from '../../types/resources/group_resource'
 import { ListHeaderComponent } from './components/list_header_component'
@@ -19,8 +19,7 @@ export type ConversationsScreenProps = StaticScreenProps<{
 
 export function ConversationsScreen({ route }: ConversationsScreenProps) {
   const styles = useStyles()
-  const { featureEnabled } = useFeatures()
-  const searchEnabled = featureEnabled(availableFeatures.search)
+  const searchEnabled = useSearchEnabled()
   const Header = searchEnabled ? SearchListHeaderComponent : ListHeaderComponent
 
   usePublishProductAnalyticsEvent(analyticsEvents.conversation_index_opened)

package/src/screens/get_help_screen.tsx

@@ -1,12 +1,12 @@
 import { StaticScreenProps, useNavigation } from '@react-navigation/native'
 import { useCallback, useMemo } from 'react'
-import { Alert, Linking, StyleSheet, View } from 'react-native'
+import { Alert, StyleSheet, View } from 'react-native'
 import { Heading, PressableRow, Text, TextInlineButton } from '../components'
 import { useApiGet, useTheme } from '../hooks'
 import { useAppName } from '../hooks/use_app_name'
 import { useOrganization } from '../hooks/use_organization'
 import { ResourceObject } from '../types'
-import { Clipboard } from '../utils'
+import { Clipboard, Linking } from '../utils'
 
 type GetHelpScreenRouteProps = {
   type?: 'chat' | 'general'

package/src/screens/message_actions_screen.tsx

@@ -124,8 +124,12 @@ function MessageActionsScreenContent({
     })
   }, [navigation, conversation_id, message.id, message.replyRootId, replyRootAuthorName])
 
-  const handleCopyPress = () => {
-    Clipboard.setStringAsync(message?.text || attachmentForCopy() || '')
+  const handleCopyPress = async () => {
+    const textToCopy = message?.text || attachmentForCopy()
+    if (textToCopy) {
+      await Clipboard.setStringAsync(textToCopy)
+      Haptic.notificationSuccess()
+    }
     navigation.goBack()
   }
 

package/src/screens/search/__tests__/search_screen.test.tsx

@@ -1,12 +1,28 @@
 import { act, fireEvent, render } from '@testing-library/react-native'
 import React from 'react'
+import { Keyboard } from 'react-native'
 import type { useSearchResults } from '../../../hooks/use_search_results'
+import type {
+  ConversationSearchResultResource,
+  MessageSearchResultResource,
+} from '../../../types/resources/search_result'
 import { SearchScreen } from '../search_screen'
 
+const mockNavigate = jest.fn()
+jest.mock('@react-navigation/native', () => ({
+  ...jest.requireActual('@react-navigation/native'),
+  useNavigation: () => ({ navigate: mockNavigate }),
+}))
+
 const mockUseSearchResults = jest.fn<ReturnType<typeof useSearchResults>, [string]>()
 jest.mock('../../../hooks/use_search_results', () => ({
   useSearchResults: (term: string) => mockUseSearchResults(term),
 }))
+const mockPublishEvent = jest.fn()
+jest.mock('../../../hooks/use_product_analytics', () => ({
+  ...jest.requireActual('../../../hooks/use_product_analytics'),
+  useProductAnalytics: () => ({ publishEvent: mockPublishEvent }),
+}))
 jest.mock('../../../components/display/keyboard_view', () => ({
   ...jest.requireActual('../../../components/display/keyboard_view'),
   KeyboardView: ({ children }: { children: React.ReactNode }) => children,
@@ -14,8 +30,59 @@ jest.mock('../../../components/display/keyboard_view', () => ({
 
 const inputLabel = 'Search titles and messages'
 
+const conversationResult: ConversationSearchResultResource = {
+  type: 'conversation',
+  id: '42',
+  title: 'Budget Team',
+  url: '/conversations/42',
+  extra: { avatar: { previewAvatarUrls: [] } },
+}
+
+const messageResult: MessageSearchResultResource = {
+  type: 'message',
+  id: '01JMESSAGEULID',
+  title: 'Finance',
+  url: '/conversations/7/messages/01JMESSAGEULID',
+  extra: {
+    conversationId: 7,
+    authorName: 'Ann',
+    snippet: [{ text: 'budget', match: true }],
+    createdAt: '2026-01-01T00:00:00Z',
+    avatar: { previewAvatarUrls: [] },
+  },
+}
+
+const secondMessageResult: MessageSearchResultResource = {
+  ...messageResult,
+  id: '01JSECONDULID',
+  title: 'Youth',
+  url: '/conversations/9/messages/01JSECONDULID',
+  extra: { ...messageResult.extra, conversationId: 9, authorName: 'Bob' },
+}
+
+const renderWithResults = () => {
+  mockUseSearchResults.mockReturnValue({
+    results: [conversationResult, messageResult, secondMessageResult],
+    failedTypes: [],
+    isPending: false,
+    isError: false,
+    isFetchNextPageError: false,
+    loadMore: jest.fn(),
+    hasNextPage: false,
+    isFetchingNextPage: false,
+  })
+  const view = render(<SearchScreen />)
+  const input = view.getByLabelText(inputLabel)
+  fireEvent.changeText(input, 'bud')
+  fireEvent.changeText(input, 'budget')
+  act(() => jest.advanceTimersByTime(200))
+  return view
+}
+
 beforeEach(() => {
   jest.useFakeTimers()
+  mockNavigate.mockReset()
+  mockPublishEvent.mockReset()
   mockUseSearchResults.mockReset().mockReturnValue({
     results: [],
     failedTypes: [],
@@ -61,4 +128,67 @@ describe('SearchScreen', () => {
 
     expect(view.getByText('Search chat')).toBeTruthy()
   })
+
+  it('opens a conversation result at the latest message', () => {
+    const dismiss = jest.spyOn(Keyboard, 'dismiss')
+    const view = renderWithResults()
+
+    fireEvent.press(view.getByLabelText('Budget Team'))
+
+    expect(dismiss).toHaveBeenCalled()
+    expect(mockNavigate).toHaveBeenCalledWith('Conversation', {
+      conversation_id: 42,
+      title: 'Budget Team',
+    })
+  })
+
+  it('opens a message result anchored at that message', () => {
+    const view = renderWithResults()
+
+    fireEvent.press(view.getByLabelText(/^Finance, Ann: budget/))
+
+    expect(mockNavigate).toHaveBeenCalledWith('Conversation', {
+      conversation_id: 7,
+      initial_message_id: '01JMESSAGEULID',
+      title: 'Finance',
+    })
+  })
+
+  it('publishes one search event per settled term with result counts, never the term', () => {
+    renderWithResults()
+
+    expect(mockPublishEvent).toHaveBeenCalledTimes(1)
+    expect(mockPublishEvent).toHaveBeenCalledWith('chat.mobile.search.performed', {
+      term_length: 6,
+      conversation_result_count: 1,
+      message_result_count: 2,
+    })
+    expect(JSON.stringify(mockPublishEvent.mock.calls)).not.toContain('budget')
+  })
+
+  it('does not publish a retyped term whose results are already cached', () => {
+    const view = renderWithResults()
+    const input = view.getByLabelText(inputLabel)
+
+    fireEvent.changeText(input, 'budge')
+    act(() => jest.advanceTimersByTime(200))
+    fireEvent.changeText(input, 'budget')
+    act(() => jest.advanceTimersByTime(200))
+
+    const performed = mockPublishEvent.mock.calls.filter(
+      ([name]) => name === 'chat.mobile.search.performed'
+    )
+    expect(performed.map(([, meta]) => meta.term_length)).toEqual([6, 5])
+  })
+
+  it('publishes the opened result type and its position within its section', () => {
+    const view = renderWithResults()
+
+    fireEvent.press(view.getByLabelText(/^Youth, Bob: budget/))
+
+    expect(mockPublishEvent).toHaveBeenCalledWith('chat.mobile.search.result.opened', {
+      result_type: 'message',
+      position: 1,
+    })
+  })
 })

package/src/screens/search/components/__tests__/conversation_results.test.tsx

@@ -43,13 +43,13 @@ describe('ConversationResults', () => {
     expect(view.getByText('View less')).toBeTruthy()
   })
 
-  it('passes the pressed result to onSelect', () => {
+  it('passes the pressed result and its position to onSelect', () => {
     const onSelect = jest.fn()
     const results = buildResults(2)
     const view = render(<ConversationResults results={results} onSelect={onSelect} />)
 
     fireEvent.press(view.getByText('Conversation 2'))
 
-    expect(onSelect).toHaveBeenCalledWith(results[1])
+    expect(onSelect).toHaveBeenCalledWith(results[1], 1)
   })
 })

package/src/screens/search/components/__tests__/search_results_list.test.tsx

@@ -49,9 +49,15 @@ const messageResult = (id: string): MessageSearchResultResource => ({
   },
 })
 
-const renderList = (state: Partial<SearchState>) => {
+const renderList = (state: Partial<SearchState>, onSettled = jest.fn()) => {
   mockUseSearchResults.mockReturnValue(searchState(state))
-  return render(<SearchResultsList term="potluck" onSelect={jest.fn()} />)
+  const list = () => <SearchResultsList term="potluck" onSelect={jest.fn()} onSettled={onSettled} />
+  const view = render(list())
+  const rerenderWith = (next: Partial<SearchState>) => {
+    mockUseSearchResults.mockReturnValue(searchState(next))
+    view.rerender(list())
+  }
+  return { ...view, rerenderWith }
 }
 
 describe('SearchResultsList', () => {
@@ -119,6 +125,45 @@ describe('SearchResultsList', () => {
     expect(loadMore).not.toHaveBeenCalled()
   })
 
+  it('passes a message result and its position within the section to onSelect', () => {
+    const onSelect = jest.fn()
+    const results = [conversationResult('1'), messageResult('1'), messageResult('2')]
+    mockUseSearchResults.mockReturnValue(searchState({ results }))
+    const view = render(
+      <SearchResultsList term="potluck" onSelect={onSelect} onSettled={jest.fn()} />
+    )
+
+    fireEvent.press(view.getByLabelText(/^Message 2/))
+
+    expect(onSelect).toHaveBeenCalledWith(results[2], 1)
+  })
+
+  it('reports the settled term and counts once, not while pending or after paging', () => {
+    const onSettled = jest.fn()
+    const view = renderList({ isPending: true }, onSettled)
+    expect(onSettled).not.toHaveBeenCalled()
+
+    const results = [conversationResult('1'), messageResult('1'), messageResult('2')]
+    view.rerenderWith({ results })
+
+    expect(onSettled).toHaveBeenCalledTimes(1)
+    expect(onSettled).toHaveBeenCalledWith('potluck', {
+      conversationResultCount: 1,
+      messageResultCount: 2,
+    })
+
+    view.rerenderWith({ results: [...results, messageResult('3')] })
+
+    expect(onSettled).toHaveBeenCalledTimes(1)
+  })
+
+  it('does not report a failed search', () => {
+    const onSettled = jest.fn()
+    renderList({ isError: true }, onSettled)
+
+    expect(onSettled).not.toHaveBeenCalled()
+  })
+
   it('offers a retry after a paging failure', () => {
     const loadMore = jest.fn()
     const view = renderList({

package/src/screens/search/components/conversation_results.tsx

@@ -8,7 +8,7 @@ const COLLAPSED_COUNT = 5
 
 interface ConversationResultsProps {
   results: ConversationSearchResultResource[]
-  onSelect: (result: ConversationSearchResultResource) => void
+  onSelect: (result: ConversationSearchResultResource, position: number) => void
 }
 
 export function ConversationResults({ results, onSelect }: ConversationResultsProps) {
@@ -31,8 +31,12 @@ export function ConversationResults({ results, onSelect }: ConversationResultsPr
 
   return (
     <ResultsSection title="Conversations" footer={footer}>
-      {visible.map(result => (
-        <ConversationResultRow key={result.id} result={result} onPress={() => onSelect(result)} />
+      {visible.map((result, index) => (
+        <ConversationResultRow
+          key={result.id}
+          result={result}
+          onPress={() => onSelect(result, index)}
+        />
       ))}
     </ResultsSection>
   )

package/src/screens/search/components/search_results_list.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useEffect, useRef } from 'react'
 import { FlatList, StyleSheet, View } from 'react-native'
 import { Banner, Spinner, Text, TextButton } from '../../../components'
 import { useSearchResults } from '../../../hooks/use_search_results'
@@ -14,12 +14,18 @@ import { NoResultsBlankState } from './search_blank_states'
 
 const SEARCH_ERROR_MESSAGE = "Couldn't search right now. Try again."
 
+export interface SearchResultCounts {
+  conversationResultCount: number
+  messageResultCount: number
+}
+
 interface SearchResultsListProps {
   term: string
-  onSelect: (result: SearchResultResource) => void
+  onSelect: (result: SearchResultResource, position: number) => void
+  onSettled: (term: string, counts: SearchResultCounts) => void
 }
 
-export function SearchResultsList({ term, onSelect }: SearchResultsListProps) {
+export function SearchResultsList({ term, onSelect, onSettled }: SearchResultsListProps) {
   const {
     results,
     failedTypes,
@@ -32,6 +38,19 @@ export function SearchResultsList({ term, onSelect }: SearchResultsListProps) {
   } = useSearchResults(term)
   const conversationResults = results.filter(isConversationResult)
   const messageResults = results.filter(isMessageResult)
+  const settled = !isPending && !isError
+
+  const settledTermRef = useRef<string | undefined>(undefined)
+
+  useEffect(() => {
+    if (!settled || settledTermRef.current === term) return
+
+    settledTermRef.current = term
+    onSettled(term, {
+      conversationResultCount: conversationResults.length,
+      messageResultCount: messageResults.length,
+    })
+  }, [settled, term, conversationResults.length, messageResults.length, onSettled])
 
   return (
     <FlatList
@@ -40,7 +59,9 @@ export function SearchResultsList({ term, onSelect }: SearchResultsListProps) {
       keyboardShouldPersistTaps="handled"
       keyboardDismissMode="on-drag"
       contentContainerStyle={styles.content}
-      renderItem={({ item }) => <MessageResultRow result={item} onPress={onSelect} />}
+      renderItem={({ item, index }) => (
+        <MessageResultRow result={item} onPress={() => onSelect(item, index)} />
+      )}
       ListHeaderComponent={
         <>
           {conversationResults.length > 0 && (

package/src/screens/search/search_screen.tsx

@@ -1,20 +1,21 @@
-import { ParamListBase } from '@react-navigation/native'
+import { ParamListBase, useNavigation } from '@react-navigation/native'
 import {
   NativeStackNavigationOptions,
   NativeStackScreenProps,
 } from '@react-navigation/native-stack'
-import { noop } from 'lodash'
-import React, { useState } from 'react'
-import { StyleSheet, View } from 'react-native'
+import React, { useRef, useState } from 'react'
+import { Keyboard, StyleSheet, View } from 'react-native'
 import { KeyboardView } from '../../components'
 import {
   composeOptions,
   withMinimalBack,
 } from '../../components/display/platform_modal_header_buttons'
 import { useDebouncedSearchTerm } from '../../hooks/use_debounced_search_term'
+import { analyticsEvents, useProductAnalytics } from '../../hooks/use_product_analytics'
+import type { SearchResultResource } from '../../types/resources/search_result'
 import { SearchPromptBlankState } from './components/search_blank_states'
 import { SearchField } from './components/search_field'
-import { SearchResultsList } from './components/search_results_list'
+import { SearchResultsList, type SearchResultCounts } from './components/search_results_list'
 
 export const SearchScreenOptions = ({
   navigation,
@@ -25,15 +26,52 @@ export const SearchScreenOptions = ({
   )
 
 export function SearchScreen() {
+  const navigation = useNavigation()
   const [term, setTerm] = useState('')
   const debouncedTerm = useDebouncedSearchTerm(term)
+  const { publishEvent } = useProductAnalytics()
+  const publishedTerms = useRef(new Set<string>())
+
+  const publishSearch = (settledTerm: string, counts: SearchResultCounts) => {
+    if (publishedTerms.current.has(settledTerm)) return
+
+    publishedTerms.current.add(settledTerm)
+    publishEvent(analyticsEvents.search_performed, {
+      term_length: settledTerm.length,
+      conversation_result_count: counts.conversationResultCount,
+      message_result_count: counts.messageResultCount,
+    })
+  }
+
+  const openResult = (result: SearchResultResource, position: number) => {
+    Keyboard.dismiss()
+    publishEvent(analyticsEvents.search_result_opened, { result_type: result.type, position })
+
+    if (result.type === 'conversation') {
+      navigation.navigate('Conversation', {
+        conversation_id: Number(result.id),
+        title: result.title,
+      })
+    } else {
+      navigation.navigate('Conversation', {
+        conversation_id: result.extra.conversationId,
+        initial_message_id: result.id,
+        title: result.title,
+      })
+    }
+  }
 
   return (
     <KeyboardView>
       <View style={styles.container} testID="search-screen">
         <SearchField term={term} onChange={setTerm} />
         {debouncedTerm.length > 0 ? (
-          <SearchResultsList key={debouncedTerm} term={debouncedTerm} onSelect={noop} />
+          <SearchResultsList
+            key={debouncedTerm}
+            term={debouncedTerm}
+            onSelect={openResult}
+            onSettled={publishSearch}
+          />
         ) : (
           <SearchPromptBlankState />
         )}

package/src/utils/__tests__/response_error.test.ts

@@ -53,8 +53,13 @@ describe('throwResponseError', () => {
     expect(() => throwResponseError(fetchResponseLike(401))).toThrow(ResponseError)
   })
 
-  it('passes through non-response errors untouched', async () => {
+  it('rethrows non-response errors synchronously instead of returning a rejected promise', () => {
     const error = new Error('network down')
-    await expect(throwResponseError(error)).rejects.toBe(error)
+    expect(() => throwResponseError(error)).toThrow(error)
+  })
+
+  it('rethrows an existing ResponseError without re-wrapping it', () => {
+    const error = new ResponseError(fetchResponseLike(401) as never)
+    expect(() => throwResponseError(error)).toThrow(error)
   })
 })

package/src/utils/native_adapters/__tests__/linking.test.ts

@@ -0,0 +1,12 @@
+import { LinkingAdapter } from '../linking'
+
+describe('LinkingAdapter', () => {
+  it('forwards open options to the host', async () => {
+    const openURL = jest.fn(async () => {})
+    const adapter = new LinkingAdapter({ openURL, canOpenURL: async () => true })
+
+    await adapter.openURL('https://example.com', { forceOpenInBrowser: true })
+
+    expect(openURL).toHaveBeenCalledWith('https://example.com', { forceOpenInBrowser: true })
+  })
+})

package/src/utils/native_adapters/linking.ts

@@ -1,10 +1,19 @@
 import { Linking } from 'react-native'
 
-export class LinkingAdapter {
-  openURL: Linking['openURL']
+export type LinkingOpenURLOptions = {
+  forceOpenInBrowser?: boolean
+}
+
+type LinkingMethods = {
+  openURL: (url: string, options?: LinkingOpenURLOptions) => Promise<unknown>
   canOpenURL: Linking['canOpenURL']
+}
+
+export class LinkingAdapter {
+  openURL: LinkingMethods['openURL']
+  canOpenURL: LinkingMethods['canOpenURL']
 
-  constructor(methods: Pick<Linking, 'openURL' | 'canOpenURL'>) {
+  constructor(methods: LinkingMethods) {
     this.openURL = methods.openURL.bind(Linking)
     this.canOpenURL = methods.canOpenURL.bind(Linking)
   }

package/src/utils/response_error.ts

@@ -39,10 +39,10 @@ export const isResponseLike = (value: unknown): value is Response => {
   )
 }
 
-export const throwResponseError = (error: unknown) => {
+export const throwResponseError = (error: unknown): never => {
   if (isResponseLike(error)) {
     throw new ResponseError(error as FailedResponse)
   }
 
-  return Promise.reject(error)
+  throw error
 }