Sometimes, it's quicker to say something than to type out a long message. At other times, you really want to make sure your tone and emotion comes across right, which isn't always easy with text. That's where voice messages shine, and your users can now send them with TalkJS.

You can enable them in the role editor of your TalkJS dashboard. Note that this only changes whether someone can send voice messages. Receiving voice messages works for any user, regardless of their role.

If you've edited the default theme, you may need to make some changes for voice messages to show up nicely. To see the changes we recommend, take a look at our themes upgrade guide.

Other improvements

• Older messages within a conversation now load automatically when you scroll up.
• When you don't subscribe to notification.opened webhook events, notification emails will no longer include a tracking pixel.
• Similarly, when you don't subscribe to  notification.link.clicked webhook events, links in notification emails will no longer have a redirect for tracking clicks.
• Stability and performance improvements

It can be handy to see if the people you're talking to are currently online or not. It can help set expectations for how soon you might get a reply.

You can enable whether status indicators are visible to users via the role editor.

If you've created/edited a theme before September 28th 2022, you may need to make some changes to your theme's ChatHeader component to make these status indicators show up.

New Presence REST API

Our Rest API now has a better endpoint to find out which users are currently online. It lets you filter based on whether the just have an active session, or have an actual chat UI open, and even which conversation they're looking at. Learn more in our documentation

Other fixes and improvements

• In our themes template language, we've added a forloop object, which you can use to get information about the current loop iteration. 
• Video attachments can now have a flexible height. This may require an update to your theme to work correctly.
• We've put in place a filter to prevent automated replies such as "Out of office" emails from being sent as messages in conversations.
• Fixed an issue where dragging files into the chat didn't work in Safari
• Fixed an issue where our REST API would return a 500 internal server error when receiving an invalid JSON payload
• Fixed an issue where the last match of a search query wouldn't be highlighted

Emoji Reactions Reactions

Emoji reactions let you quickly show excitement, laughter, gratitude and much more, without it needing to be a separate message. This is especially useful if a large number of people are reacting to a message, because you see everyone's reactions at a single glance, and it doesn't clutter up the conversation.

You can enable emoji on a per-role basis via the TalkJS dashboard. If you have an existing theme, you may need to make changes to have the reactions show up. Check out this guide on updating your theme.

Play Audio Attachments

You can now play audio attachments right inside the chat! It works right out of the box, but there's a small tweak you may want to make to existing themes to adjust the height.

Clone Your Live/Test Environment into a New Project

Every project within TalkJS comes with a test, and a live environment, but there are cases where you may want an extra environment. Maybe for testing, or experimenting with new features, without messing with your existing project. From the "project settings" page of the dashboard, you can now clone your project's test or live environment into a new project.

Other Features and Bug Fixes

• Message timestamps now have an accessibility label, so that a short timestamp like "1d" is read out by screen readers as "1 day ago".
• Fixed an issue where the "Show older messages" button wouldn't work, showing a loading indicator forever. 
• Role editor usability improvements:  the role editor's main page now shows a list of all your roles, and you can get  direct URL to a role in the editor.
• The emoji suggestion bar now works better in dark themes.

TalkJS lets you respond to the previously written message. This allows you to comment on particular messages without confusing others:

Just like for the other builtin message actions like "edit" and "delete", you can configure which roles are allowed to reply to a message. Newly created roles will have such a setting enabled by default. Currently used roles will have this feature disabled, so if you're using TalkJS in production right now, head to the dashboard to enable replies!

Changes in REST API and webhooks

All REST API endpoints that return Message objects in the response now contain a referencedMessageId field which refers to the message referred to by a reply. Message related webhook events (message.sent, message.updated etc) now contain this field too.

Spelling mistakes and other slip-ups happen just happen sometimes, but it's annoying if you only notice them when you've already sent a message. Now, users can edit messages after they've been sent, from within the TalkJS UI.

Just like with deleting messages, you can configure which roles are allowed to edit messages. You can even allow users to edit all messages in a conversation, which can be useful for moderation. All new roles will allow users to edit their own messages by default. Existing roles have this permission turned off so that nothing changes without you enabling it. 

As you can see in the animation above, once a message has been edited, it is labelled with "(edited)" in the chat. If you haven't made any changes to the UserMessage and MessageBody components in the theme you're using, this will work out of the box. If you did make changes there, you can learn how to add the edit indicator in our documentation on message actions.

Message Editing and the REST API

We've added an editedAt field to messages returned by the API. When a message is first created, this field is null. When the user edits a message it'll be set to the timestamp of the most recent edit.

When updating a message via the REST API, you can now pass a markEdited field (defaulting to false). When set to true, the message's editedAt field will be updated to the time of the update, and in our default theme, the message will show up with "(edited)".

Flutter SDK Changes

• Breaking: You can now configure a participant to only receive notifications for mentions. This required us to change the type of the notify field on Participant. It is now of type ParticipantNotification, an enum with the supported notification settings.

Bugfixes and improvements

We're constantly improving performance and fixing issues under the hood. Here's an overview of just some o the issues we've fixed recently.

• We now show upload progress when the user uploads an attachment.
• Improved the upload preview for videos on mobile. The video now plays back "inline" instead of going full screen.
• Fixed an issue where certain URLs might be parsed incorrectly in messages sent via the REST API, resulting in broken links.

You can now mention any participant in a conversation by typing @ followed by their name. Once you've typed the at-symbol, a menu will come up so you can quickly select the person you're looking for.

With the addition of mentions also comes a new option for notifications. When adding/updating a participant to a conversation, you can now set the "notify" option to "MentionsOnly" to only be notified when someone mentions the user. You can learn more about the different notification settings in our documentation on participants.

New Additions to the JavaScript SDK

• Added a sendFile method to all widgets to send a file to the current conversation.. You can pass it a Blob to upload a specific file directly from your application. If you don't specify a file, the file picker dialog will open, so the user can pick a file to upload.
• Added a sendLocation method to all widgets. It will send the user's current location in the current conversation.

Note that both methods still open the confirmation dialog, so the user can confirm or cancel sending the message.

• Added an onKeyDown method to all  widgets.

React Native SDK TalkJS for React Native v0.4.0

With this release, we have updated the SDK's dependencies and peer dependencies to keep them up to date and also fix bugs in some of them. As of npm v7, peer dependencies are installed by default so upgrading the TalkJS SDK should also upgrade the peer dependencies accordingly. For yarn users, you may have to update the packages individually as shown:

yarn upgrade @notifee/react-native@^5.3.0 @react-native-community/push-notification-ios@^1.10.1 @react-native-firebase/app@^14.11.0 @react-native-firebase/messaging@^14.11.0 react-native-webview@^11.21.2

These libraries are defined as peer dependencies rather than dependencies since they contain native code and currently, React Native does not auto link transitive dependencies.

The new version of the notifee library also eliminates the need to add the local maven repository manually to your project. You can remove the section below. (Your app will still build and run if you don't remove it)

maven {
  url "$rootDir/../node_modules/@notifee/react-native/android/libs"
}

Improvements and Bug Fixes

• Fixed an issue where certain sequences could of numbers and symbols could be incorrectly treated as phone numbers, meaning they would be turned into links or suppressed by contact info suppression.
• Fixed an issue where the scroll position was not maintained properly when the on-screen keyboard opened.
• Fixed an issue where quickly switching between conversations on a slow network could cause an error.
• Fixed an issue in Safari where message parsing could cause an error.
• Our dashboard should now give more useful errors for invalid APNS certificates
• Guests can now delete messages in conversations, if their role grants them to necessary permissions.
• Screen readers should now be able to better announce emoji in messages
• Fixed an issue where push notifications on IOS didn't have a sound
• Fixed an issue where the activity pag'e on the dashboard wouldn't load for certain customers with a lot of conversations
• Fixed an issue where the scroll bar wasn't visible on dark themes

New  Push Notifications

Push notifications are a critical part of what we offer and we are very excited to make it available on our Flutter SDK. Similar to our React Native SDK, we have abstracted registering of the device token among other things to make adding push notifications a fairly straightforward thing. You can check out our documentation for a step by step guide on what you'll need to do to setup push notifications on Android and iOS through Firebase and Apple Push Notification service respectively.

improvement File Upload on Android

Due to the nature of the WebView implementation on Android and limitations of the Flutter equivalent, we had initially shipped the Flutter SDK without support for file uploads on Android. At the time of writing, various factors prevent the maintainers of the Flutter Webview plugin from shipping this feature. We believe file upload is a core component of TalkJS and so we forked the plugin and added it to cater to our Flutter SDK.

Other than your users on Android being able to upload files, there's nothing to be done from your end. Remember, you can always enable or disable file attachment for a specific role through the dashboard.

We just added Link Previews to TalkJS.

For most websites, the preview will show the title and a description of the page, but for media sites like YouTube, we'll embed the media right inside the message.

If you haven't made any changes to the UserMessage or SystemMessage component of the theme you use in TalkJS, they should start working automatically. If you did already change these templates, head over to our docs to learn how to add link previews to your theme.

Improvements to the Flutter SDK

The Flutter SDK also has some new goodies in store:

• The Chatbox and ConversationList widget now accepts an onLoadingStateChanged parameter, which can notify you when the widget's content has fully loaded.
• The Chatbox widget now takes an onCustomMessageAction handler, which you can use to respond when the user triggers custom message actions.
• Fixed a scrolling issue when the Chatbox widget is placed in a bottom sheet.

Easily Set Up a Custom Domain for Emails 📧

For a long time now, TalkJS has let you use your own domain for sending emails, and handling email replies, but up until recently, this required contacting support. Now, you can easily do this yourself.

To add a custom email domain, click the account menu in the top right of the TalkJS dashboard, then click "Email domains". After adding the domain, click "details". You'll see some instructions on how to set up the necessary DNS records. Lastly, you'll want to go to the Settings page of your dashboard, and under Email Domain, select the domain you just added.

Bugfixes 🐞 

We've fixed several bugs since our last changelog entry, including:

• Fixed an issue where flag emoji wouldn't show up on Windows in most browsers
• Fixed an issue where in dark themes, the scroll bar wasn't visible.
• Fixed an issue where we sometimes sent the same email notification multiple times

Custom Message Actions

We added the ability to add custom actions to the message menu. This lets you build features like reporting, favouriting or quoting messages. When a user selects a custom message action, an event is triggered in the JavaScript SDK. Check out our documentation on message actions for more info.

New event handlers in the JS SDK

The TalkJS JavaScript SDK emits events in many situations, so you can react to things that happen within our systems or in the chat UI. For instance, we fire an event when a conversation is selected in the inbox. The code to listen for such an event used to look like this: 

inbox.on("conversationSelected", function(event) {
  console.log(event);
});

This style of event handlers is now deprecated. Instead, you can now this:

inbox.onConversationSelected(function(event) {
  console.log(event);
});

These new event methods return a Subscription object that you can use to unsubscribe from events. This replaces the "off()" methods, which are now deprecated too. We never want to break existing code, so even though they're deprecated, the old methods will always continue to work.

For a full list of deprecated methods and their alternatives, see the deprecated methods sections on Session and its associated Unreads object, Chatbox, Popup and Inbox.

New Expo SDK

To properly support users of Expo's Managed Workflow, we have released a new package: @talkjs/expo. This package is identical to @talkjs/react-native except it has push notifications disabled. This is because the push notification libraries used have native code which make them incompatible with the Managed Workflow. 

If you need push notifications, you can send them from your own backend using our webhooks or you can use @talkjs/react-native and create a development build for your project using EAS Build or eject to the bare workflow.

The versioning for this new package will be identical to @talkjs/react-native

Better Notifications

We have changed the libraries we use for push notifications which has allowed us to greatly improve notifications, particularly on Android. Notifications are now shown as Conversations and grouped accordingly. Applies only to devices running Android 7.0 (API level 24) and up.

Images sent will also appear in the notifications. (Android only).

The function, registerPushNotificationHandlers, now allows for more configuration options when creating Android's Notification Channels. It also supports providing iOS notification related permissions you want your app to have.

As part of these changes you'll need to update your android/build.gradle file by adding the following block to the repositories section of allprojects:

maven {
url "$rootDir/../node_modules/@notifee/react-native/android/libs" }

Better Error Reporting

It should now be clearer what is wrong with your code. Should you encounter a scenario where an error has occurred but React Native's Logbox doesn't show, notify us via our livesupport.

Other changes

• Add support for Guest Access through the addition of asGuest prop in Chatbox.
• Enable capturing of keyup events in Chatbox through the captureKeyboardEvents and onKeyup props.
• Added the methods: getText and typeText to MessageField.
• Changed oneOnOneId to also accept User Objects.
• Changed showFeedHeader default to false.
• Fix issue when user and/or conversation synchronization were disabled.
• Deprecated the following props in ConversationList: feedConversationTitleMode, thirdParties, onBlur and onFocus.
• Deprecated the following props in Chatbox: chatSubtitleMode, chatTitleMode, thirdParties, translateConversations, onBlur and onFocus.