A smaller update this month, focused on developer quality-of-life updates and a few important fixes.

Added

• JavaScript SDK (0.42.0): Added the option to cancel sending a message by adding a cancel: boolean property to SendMessageOverrideParams.

Fixed

• JavaScript Data API (1.5.4): Fixed a bug that prevented the websocket from disconnecting when idle after unsubscribing.
• JavaScript Data API (1.5.3): Fixed a bug where subscribing to a conversation's messages after previously subscribing to that conversation, could cause an error related to sequence numbers being out-of-order.
• Increase message field color contrast and update message editor ARIA label for improved accessibility.

👋 Thoughts? Questions? Get in touch.

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

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

Subscribe to a user’s online status

You can now get and subscribe to real-time data on a user’s online status. TalkJS Core (1.4.0) now has  UserRef.subscribeOnline, which subscribes to a user's online status. Real-time user online status data allows you to build anything from custom chat headers to online members’ lists. 

Explore online status data →

Overview of other changes

Added

• TalkJS Core (1.3.0): Added TalkSession.subscribeConversations, which returns a windowed subscription to your most recent active conversations.

Changed

• JavaScript SDK (0.40.1) and TalkJS Core (1.4.2): Changed GenericFileBlock from subtype?: undefined to subtype?: never so that type narrowing works consistently when you check for subtype.
• React Native SDK (0.15.0): A Session component now creates a User if a user doesn’t yet exist. This means that you no longer need to mount a ConversationList or Chatbox in order for the user to be created in the backend, but can do this with only the Session component.
• React Native SDK (0.15.0): Changed that every call to getConversationBuilder() returns a new object, even if the conversation ID already exists.

Fixed

• Fixed an issue where voice messages recorded outside of the chat UI (for example, sent via the REST API) weren’t displaying correctly.
• Fixed a bug in link suppressions. You can now selectively suppress certain links, instead of having to choose between suppressing either all or no links.
• TalkJS Core (1.4.1): Fixed an error that occurred when subscribing to a single conversation while already subscribed to all conversations, or vice versa.
• React Native SDK (0.15.0): Fixed an issue where onNotificationPressed didn’t work correctly on iOS when using Firebase for push notifications.
• React Native SDK (0.15.0): Fixed a bug in iOS where sometimes the device token didn’t get registered.

Case study 

Read the case study →

👋 Thoughts? Questions? Get in touch.

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

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

Highlights

 Build your own custom inbox

You can now build your own custom inbox or message center with TalkJS. The new TalkSession.subscribeConversations method for the JavaScript Data API allows you to get real-time updates about any conversations in your app.

Read more about subscribing to conversations.

Always know who’s typing

You can now use the JavaScript Data API to subscribe to typing indicators. 

Typing indicators are time-based. That means that if a user hasn’t typed anything for 10 seconds, they automatically count as having stopped typing. This ensures that typing indicators only show up when a user is actually typing, not when they accidentally pressed a key and left the tab open. 

Email notifications in a thread

Email notifications about new messages are now threaded by conversation in most email clients. This way, your users can more easily stay on top of notification messages with a clean, organized inbox.

Overview of other changes

Added

TalkJS Core

• TalkJS Core (1.2.0): Added ConversationRef.subscribeParticipants, which returns a windowed subscription to the participants in the conversation. This allows you to build custom participants lists, or create chat UIs that react to participant changes.
• TalkJS Core (1.2.0): Added ParticipantSubscription and ParticipantActiveState.
• TalkJS Core (1.1.1): Added ConversationSnapshot.everyoneReadUntil, which is the minimum of all the participants’ readUntil values. Any messages sent on or before the readUntil timestamp have been read by all participants in the conversation, which displays that double-tick read status indicator.

JavaScript SDK

• JavaScript SDK (0.38.0): Added ConversationRef.subscribeTyping.
• JavaScript SDK (0.38.0): Added TypingSnapshot.
• JavaScript SDK (0.37.0): Added readUntil field to ConversationSnapshot.

React Native SDK

• React Native SDK (0.14.0): Add hideKeyboardAccessoryView prop to Chatbox and ConversationList. When set to true it removes the accessory view (^ ˅ and Done) from the top of the iOS keyboard. The default value is false.

Changed

• TalkJS Core (1.2.0): Improved startup time by sending queued requests faster when you first open the connection.
• ⚠️ React Native SDK (0.14.0): To support React Native 0.79, this version drops support for CommonJS source files. The package now only ships with ESM source files. (breaking change)

Fixed

• React Native SDK (0.13.2): Fix setPushRegistration and unsetPushRegistration methods not working.
• Fixed an issue where, under certain conditions, the emoji picker didn’t display selected skin tones correctly.

👋 Thoughts? Questions? Get in touch.

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

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

Use a custom sender address for notifications

You can now use a custom sender address for email notifications. 

Previously, email notifications would be sent from a randomly generated address, such as jbvxkmldkrihi.mjh4b43vrl4m3tfhh455l2vwcr@r.talkjs.com. If you recently signed up, then by default all email notifications are sent by the much friendlier address notifications@r.talkjs.com. 

Are you using a custom email domain? Then you can also configure the local part of the sender address (the part before the @-symbol) directly from the details page of your email domain to change the settings.

Would you also like to use a custom email address for notifications? Get in touch to enable a custom email address for notifications for your project.

Overview of other changes

Added

• TalkJS Core (1.0.0): Initial release. The @talkjs/core package is stable and you can confidently use it to read, update, and subscribe to all your chat messaging data. Backward-compatibility guaranteed.
• TalkJS Core (1.0.1): Exported types for GenericFileMetadata, AudioFileMetadata, ImageFileMetadata, VideoFileMetadata, and VoiceRecordingFileMetadata. 
• JavaScript SDK (0.37.0): Added a new messages marker (readUntil), to show users where they left off in a conversation.
• JavaScript SDK (0.36.0): Added support for a new way of creating a session, using userId: string instead of the me: Talk.User parameter.
• Added support for localizing the chat UI into Icelandic (is-IS). Is your preferred language still missing? Get in touch to get it added.

Changed

• JavaScript SDK (0.36.0): Updated the email and phone fields when creating or editing a user. These fields now accept a string in addition to string[]. If you pass a single string, it gets converted to a single-element array.
• Flutter SDK (0.15.1): Upgraded talkjs_flutter_inappwebview dependency. 

Fixed

• React Native SDK (0.13.1): Fixed an issue where, on iOS, opening the keyboard would intermittently add extra padding.
• Fixed an issue where emojis used in messages would be rendered differently from emojis used in the emoji reactions.

Security

• Fixed an issue where, using the JavaScript Data API, under certain conditions, users could perform calls that should have been restricted to app administrators. 

Feature spotlight: AI chatbot 

Add an AI chatbot to your chat to boost engagement, conversion and retention. 

You can add any AI system to your TalkJS chat. To get started, you can use one of the following tutorials:

• Create a custom AI chatbot with Claude → 
• Create a custom AI chatbot with Gemini →
• Create a custom AI chatbot with the OpenAI API →

Want to try it out right now? Check out the AI chatbot demo.

👋 Thoughts? Questions? Get in touch.

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

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

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.

Highlight

Manage themes with the REST API

You can now manage your chat UI themes using the TalkJS REST API. This includes the options to create, update, delete or export a theme. You can directly edit themes for your test environment. Once you’re happy with the updates, copy the changes to your live environment, and you’re all set.

Managing your themes through the REST API makes it easier to work with themes across multiple projects, or keep themes in your code base and update them when deploying.

Overview of other changes

Added

• Added an endpoint to the REST API that allows you to get a user's notification reply-to email address for a conversation. Any emails sent to that email address appear in the conversation as being sent by the user.
• JavaScript SDK (0.34.0): Added SendMessageParams that can be passed to ConversationRef.send to send a message by specifying its content directly. This allows you to send text messages with manually-specified formatting, in addition to file attachments and locations.
• JavaScript SDK (0.34.0): Added EditMessageParams that can be passed to MessageRef.edit to edit a message by specifying its content directly. This allows you to edit text messages with manually-specified formatting, in addition to file attachments and locations.
• JavaScript SDK (0.34.0): Added Session.uploadFile and file-subtype-specific variants. This returns a FileToken that you can use in SendMessageParams or EditMessageParams.
• React Native SDK (0.12.0): Added the customEmojis prop to Chatbox and ConversationList. This prop adds a set of custom emoji images to the emoji picker, the emoji autocompleter, and emoji reactions. It allows users to send and receive custom emojis.
• React Native SDK (0.12.0): Added keyboardVerticalOffset prop to Chatbox. This prop is basically identical to the one passed to KeyboardAvoidingView. The default value is 90. Note that the keyboardVerticalOffset prop is only used in iOS to fix an iOS bug. On Android, the KeyboardAvoidingView component isn’t available.

Changed

• React Native SDK (0.12.1): Changed the default value for the keyboardVerticalOffset to 95.

Fixed

• Fixed an issue where user IDs weren’t sent correctly, which caused user mentions to break.
• Fixed an issue where user mentions would break when the user ID contained a pipe (|) character.
• React Native SDK (0.12.1): Fixed a bug in iOS when New Architecture is enabled, where the whole UI would be scrollable when the keyboard is open.
• React Native SDK (0.12.0): Fixed a bug in iOS, where opening the keyboard would cause the ChatHeader or the top messages to get hidden. 
• React Native SDK (0.12.0): Fixed the TypeError: _messageField.getTextResolver is not a function (it is undefined), js engine: hermes. error.
• React Native SDK (0.12.0): Fixed ref methods not working when called after a delay.

New tutorial

Send event invitations and other custom message types

Out of the box, TalkJS lets you send text, attachments and even voice clips, but what if you business has more specialized types of content to send? In this tutorial, TalkJS developer Frederik Creemers shows you a pattern to create a whole range of custom message types for your chat—from event invitations to payment requests, auction bids, and contact cards.    

👋 Thoughts? Questions? Get in touch.

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

👩🏾‍💻 Come work at TalkJS! Check out our jobs page.

Highlight

Push notifications with Firebase Cloud Messaging

Want to keep your users engaged even when they're away from your chat? Learn how to set up web push notifications with Firebase Cloud Messaging (FCM) in TalkJS. Lucy Keer offers a step-by-step guide for adding push notifications for your website or app. 

Read more

Overview of changes

Added

• Added the option to set a referencedMessageId when importing messages with the REST API.
• Added a hook that triggers an event when a message is translated in real-time. The event includes the message ID, original message text (text), detected language, and the translated message text (translatedText). This way, you can store both the original and translated versions of the message.

Fixed

• Fixed an issue where, in the Realtime API, publishes would not be received correctly if the conversation ID of the conversation you’re subscribed to contained special characters.
• Fixed a bug where notifications didn’t pick up correctly on edits to a message text.

New resources

Real-time message translation for chat apps

Real-time chat translation reduces language barriers and allows you to offer global support. Follow this guide by Chris Meyns to set up real-time message translation for your website or app. 

Check out real-time translation 

Code samples

Want to add custom features to your chat? Refresh your chat UI? Use code samples! Whether you're building with regular JavaScript, React, Angular, Flutter, or other popular frameworks, you’ll find a wide range of ready-to-use examples. From integrating AI chatbots to adding custom features like GIF pickers or polls, we've got you covered.

Explore code samples

👋 Thoughts? Questions? Get in touch.

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

👩🏾‍💻We’re hiring! Check out our 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.

Create and get conversations and participants with the Realtime API  ✨ preview  ✨

The Realtime API provides you with a continuous, up-to-date flow of your TalkJS data without the need to send repeated requests or open a chat UI. And the options available on the Realtime API keep expanding. From version 0.27.0 of the JavaScript SDK, you can use ConversationRef.set, which allows you to set properties of a conversation and manage a user’s participation within it. Additionally, with ConversationRef.createIfNotExists you can streamline the process of creating a conversation if it doesn’t already exist, and to automatically add the current user as a participant if they aren't already one.

Version 0.28.0 then adds ParticipantRef, which allows you to reference a specific user's participation in a conversation. This can be useful for operations such as joining or leaving a conversation, or controlling a user’s access. In addition, ConversationRef.participant offers easy access to a participant reference within a conversation, while ConversationSnapshot.joinedAt provides the date and time (as a Unix timestamp in milliseconds) that a user joined the conversation. With these updates, you have even greater flexibility in accessing and managing conversation conversations and participants of your chat.

Changed

• The CloseButton, SearchButton  and ActionMenu built-in components available in ChatHeader now accept a label prop that allows you to set your own label for these buttons. Setting your own label can be useful if you’d like to add your own custom translation for these labels.
• The count of the number of unread messages a user has in a conversation is now capped at a thousand. A user can have more than a thousand unread messages, but the count won’t increase beyond a thousand.
• Users accessing TalkJS with multiple IDs on the same device can now manage their desktop notification preference settings separately, on a per-user basis.

Fixed

• Flutter SDK (0.13.1): Fixed a stack overflow issue when comparing sessions.
• Fixed issues where Flutter webview faced a build issue on Xcode 15 and Xcode 16/iOS 18.
• Fixed an issue where the conversation actions button in the chat header didn't have an aria-label and title attribute set for screen readers.

New tutorial

👋 Thoughts? Questions? Get in touch.

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

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