Highlights

Chat UI components ✨ preview  ✨

TalkJS chat UI components (‘Components v2’) are now in preview and safe to use in production. 

Chat UI components give you ultimate flexibility to control the appearance and behavior of your chat. You can use the components with a ready-to-go pre-built theme, or customize your theme to get the exact look and feel you want.

Currently components are available for a chatbox UI with a range of basic features, which is continuously expanding. 

To work with chat UI components, you’ll need to combine the following two packages:

• @talkjs/components — a library that provides both React components and web components that you can use with any frontend framework, such as Angular, Vue, or Svelte.
• @talkjs/theme-default — a package with the default theme for @talkjs/components which lets you display a chat with any frontend framework. The default theme is fully open source, and you can fork and customize it to fit your own brand. See the default theme Github repository.

Use one of the dedicated getting started guides for chat UI components:

• JavaScript getting started guide →
• React getting started guide →
• Next.js getting started guide →
• Angular getting started guide →
• Vue getting started guide →
• Svelte getting started guide →

Real-time messaging data

You can now read, update, and subscribe to all your chat messaging data—no chat UI needed. This means that you can bring your own fully custom-built chat UI, and let TalkJS take care of the rest.

To work with real-time chat data, you have the following two options:

• Realtime API, part of the JavaScript SDK
• @talkjs/core, a standalone package now available on NPM

Want to get started directly? Here are some guides: 

• 1:1 chat getting started guide →
• Group chat getting started guide →

In a hurry? Copy a full working code example.

Overview of other changes

Added

• JavaScript SDK (0.35.0): Added ConversationRef.subscribe to be able to subscribe to a conversation with the Realtime API. 
• React Native SDK (0.13.0): The keyboardVerticalOffset prop is now also used in Android. This is part of the fix to ensure proper keyboard behaviour on apps targeting Android 15 and above. The default value on Android is 55 + StatusBar.currentHeight.

Changed

• React Native SDK (0.13.0): Updated dependencies.

Deprecated

• JavaScript SDK (0.35.0): Removed ConversationSnapshot.lastMessageAt. Use ConversationSnapshot.lastMessage.createdAt instead.

Fixed

• React Native SDK (0.13.0): Fixed keyboard issues on Android 15 that arose due to Android's enforcement of edge-to-edge.
• React Native SDK (0.13.0): Fixed internal event subscriptions not being cleaned up properly on re-renders.

Resources

Case study: FrostyWave is empowering young women with TalkJS messaging

Find out how FrostyWave is empowering young women to grow into their best selves with the TalkJS chat API.

Read FrostyWave's story.

Trying out TalkJS demos? Make it collaborative!

You can now use a one-click invite to try out TalkJS demos with colleagues in a shared conversation. Check out the latest demos:

• Job board →
• Virtual events →
• Team collaboration →
• Marketplace →

👋 Thoughts? Questions? Get in touch.

✨ Follow TalkJS on LinkedIn, Bluesky or 𝕏 to stay up to date.

👩🏾‍💻 Come join TalkJS! Check out the jobs page.

Added

• JavaScript SDK 0.33.0: Added AudioBlock to support audio attachments on the Realtime API.
• JavaScript SDK 0.33.0: Added VideoBlock to support video attachments on the Realtime API.
• JavaScript SDK 0.32.0: Added ImageBlock to support image attachments on the Realtime API.
• JavaScript SDK 0.32.0: Added VoiceBlock to support voice message attachments on the Realtime API.

Changed

• Improved the options to filter data in your theme, by mapping and filtering lists. 

Deprecated

• Removed the option to set a filename for a file attachment using FileBlock on the Realtime API.

Fixed

• Fixed an issue where video playback in the upload preview on iOS on Safari wasn’t working properly. 
• Fixed an issue where video thumbnails in message bodies were not showing up properly on Safari and Chromium WebView.
• Fixed an issue where, on the Realtime API, message replies didn’t show the referenced message that was being replied to correctly. 

👋 Thoughts? Questions? Get in touch.

✨Follow TalkJS on 𝕏 and LinkedIn to stay up to date.

👩🏾‍💻We’re hiring! Check out our jobs page.

Highlights

Multiple webhooks

You can now add multiple webhooks to your app. Webhooks can be useful as part of a chatbot interface, to inspect messages as they happen, or to trigger custom domain-specific actions.

To add a new webhook, go to the Settings page of your TalkJS dashboard, and select Add new webhook. Add your webhook URL, select the events that you’d like to subscribe to, and save your settings. 

You can add up to three webhooks if you’re on the Growth plan or higher.

Read more about webhooks.

Accessibility improvements

Chat just got more accessible:

• Keyboard navigation: The scrollable area in the chatbox is now keyboard accessible. The area can get focus, so you can use your keyboard’s up and down arrow keys to scroll the container.
• Screen reader: If you’ve got a conversation in focus and someone sends a new message into that conversation, a screen reader will read out the new message.

Do you have more accessibility wishes for your chat? We’d love to hear from you! Get in touch.

Messages on the Realtime API

Messages are available on the Realtime API. That means that you can now access a continuous, up-to-date flow of data related to messages, without needing to send repeated requests or open a chat UI. 

Version 0.31.0 of the JavaScript SDK adds the following:

• ConversationRef.message: Reference to a message in a given conversation.
• ConversationRef.subscribeMessages: Subscribe to the messages in a given conversation.
• MessageSubscription: Subscription to the messages in a given conversation. 
• MessageRef: Reference to a message.
• MessageSnapshot.content: The main body of a given message. The body is a list of content blocks with entity trees, which means that you can render the message exactly as it would appear in the frontend.
• ReferencedMessageSnapshot: Snapshot of a message's attributes at a given moment in time. 
• MessageSnapshot.referencedMessage: Snapshot of the message that the given message is a reply to, or null if this message is not a reply. 
• EditMessageParams, SendMessageParams, and MessageActiveState.

Overview of other changes

Added

• JavaScript SDK (0.31.0): Added ConversationRef.send.
• JavaScript SDK (0.30.0): Added ConversationSnapshot.lastMessage.
• JavaScript SDK (0.29.0): Added ConversationRef.markAsRead and ConversationRef.markAsUnread
• JavaScript SDK (0.28.0): Added ParticipantRef to the Realtime API.
• JavaScript SDK (0.28.0): Added ConversationRef.participant to get a participant for a given conversation to the Realtime API.
• JavaScript SDK (0.28.0): Added ConversationSnapshot.joinedAt to the Realtime API.
• JavaScript SDK (0.27.0): Added ConversationRef.set and ConversationRef.createIfNotExists to the Realtime API.
• Added the option to mark conversations as read or unread to the Realtime API.
• Flutter SDK (0.14.0): Added the onUnreadsChange property to Session.

Changed

• React SDK (0.1.10): Allow null as a value for the conversationId prop.
• Changed the options for @mentioning a user. Only users who are a current participant in a conversation can be mentioned in that conversation. You can no longer mention guest users. 

Deprecated

• Flutter SDK (0.14.0): Deprecated the unreads property of Session.

Fixed

• Fixed a bug in Realtime API batching, where in some cases calls would be executed out-of-order.
• Fixed an issue where the main chat would scroll down when you scrolled in a message search.
• Fixed a bug where a participant who had been removed from a conversation could still be @mentioned in that conversation.

New guides and tutorials 

👋 Thoughts? Questions? Get in touch.

✨Follow TalkJS on 𝕏 and LinkedIn to stay up to date.

👩🏾‍💻We’re hiring! Check out our jobs page.

Highlights

Filter by creation time

Need to get all of a user’s messages sent last week? You can now filter both conversations and messages by their creation date.

Using the createdAt predicate, you can select exactly those messages or conversations that were created within a particular time interval.

Read more on filtering by creation time for messages, and for conversations.

Edit app metadata from your dashboard

You can now edit metadata for your application directly from your dashboard. 

With the app metadata editor, you can easily store and edit custom metadata for your app, for example the app’s name, or a custom website URL. Once stored, you can make these app metadata variables available in other places throughout your app, such as in roles, themes, or in your email notification templates.

Edit your app’s metadata directly from your dashboard

You can find the metadata editor under the Settings tab of your TalkJS dashboard, and access your custom app metadata in roles, themes, and notification settings with {{app.custom.}}. 

Multi-line inputs are supported.

Read more on using app custom fields.

Flutter SDK v0.9.1

The Flutter SDK just got better. With the release of version 0.9.1, you can use the Flutter SDK to pass data to themes, and to automatically sync the keyboard color of the chat interface based on your app's theme. 

The Flutter SDK now also has support for custom conversation actions, and ensures that various properties and methods are available for a Session object, including methods for setting, unsetting, and clearing push registrations, and for tracking the number of unread conversations in a session.

Get started with the Flutter SDK.

Overview of other changes

Added

• Added participant access right information (that is, whether a participant has read-only or read-and-write access) in a conversation to that conversation’s ConversationData in the JavaScript SDK.
• Added the option to define custom message actions that are available only for messages from other conversation participants.

Changed

• Simplified adding emoji reactions to themes. You can now pass the Reaction object as a whole to the EmojiReactionButton subcomponent in themes.

Deprecated

• Deprecated InboxOptions.selected. Instead, use Inbox.select from the JavaScript SDK.

Fixed

• Fixed an issue where the REST API batch user update did not handle invalid input data correctly.
• Fixed an issue where having multiple tabs open for a conversation would send multiple browser notifications.
• Fixed a bug where, when using the Flutter SDK, messages would only get marked as 'read' after clicking the message field, rather than when loading the chatbox.
• Fixed a bug where a custom sub-component with the same name as a top-level component would get treated as a top-level component, and hence would not be deletable.
• Fixed an issue where a failed authentication was unable to distinguish between failure due to connection issues, and an expired authentication token.

👋 Thoughts? Questions? Get in touch.

✨ Follow TalkJS on 𝕏 and LinkedIn to stay up to date.

👩🏾‍💻 We’re hiring! Check out our jobs page.

Highlights

Edit participant data directly from your dashboard

You can now edit the data of any participant in a conversation directly from your TalkJS dashboard. 

To edit a participant’s data, go to the Activity section of the dashboard. From the Conversation history section of the activity landing page, select a conversation that contains the participant whose details you would like to edit. A page with conversation details will open. Click on the name of the participant whose details you would like to edit to open their User details page.

User details page with the option to edit a conversation participant’s data

You can edit any participant detail apart from the ID, which acts as a stable, unique identifier of the participant.

Image previews resize to fit aspect ratio

Image or video files now have improved thumbnail previews. Instead of cropping an image to fit, the preview thumbnail will resize to match the aspect ratio of the message attachment you sent. 

Image previews automatically resize to fit the aspect ratio of the file you sent

If you have previously edited the MessageBody component in your theme, you can follow the upgrade guide to add full support for improved attachment thumbnails.

Overview of other changes

Added

• Added bulleted list formatting to messages. You can now type *, + or - at the start of a new line, and your unordered list will automatically be formatted with bullet points in the sent message.
• Added an unread message counter to the Default Dark theme.
• Added support for playing MPEG transport stream (MPEG-TS) audio or video files (.ts, .tsv, .tsa, or .m2t). When you upload an MPEG-TS file, a preview with player options will automatically appear.

Changed

• Made various improvements to exporting a conversation transcript: the transcript export progress is calculated more accurately; download links have improved; the sender ID will be added to the transcript export; a date string will be used in the exported file name.

Fixed

• Fixed a bug where users who had been removed from a conversation were still able to reply to that conversation via email.
• Fixed a bug in the JS SDK where a rapid sequence of creating and destroying a chatbox would crash the chat.
• Fixed an error where, on the Activity view of the dashboard, it was not possible to delete a conversation.
• Fixed a bug where, on the Activity view of the dashboard, the participants dropdown would disappear after opening.
• Fixed an issue where the chat would crash when changing between chats while replying to a message.
• Fixed an issue where @mentions would break when they contained markup.
• Fixed an issue in the accuracy of the unread message counter.
• Fixed an issue where conversation participants with read permissions were not able to mark a conversation as read.  

Deprecated

• Deprecated syncThemeForLocalDev in the JS SDK. Instead of using this method, you can use custom themes, which give you full control over the HTML and CSS of chat messages.