[isekovanic]

Ticket: https://linear.app/stream/issue/RN-485

Stacked on #3929.

🎯 Goal

The composer extras of StreamChatAI's AIComposerView and React's AIMessageComposer (#3376): chat options such as "Think harder", the chip of the one picked, and starter suggestions for an empty conversation.

🛠 Implementation details

Chat options (message-composer/ChatOptions.tsx)

• AIChatOption is React's type: id, title, and optional description, icon, shortTitle and customData.
• ComposerView takes chatOptions and lists them in its sheet under Camera and Photos, as Swift's picker does. Picking one closes the sheet; picking the picked one again removes it.
• The picked option shows as a chip above the input (SelectedChatOptionChip, Swift's look), and is sent with each message as chatOption in onSendMessage. Like Swift and Juno, it stays picked after sending, until the person removes it.
• It lives in the composer's state store as chatOption, so an app that passes its own store can read it. useComposerChatOption reads it inside the composer.
• ChatOptionsList and SelectedChatOptionChip are exported for custom composers.

AISuggestions (suggestions/)

• React's API: suggestions and onSelect. A row of chips scrolling sideways, two lines each at most 160 wide, as Swift's SuggestionsView. Where it goes is up to the app.

Attachment preview

• The remove button has a label and a bigger hit area.
• An attachment that isn't an image shows as a file card rather than an empty Image, as React's preview does. The built-in pickers only pick photos, so this shows only with a custom mediaPickerService.

Also

• chatOptions and suggestions theme sections, with Swift's colours from the shared tokens. Sizes and spacing come from the tokens.
• Two strings in all 13 locales. ar and he could use a native speaker's look.

ExpoChatGPTSample

• The placeholder sheet options (which only showed an alert) are gone. In their place is "Think harder", which asks the router with reasoningEffort: 'high', as Juno does.
• Starters show above the composer on a new conversation, until its first question. A starter asks with the option picked in the composer, which Juno doesn't do.

🎨 UI Changes

The sheet with "Think harder" under Camera and Photos, the "Think" chip above the input, and the starters above the composer on a new conversation.

🧪 Testing

• Unit tests: the option is sent and stays picked, removing it from the chip and by picking it again, a non-image attachment shown as a file and removed, and the suggestions.
• On the iOS simulator and an Android emulator against a local Vision-Agents router: picking the option, the chip, sending typed questions and starters with it picked and removed, and removing it with the keyboard up. A temporary log confirmed the sample sent thinkHarder: true with the chip and false without.
• Not tested: TalkBack/VoiceOver and RTL, and the file card on device (no picker gives one).
• yarn lint, yarn typecheck, yarn build and the unit tests pass.

☑️ Checklist

• I have signed the Stream CLA (required)
• PR targets the develop branch (stacked on feat(ai-components): AIConversation on LegendList #3929)
• Documentation is updated
• New code is tested in main example apps, including all possible scenarios
  • SampleApp iOS and Android
  • Expo iOS and Android

[Stream-SDK-Bot]

SDK Size

title	develop	branch	diff	status
js_bundle_size	2041 KB	2041 KB	+213 B	🟢
ai_components_size	163 KB	260 KB	+99463 B	🔴