Skip to content

feat: message search within conversation#622

Open
sakebomb wants to merge 1 commit intoa-ghorbani:mainfrom
sakebomb:feat/message-search
Open

feat: message search within conversation#622
sakebomb wants to merge 1 commit intoa-ghorbani:mainfrom
sakebomb:feat/message-search

Conversation

@sakebomb
Copy link

@sakebomb sakebomb commented Mar 5, 2026

Summary

  • Adds in-conversation message search with real-time filtering and text highlighting
  • Search bar appears via toolbar icon with auto-focus, match count indicator, and close button
  • Matching text highlighted using <mark> tags via SearchQueryContext (avoids prop drilling through ChatView → Message → TextMessage → MarkdownView chain)

Implementation details

  • ChatSessionStore: isSearchMode, searchQuery, enterSearchMode(), exitSearchMode(), setSearchQuery(), filteredSessionMessages getter (case-insensitive text filtering)
  • ChatSearchBar: New component with search input, match count/no-results indicator, close button
  • HeaderRight: Search icon toggle button (visible when session is active)
  • ChatScreen: Passes filtered messages and search bar via customContent prop; wraps ChatView in SearchQueryContext.Provider
  • MarkdownView: Consumes SearchQueryContext, wraps matching text in <mark> tags after markdown-to-HTML conversion, registers mark element model with react-native-render-html
  • l10n: chat.searchMessages, chat.noResults strings added to en.json

Test plan

  • 8 new store tests: enter/exit search mode, query setting, filtering, case-insensitive matching, non-text message exclusion
  • 7 new ChatSearchBar component tests: rendering, close button, text change handler, match count display, no results display
  • 2 new MarkdownView tests: rendering with/without SearchQueryContext
  • All 137 existing tests continue to pass
  • TypeScript compiles cleanly
  • ESLint passes (no new warnings)

Closes #603

Add search functionality to find messages within the active chat session:

- Search bar appears via toolbar icon with auto-focus input
- Filters messages in real-time as user types (case-insensitive)
- Highlights matching text in message content using <mark> tags
- Shows match count or "No results" indicator
- Uses SearchQueryContext to pass search state to MarkdownView
  without prop drilling through the component tree
- Registers custom mark HTML element model for react-native-render-html
- Adds search l10n strings (searchMessages, noResults)
- Includes 15 new tests covering store, component, and integration

Closes a-ghorbani#603
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feat]: Message search within a conversation

1 participant