Skip to content

Releases: sendbird/sendbird-uikit-react

v3.12.0

16 Feb 14:13
d9d4077

Choose a tag to compare

[v3.12.0] (Feb 16, 2024)

Features:

  • Local cache is enabled by default
    • If desired, it can be disabled using sdkInitParams
    import SendbirdProvider from '@sendbird/uikit-react/SendbirdProvider';
    
    const App = () => (
      <SendbirdProvider
        // ...
        sdkInitParams={{ localCacheEnabled: false }}
      />
    )
  • Added GroupChannel and GroupChannelList modules.
    • With the introduction of GroupChannel and GroupChannelList, a new local caching feature has been added, allowing you to experience a more efficient chat environment.
      We provide a massive component called App that combines all the features. From now on, this component will use GroupChannel and GroupChannelList instead of Channel and ChannelList.
      If you wish to continue using Channel and ChannelList, you can use enableLegacyChannelModules to ensure the previous components are still available for use.
      import SendbirdApp from '@sendbird/uikit-react/App';
        
      const App = () => (
        <SendbirdApp
          // ...
          enableLegacyChannelModules
        />
      );
    • You can find detailed changes, usage instructions, and migration methods in the document here: Migration Guide

Fixes:

  • Fixed a bug where the session refresh failed when the accessToken was changed #969
  • Fixed a bug causing infinite loading when the channel is not selected in the Channel module #970
  • Fixed a bug where the mention feature was not functioning properly #971
  • Fixed a bug where URLs with numbered top-level domains were treated as links #972
  • Fixed a bug where message scroll delays were inconsistently applied #975
  • Fixed a bug where isUserIdUsedForNickname was not functioning properly #976
  • Optimized the rendering of SendbirdProvider
  • Optimized the SDK initialization logic for StrictMode

v3.11.1

08 Feb 06:18
7ae3cca

Choose a tag to compare

[v3.11.1] (Feb 08, 2024)

Fixes:

  • Fixed acceptableMimeTypes to support web standard format
  • Fixed a bug where renderChannelHeader is not passed properly

v3.11.0

07 Feb 07:46

Choose a tag to compare

[v3.11.0] (Feb 07, 2024)

Features:

  • Added enableSuggestedReplies global option
    • How to use?
    <App
      appId={appId}
      userId={userId}
      uikitOptions={{
        groupChannel: {
          // Below turns on the `SuggestedReplies` feature (see v3.8.0 release changelog). Default value is false.
          enableSuggestedReplies: true,
        }
      }}
    />
  • MessageInput is now being disabled if channel.lastMessage.extendedMessagePayload['disable_chat_input'] is true

Fixes:

  • Fixed a bug where channel is being removed from my channel list when other member leaves the channel
  • Fixed a bug where channel avatar image is not updated when a member leaves, or joins, or profileUrl changes
  • Fixed a bug where ChannelListUI is not updated when network is reconnected
  • Fixed a bug in ChannelList where activeChannelUrl is set but onChannelSelect fires with null after loading ChannelList
  • Fixed a bug where url text wrapped around special characters not parsed as link
  • Fixed a bug where space character before url text is removed in sent message
  • Fixed a runtime error occurring when using renderMessage of Channel module

v3.10.1

26 Jan 09:20

Choose a tag to compare

[v3.10.1] (Jan 26, 2024)

Fixes:

  • Fixed a bug where MessageList is not scrolled to bottom upon entering a channel
  • Changed behaviour of the feedback process:
    • old: On feedback icon button click -> open feedback form/menu
    • new: On feedback icon button click -> submit feedback -> open feedback form/menu
  • Supported accepting mimeTypes to the MessageInput
  • Applied the channelListQuery.order to the ChannelList
  • Fixed a bug where muted member list is not being updated after a member had been unmuted
  • Fixed a bug where operator list is not being updated after an operator had been removed
  • Fixed a bug where a link subdomain has a hyphen or long top-level domain is not recognized as link text

v3.10.0

19 Jan 07:12

Choose a tag to compare

[v3.10.0] (Jan 19, 2024)

Features:

Feedback message feature

Now we are supporting Feedback Message feature!
Feedback message feature can be turned on through enableFeedback option. When turned on, feedback feature is applied to messages with non default myFeedbackStatus values.

  • Added enableFeedback global option
    • How to use?
    <App
      appId={appId}
      userId={userId}
      uikitOptions={{
        groupChannel: {
          // Below turns on the feedback message feature. Default value is false.
          enableFeedback: true,
        }
      }}
    />

Others

  • Added labelType, and labelColor props to ButtonProps
  • Added renderMessageContent in ChannelUIProps
    • Now you can customize MessageContent through Channel in two ways:
      1. Customize with renderMessage
      <Channel
        renderMessage={(props) => (
          <Message
            {...props}
            renderMessageContent={(props) => (
              <MessageContent {...props} />
            )}
          />
        )}
      />
      1. [Simpler] Customize with renderMessageContent
      <Channel
        renderMessageContent={(props) => (
          <MessageContent {...props} />
        )}
      />

Fixes:

  • Fixed a bug in mobile view where channel view is displaying a default channel when there is no channel in channel list
  • Added missing props renderMessageContent in Channel
  • Fixed a bug where center alignment of Badge and Button components breaking in FireFox browser
  • Fixed a bug where messages sent by bot member in group channel are not triggering the expected hooks

[v3.9.3] (Jan 5, 2024)

05 Jan 07:23

Choose a tag to compare

Fixes:

  • Refactor --sendbird-vh CSS Variable Logic in InviteUsers Component
    • Improved code readability by moving logic to the InviteUsers component.
    • GitHub PR #899 (CLNP-1806)
  • Prevent Access to window in SSR Environments
    • Fixed server-side rendering issues in NextJS by preventing access to the window object. (Original Author: Aaron James King)
    • GitHub PR #900 (SBISSUE-14287)
  • Update Channel View to Show NO_CHANNEL Placeholder
  • Fix Replay of Voice Memos
  • Resolve Image Upsizing Issue in ImageCompression
  • Update Peer Dependencies for npm Install
  • Fix Scroll Behavior in Open Channel
  • Fix Cross-Site Scripting Vulnerability in OGTag

[v3.9.2] (Dec 15 2023)

15 Dec 06:33
72c11c2

Choose a tag to compare

Fixes:

  • Fixed scroll issues
    • Maintain scroll position when loading previous messages.
    • Maintain scroll position when loading next messages.
    • Move the logic that delays rendering mmf to the correct location.
  • Resolve an issue where scroll position wasn't adjusting correctly when
    the message content size was updated (caused by debouncing scroll
    events).
  • Use animatedMessage instead of highlightedMessage in the smart app
    component.
    • Reset text display issue
  • Fix the appearance of incomplete text compositions from the previous
    input in the next input.
    • Fixed type errors
      • Resolve the type error related to PropsWithChildren.
  • Address the issue of not being assignable to type error, where the
    property 'children' doesn't exist on type PropsWithChildren.
    • Use PropsWithChildren<unknown> instead of PropsWithChildren.
  • Fixed a voice message length parsing issue
  • Include metaArray to the message list when fetching messages again by
    connecting

[v3.9.1] (Dec 8 2023)

07 Feb 07:47
53b8a8f

Choose a tag to compare

Features:

  • Improved image loading speed by implementing lazy load with IntersectionObserver
  • Replaced lamejs binary
  • Applied the uikitUploadSizeLimit to the Open Channel Message Input
    • Check the file size limit when sending file messages from Open Channel
    • Display the modal alert when the file size over the limit

Fixes:

  • Fixed a bug where the admin message disappears when sending a message
  • Recognized the hash property in the URL
  • Fixed a bug where resending MFM fails in the thread
  • Group channel user left or banned event should not be ignored
  • Removed left 0px from <Avatar /> component to fix ruined align
  • Applied StringSet for the file upload limit notification
  • Updated currentUserId properly in the channel list initialize step.
    • Fixed group channel doesn't move to the top in a channel list even though latest_last_message is the default order.

Improvements:

  • Divided <EditUserProfileUI /> into Modal and View parts
  • Added a message prop to <ReactionItem /> component
  • Improved the storybook of <EmojiReactions />

v3.9.0

23 Nov 03:21

Choose a tag to compare

[v3.9.0] (Nov 24 2023)

Features:

Typing indicator bubble feature

TypingIndicatorBubble is a new typing indicator UI that can be turned on through typingIndicatorTypes option. When turned on, it will be displayed in MessageList upon receiving typing event in real time.

  • Added typingIndicatorTypes global option
  • Added TypingIndicatorType enum
    • How to use?
    <App
      appId={appId}
      userId={userId}
      uikitOptions={{
        groupChannel: {
          // Below turns on both bubble and text typing indicators. Default is Text only.
          typingIndicatorTypes: new Set([TypingIndicatorType.Bubble, TypingIndicatorType.Text]),
        }
      }}
    />
  • Added TypingIndicatorBubble
    • How to use?
    const moveScroll = (): void => {
      const current = scrollRef?.current;
      if (current) {
        const bottom = current.scrollHeight - current.scrollTop - current.offsetHeight;
        if (scrollBottom < bottom && scrollBottom < SCROLL_BUFFER) {
          // Move the scroll as much as the height of the message has changed
          current.scrollTop += bottom - scrollBottom;
        }
      }
    };
    
    return (
      <TypingIndicatorBubble
        typingMembers={typingMembers}
        handleScroll={moveScroll} // Scroll to the rendered typing indicator message IFF current scroll is bottom.
      />
    );

Others

  • Added support for eventHandlers.connection.onFailed callback in setupConnection. This callback will be called on connection failure
    • How to use?
      <Sendbird
        appId={appId}
        userId={undefined} // this will cause an error 
        eventHandlers={{
          connection: {
            onFailed: (error) => {
              alert(error?.message); // display a browser alert and print the error message inside
            }
          }
        }}
      >
  • Added new props to the MessageContent component: renderMessageMenu, renderEmojiMenu, and renderEmojiReactions
    • How to use?
    <Channel
    renderMessageContent={(props) => {
      return <MessageContent
        {...props}
        renderMessageMenu={(props) => {
          return <MessageMenu {...props} />
        }}
        renderEmojiMenu={(props) => {
          return <MessageEmojiMenu {...props} />
        }}
        renderEmojiReactions={(props) => {
          return <EmojiReactions {...props} />
        }}
      />
    }}
    />
  • Added onProfileEditSuccess prop to App and ChannelList components
  • Added renderFrozenNotification in ChannelUIProps
    • How to use?
      <Channel
        channelUrl={channelUrl}
        renderFrozenNotification={() => {
          return (
            <div
              className="sendbird-notification sendbird-notification--frozen sendbird-conversation__messages__notification"
            >My custom Frozen Notification</div>
          );
        }}
      />
  • Exported VoiceMessageInputWrapper and useHandleUploadFiles
    • How to use?
    import { useHandleUploadFiles } from '@sendbird/uikit-react/Channel/hooks/useHandleUploadFiles'
    import { VoiceMessageInputWrapper, VoiceMessageInputWrapperProps } from '@sendbird/uikit-react/Channel/components/MessageInput'

Fixes:

  • Fixed a bug where setting startingPoint scrolls to the middle of the target message when it should be at the top of the message
  • Applied dark theme to the slide left icon
  • Fixed a bug where changing current channel not clearing pending and failed messages from the previous channel
  • Fixed a bug where the thumbnail image of OGMessage being displayed as not fitting the container
  • Fixed a bug where resending a failed message in Thread results in displaying resulting message in Channel
  • Fixed a bug where unread message notification not being removed when scroll reaches bottom

Improvement:

  • Channels list no longer displays unread message count badge for focused channel

[v3.8.2] (Nov 10 2023)

10 Nov 07:55

Choose a tag to compare

Features:

  • MessageContent is not customizable with three new optional properties:
    • renderSenderProfile, renderMessageBody, and renderMessageHeader
    • How to use?
      import Channel from '@sendbird/uikit-react/Channel'
      import { useSendbirdStateContext } from '@sendbird/uikit-react/useSendbirdStateContext'
      import { useChannelContext } from '@sendbird/uikit-react/Channel/context'
      import MessageContent from '@sendbird/uikit-react/ui/MessageContent'
      
      const CustomChannel = () => {
        const { config } = useSendbirdStateContext();
        const { userId } = config;
        const { currentGroupChannel } = useChannelContext();
        return (
          <Channel
            ...
            renderMessage={({ message }) => {
              return (
                <MessageContent
                  userId={userId}
                  channel={currentGroupChannel}
                  message={message}
                  ...
                  renderSenderProfile={(props: MessageProfileProps) => (
                    <MessageProfile {...props}/>
                  )}
                  renderMessageBody={(props: MessageBodyProps) => (
                    <MessageBody {...props}/>
                  )}
                  renderMessageHeader={(props: MessageHeaderProps) => (
                    <MessageHeader {...props}/>
                  )}
                />
              )
            }}
          />
        )
      }

Fixes:

  • Fix runtime error due to publishing modules
  • Add missing date locale to the UnreadCount banner since string
  • Use the more impactful value between the resizingWidth and resizingHeight
    • So, the original images' ratio won't be broken
  • Apply the ImageCompression to the Thread module
  • Apply the ImageCompression for sending file message and multiple files message

Improvements:

  • Use channel.members instead of fetching for non-super group channels in the SuggestedMentionList