@sendbird/uikit-react 3.1.3 → 3.2.0-rc.1

package/cjs/SendbirdProvider.js

@@ -1,91 +1,96 @@
 'use strict';
 
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-09706ebf.js');
+var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-c7da8657.js');
 var React = require('react');
 var PropTypes = require('prop-types');
 var withSendbird = require('./withSendbird.js');
-var sendbird = require('./sendbird-e3e5c8ae.js');
-var openChannel = require('./openChannel-e95532d8.js');
-var groupChannel = require('./groupChannel-4934c435.js');
-var actionTypes = require('./actionTypes-b3af2b15.js');
-var index = require('./index-c8f7702f.js');
-var tslib_es6 = require('./tslib.es6-f57d0c81.js');
+var SendbirdChat = require('@sendbird/chat');
+var openChannel = require('./openChannel-4789903c.js');
+var groupChannel = require('./groupChannel-95ba4a71.js');
+var actionTypes = require('./actionTypes-1bc31680.js');
+var index = require('./index-907bf834.js');
+var tslib_es6 = require('./tslib.es6-9b1c82d5.js');
 var cssVars = require('css-vars-ponyfill');
-var uuid = require('./uuid-1942f440.js');
-var LocalizationContext = require('./LocalizationContext-c13ae9d5.js');
-var stringSet = require('./stringSet-bd0c293d.js');
-require('./__bundle-6316ce22-054c7ff6.js');
-require('./__bundle-fbda47dd-4cb7267d.js');
-require('./__bundle-7dfccc8c-826eb0ef.js');
-require('./index-63b56a0e.js');
+var uuid = require('./uuid-c32d01d6.js');
+var LocalizationContext = require('./LocalizationContext-b051aa28.js');
+var stringSet = require('./stringSet-9d251780.js');
+require('./__bundle-c41dd401-1f364afe.js');
+require('./index-53015903.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var SendbirdChat__default = /*#__PURE__*/_interopDefaultLegacy(SendbirdChat);
 var cssVars__default = /*#__PURE__*/_interopDefaultLegacy(cssVars);
 
-var INIT_SDK = 'INIT_SDK';
-var SET_SDK_LOADING = 'SET_SDK_LOADING';
-var RESET_SDK = 'RESET_SDK';
-var SDK_ERROR = 'SDK_ERROR';
-
-var APP_VERSION_STRING = '3.1.3';
-var disconnectSdk = function disconnectSdk(_ref) {
-  var sdkDispatcher = _ref.sdkDispatcher,
-      userDispatcher = _ref.userDispatcher,
-      sdk = _ref.sdk,
-      onDisconnect = _ref.onDisconnect;
+const INIT_SDK = 'INIT_SDK';
+const SET_SDK_LOADING = 'SET_SDK_LOADING';
+const RESET_SDK = 'RESET_SDK';
+const SDK_ERROR = 'SDK_ERROR';
+
+const APP_VERSION_STRING = '3.2.0-rc.1';
+const disconnectSdk = _ref => {
+  let {
+    sdkDispatcher,
+    userDispatcher,
+    sdk,
+    onDisconnect
+  } = _ref;
   sdkDispatcher({
     type: SET_SDK_LOADING,
     payload: true
   });
 
   if (sdk && sdk.disconnect) {
-    sdk.disconnect().then(function () {
+    sdk.disconnect().then(() => {
       sdkDispatcher({
         type: RESET_SDK
       });
       userDispatcher({
         type: actionTypes.RESET_USER
       });
-    }).finally(function () {
+    }).finally(() => {
       onDisconnect();
     });
   } else {
     onDisconnect();
   }
 };
-var handleConnection = function handleConnection(_ref2, dispatchers) {
-  var userId = _ref2.userId,
-      appId = _ref2.appId,
-      nickname = _ref2.nickname,
-      profileUrl = _ref2.profileUrl,
-      accessToken = _ref2.accessToken,
-      configureSession = _ref2.configureSession,
-      customApiHost = _ref2.customApiHost,
-      customWebSocketHost = _ref2.customWebSocketHost,
-      sdk = _ref2.sdk,
-      logger = _ref2.logger;
-  var sdkDispatcher = dispatchers.sdkDispatcher,
-      userDispatcher = dispatchers.userDispatcher;
+const handleConnection = (_ref2, dispatchers) => {
+  let {
+    userId,
+    appId,
+    nickname,
+    profileUrl,
+    accessToken,
+    configureSession,
+    customApiHost,
+    customWebSocketHost,
+    sdk,
+    logger
+  } = _ref2;
+  const {
+    sdkDispatcher,
+    userDispatcher
+  } = dispatchers;
   disconnectSdk({
-    sdkDispatcher: sdkDispatcher,
-    userDispatcher: userDispatcher,
-    sdk: sdk,
-    logger: logger,
-    onDisconnect: function onDisconnect() {
+    sdkDispatcher,
+    userDispatcher,
+    sdk,
+    logger,
+    onDisconnect: () => {
       logger.info('Setup connection');
-      var sessionHandler = null;
+      let sessionHandler = null;
       sdkDispatcher({
         type: SET_SDK_LOADING,
         payload: true
       });
 
       if (userId && appId) {
-        var params = {
-          appId: appId,
-          modules: [new groupChannel.$r(), new openChannel.Nn()]
+        const params = {
+          appId,
+          modules: [new groupChannel.es(), new openChannel.Nn()]
         };
 
         if (customApiHost) {
@@ -96,7 +101,7 @@ var handleConnection = function handleConnection(_ref2, dispatchers) {
           params.customWebSocketHost = customWebSocketHost;
         }
 
-        var newSdk = sendbird.Fn.init(params);
+        const newSdk = SendbirdChat__default["default"].init(params);
 
         if (configureSession && typeof configureSession === 'function') {
           sessionHandler = configureSession(newSdk);
@@ -109,7 +114,7 @@ var handleConnection = function handleConnection(_ref2, dispatchers) {
           newSdk.addExtension('sb_uikit', APP_VERSION_STRING);
         }
 
-        var connectCbSucess = function connectCbSucess(user) {
+        const connectCbSucess = user => {
           sdkDispatcher({
             type: INIT_SDK,
             payload: newSdk
@@ -124,7 +129,7 @@ var handleConnection = function handleConnection(_ref2, dispatchers) {
             newSdk.updateCurrentUserInfo({
               nickname: nickname || user.nickname,
               profileUrl: profileUrl || user.profileUrl
-            }).then(function (namedUser) {
+            }).then(namedUser => {
               userDispatcher({
                 type: actionTypes.UPDATE_USER_INFO,
                 payload: namedUser
@@ -133,8 +138,8 @@ var handleConnection = function handleConnection(_ref2, dispatchers) {
           }
         };
 
-        var connectCbError = function connectCbError(e) {
-          logger.error('Connection failed', "".concat(e));
+        const connectCbError = e => {
+          logger.error('Connection failed', `${e}`);
           sdkDispatcher({
             type: RESET_SDK
           });
@@ -147,17 +152,9 @@ var handleConnection = function handleConnection(_ref2, dispatchers) {
         };
 
         if (accessToken) {
-          newSdk.connect(userId, accessToken).then(function (res) {
-            return connectCbSucess(res);
-          }).catch(function (err) {
-            return connectCbError(err);
-          });
+          newSdk.connect(userId, accessToken).then(res => connectCbSucess(res)).catch(err => connectCbError(err));
         } else {
-          newSdk.connect(userId).then(function (res) {
-            return connectCbSucess(res);
-          }).catch(function (err) {
-            return connectCbError(err);
-          });
+          newSdk.connect(userId).then(res => connectCbSucess(res)).catch(err => connectCbError(err));
         }
       } else {
         sdkDispatcher({
@@ -169,7 +166,7 @@ var handleConnection = function handleConnection(_ref2, dispatchers) {
   });
 };
 
-var isEmpty = function isEmpty(obj) {
+var isEmpty = function (obj) {
   if (obj === null || obj === undefined) {
     return true;
   }
@@ -183,7 +180,7 @@ var isEmpty = function isEmpty(obj) {
   return JSON.stringify(obj) === JSON.stringify({});
 };
 
-var useTheme = function useTheme(overrides) {
+var useTheme = function (overrides) {
   React.useLayoutEffect(function () {
     if (!isEmpty(overrides)) {
       cssVars__default["default"]({
@@ -336,62 +333,59 @@ function reducer(state, action) {
   }
 }
 
-function useConnectionStatus(sdk, logger) {
-  var _useState = React.useState(true),
-      _useState2 = _rollupPluginBabelHelpers._slicedToArray(_useState, 2),
-      isOnline = _useState2[0],
-      setIsOnline = _useState2[1];
-
-  React.useEffect(function () {
-    var uniqueHandlerId = uuid.uuidv4();
+function useConnectionStatus(sdk, logger, configureSession) {
+  const [isOnline, setIsOnline] = React.useState(true);
+  React.useEffect(() => {
+    const uniqueHandlerId = uuid.uuidv4();
 
     try {
       logger.warning('sdk changed', uniqueHandlerId);
-      var handler = new sendbird.Pe();
+      const handler = new SendbirdChat.ConnectionHandler();
 
-      handler.onDisconnected = function () {
+      handler.onDisconnected = () => {
         logger.warning('onDisconnected', {
-          isOnline: isOnline
+          isOnline
         });
       };
 
-      handler.onReconnectStarted = function () {
+      handler.onReconnectStarted = () => {
         setIsOnline(false);
         logger.warning('onReconnectStarted', {
-          isOnline: isOnline
+          isOnline
         });
       };
 
-      handler.onReconnectSucceeded = function () {
+      handler.onReconnectSucceeded = () => {
         setIsOnline(true);
         logger.warning('onReconnectSucceeded', {
-          isOnline: isOnline
+          isOnline
         });
       };
 
-      handler.onReconnectFailed = function () {
+      handler.onReconnectFailed = () => {
         sdk.reconnect();
         logger.warning('onReconnectFailed');
       };
 
-      logger.info('Added ConnectionHandler', uniqueHandlerId);
+      logger.info('Added ConnectionHandler', uniqueHandlerId); // workaround -> addConnectionHandler invalidates session handler
+      // provided through configureSession
 
-      if (sdk !== null && sdk !== void 0 && sdk.addConnectionHandler) {
+      if (sdk !== null && sdk !== void 0 && sdk.addConnectionHandler && !configureSession) {
         sdk.addConnectionHandler(uniqueHandlerId, handler);
       }
     } catch (_unused) {//
     }
 
-    return function () {
+    return () => {
       try {
         sdk.removeConnectionHandler(uniqueHandlerId);
         logger.info('Removed ConnectionHandler', uniqueHandlerId);
       } catch (_unused2) {//
       }
     };
-  }, [sdk]);
-  React.useEffect(function () {
-    var tryReconnect = function tryReconnect() {
+  }, [sdk, configureSession]);
+  React.useEffect(() => {
+    const tryReconnect = () => {
       try {
         logger.warning('Try reconnecting SDK');
 
@@ -405,13 +399,13 @@ function useConnectionStatus(sdk, logger) {
 
 
     window.addEventListener('online', tryReconnect);
-    return function () {
+    return () => {
       window.removeEventListener('online', tryReconnect);
     };
   }, [sdk]); // add offline-class to body
 
-  React.useEffect(function () {
-    var body = document.querySelector('body');
+  React.useEffect(() => {
+    const body = document.querySelector('body');
 
     if (!isOnline) {
       try {
@@ -433,7 +427,7 @@ function useConnectionStatus(sdk, logger) {
 // Logger, pretty much explains it
 // in SendbirdProvider
 // const [logger, setLogger] = useState(LoggerFactory(logLevel));
-var LOG_LEVELS = {
+const LOG_LEVELS = {
   DEBUG: 'debug',
   WARNING: 'warning',
   ERROR: 'error',
@@ -441,7 +435,7 @@ var LOG_LEVELS = {
   ALL: 'all'
 };
 
-var colorLog = function colorLog(level) {
+const colorLog = level => {
   switch (level) {
     case LOG_LEVELS.WARNING:
       return 'color: Orange';
@@ -454,36 +448,31 @@ var colorLog = function colorLog(level) {
   }
 };
 
-var printLog = function printLog(_ref) {
-  var level = _ref.level,
-      title = _ref.title,
-      _ref$description = _ref.description,
-      description = _ref$description === void 0 ? '' : _ref$description;
+const printLog = _ref => {
+  let {
+    level,
+    title,
+    description = ''
+  } = _ref;
   // eslint-disable-next-line no-console
-  console.log("%c SendbirdUIKit | ".concat(level, " | ").concat(new Date().toISOString(), " | ").concat(title, " ").concat(description && '|'), colorLog(level), description);
+  console.log(`%c SendbirdUIKit | ${level} | ${new Date().toISOString()} | ${title} ${description && '|'}`, colorLog(level), description);
 };
-var getDefaultLogger = function getDefaultLogger() {
-  return {
-    info: function info() {},
-    error: function error() {},
-    warning: function warning() {}
-  };
-};
-var LoggerFactory = function LoggerFactory(lvl, customInterface) {
-  var logInterface = customInterface || printLog;
-  var lvlArray = Array.isArray(lvl) ? lvl : [lvl];
-
-  var applyLog = function applyLog(lgLvl) {
-    return function (title, description) {
-      return logInterface({
-        level: lgLvl,
-        title: title,
-        description: description
-      });
-    };
-  };
+const getDefaultLogger = () => ({
+  info: () => {},
+  error: () => {},
+  warning: () => {}
+});
+const LoggerFactory = (lvl, customInterface) => {
+  const logInterface = customInterface || printLog;
+  const lvlArray = Array.isArray(lvl) ? lvl : [lvl];
+
+  const applyLog = lgLvl => (title, description) => logInterface({
+    level: lgLvl,
+    title,
+    description
+  });
 
-  var logger = lvlArray.reduce(function (accumulator, currentLvl) {
+  const logger = lvlArray.reduce((accumulator, currentLvl) => {
     if (currentLvl === LOG_LEVELS.DEBUG || currentLvl === LOG_LEVELS.ALL) {
       return _rollupPluginBabelHelpers._objectSpread2(_rollupPluginBabelHelpers._objectSpread2({}, accumulator), {}, {
         info: applyLog(LOG_LEVELS.INFO),
@@ -520,36 +509,34 @@ var LoggerFactory = function LoggerFactory(lvl, customInterface) {
 // for example, if customer sends a message from their custom component
 // without pubsub,we would not be able to listen to it
 // in our ChannelList or Conversation
-var pubSubFactory = (function () {
-  var topics = {};
-  var hOP = topics.hasOwnProperty;
+var pubSubFactory = (() => {
+  const topics = {};
+  const hOP = topics.hasOwnProperty;
   return {
-    __getTopics: function __getTopics() {
-      return topics;
-    },
-    subscribe: function subscribe(topic, listener) {
+    __getTopics: () => topics,
+    subscribe: (topic, listener) => {
       // Create the topic's object if not yet created
       if (!hOP.call(topics, topic)) {
         topics[topic] = [];
       } // Add the listener to queue
 
 
-      var index = topics[topic].push(listener) - 1; // Provide handle back for removal of topic
+      const index = topics[topic].push(listener) - 1; // Provide handle back for removal of topic
 
       return {
-        remove: function remove() {
+        remove: () => {
           delete topics[topic][index];
         }
       };
     },
-    publish: function publish(topic, info) {
+    publish: (topic, info) => {
       // If the topic doesn't exist, or there's no listeners in queue, just leave
       if (!hOP.call(topics, topic)) {
         return;
       } // Cycle through topics queue, fire!
 
 
-      topics[topic].forEach(function (item) {
+      topics[topic].forEach(item => {
         item(info !== undefined ? info : {});
       });
     }
@@ -557,18 +544,18 @@ var pubSubFactory = (function () {
 });
 
 function useAppendDomNode() {
-  var ids = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-  var rootSelector = arguments.length > 1 ? arguments[1] : undefined;
-  React.useEffect(function () {
-    var root = document.querySelector(rootSelector);
-    ids.forEach(function (id) {
-      var elem = document.createElement('div');
+  let ids = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  let rootSelector = arguments.length > 1 ? arguments[1] : undefined;
+  React.useEffect(() => {
+    const root = document.querySelector(rootSelector);
+    ids.forEach(id => {
+      const elem = document.createElement('div');
       elem.setAttribute('id', id);
       root.appendChild(elem);
     });
-    return function () {
-      ids.forEach(function (id) {
-        var target = document.getElementById(id);
+    return () => {
+      ids.forEach(id => {
+        const target = document.getElementById(id);
 
         if (target) {
           root.removeChild(target);
@@ -579,97 +566,76 @@ function useAppendDomNode() {
 }
 
 function Sendbird(props) {
-  var userId = props.userId,
-      dateLocale = props.dateLocale,
-      appId = props.appId,
-      accessToken = props.accessToken,
-      configureSession = props.configureSession,
-      customApiHost = props.customApiHost,
-      customWebSocketHost = props.customWebSocketHost,
-      children = props.children,
-      disableUserProfile = props.disableUserProfile,
-      renderUserProfile = props.renderUserProfile,
-      allowProfileEdit = props.allowProfileEdit,
-      theme = props.theme,
-      nickname = props.nickname,
-      profileUrl = props.profileUrl,
-      userListQuery = props.userListQuery,
-      _props$config = props.config,
-      config = _props$config === void 0 ? {} : _props$config,
-      colorSet = props.colorSet,
-      stringSet$1 = props.stringSet,
-      imageCompression = props.imageCompression,
-      isReactionEnabled = props.isReactionEnabled,
-      isMentionEnabled = props.isMentionEnabled,
-      isTypingIndicatorEnabledOnChannelList = props.isTypingIndicatorEnabledOnChannelList,
-      isMessageReceiptStatusEnabledOnChannelList = props.isMessageReceiptStatusEnabledOnChannelList;
-  var _config$logLevel = config.logLevel,
-      logLevel = _config$logLevel === void 0 ? '' : _config$logLevel,
-      _config$userMention = config.userMention,
-      userMention = _config$userMention === void 0 ? {} : _config$userMention,
-      _config$isREMUnitEnab = config.isREMUnitEnabled,
-      isREMUnitEnabled = _config$isREMUnitEnab === void 0 ? false : _config$isREMUnitEnab;
-
-  var _useState = React.useState(LoggerFactory(logLevel)),
-      _useState2 = _rollupPluginBabelHelpers._slicedToArray(_useState, 2),
-      logger = _useState2[0],
-      setLogger = _useState2[1];
-
-  var _useState3 = React.useState(),
-      _useState4 = _rollupPluginBabelHelpers._slicedToArray(_useState3, 2),
-      pubSub = _useState4[0],
-      setPubSub = _useState4[1];
-
-  var _useReducer = React.useReducer(reducer$1, sdkInitialState),
-      _useReducer2 = _rollupPluginBabelHelpers._slicedToArray(_useReducer, 2),
-      sdkStore = _useReducer2[0],
-      sdkDispatcher = _useReducer2[1];
-
-  var _useReducer3 = React.useReducer(reducer, userInitialState),
-      _useReducer4 = _rollupPluginBabelHelpers._slicedToArray(_useReducer3, 2),
-      userStore = _useReducer4[0],
-      userDispatcher = _useReducer4[1];
-
+  const {
+    userId,
+    dateLocale,
+    appId,
+    accessToken,
+    configureSession,
+    customApiHost,
+    customWebSocketHost,
+    children,
+    disableUserProfile,
+    renderUserProfile,
+    allowProfileEdit,
+    theme,
+    nickname,
+    profileUrl,
+    userListQuery,
+    config = {},
+    colorSet,
+    stringSet: stringSet$1,
+    imageCompression,
+    isReactionEnabled,
+    isMentionEnabled,
+    isTypingIndicatorEnabledOnChannelList,
+    isMessageReceiptStatusEnabledOnChannelList
+  } = props;
+  const {
+    logLevel = '',
+    userMention = {},
+    isREMUnitEnabled = false
+  } = config;
+  const [logger, setLogger] = React.useState(LoggerFactory(logLevel));
+  const [pubSub, setPubSub] = React.useState();
+  const [sdkStore, sdkDispatcher] = React.useReducer(reducer$1, sdkInitialState);
+  const [userStore, userDispatcher] = React.useReducer(reducer, userInitialState);
   useTheme(colorSet);
-  React.useEffect(function () {
+  React.useEffect(() => {
     setPubSub(pubSubFactory());
   }, []);
-  React.useEffect(function () {
+  React.useEffect(() => {
     logger.info('App Init'); // dispatch action
 
     handleConnection({
-      userId: userId,
-      appId: appId,
-      accessToken: accessToken,
-      sdkStore: sdkStore,
-      nickname: nickname,
-      profileUrl: profileUrl,
-      configureSession: configureSession,
-      customApiHost: customApiHost,
-      customWebSocketHost: customWebSocketHost,
+      userId,
+      appId,
+      accessToken,
+      sdkStore,
+      nickname,
+      profileUrl,
+      configureSession,
+      customApiHost,
+      customWebSocketHost,
       sdk: sdkStore.sdk,
-      logger: logger
+      logger
     }, {
-      sdkDispatcher: sdkDispatcher,
-      userDispatcher: userDispatcher
+      sdkDispatcher,
+      userDispatcher
     });
   }, [userId, appId, accessToken]); // to create a pubsub to communicate between parent and child
 
-  React.useEffect(function () {
+  React.useEffect(() => {
     setLogger(LoggerFactory(logLevel));
   }, [logLevel]);
   useAppendDomNode(['sendbird-modal-root', 'sendbird-dropdown-portal', 'sendbird-emoji-list-portal'], 'body'); // should move to reducer
 
-  var _useState5 = React.useState(theme),
-      _useState6 = _rollupPluginBabelHelpers._slicedToArray(_useState5, 2),
-      currenttheme = _useState6[0],
-      setCurrenttheme = _useState6[1];
-
-  React.useEffect(function () {
+  const [currenttheme, setCurrenttheme] = React.useState(theme);
+  React.useEffect(() => {
     setCurrenttheme(theme);
   }, [theme]);
-  React.useEffect(function () {
-    var body = document.querySelector('body');
+  React.useEffect(() => {
+    const body = document.querySelector('body');
     body.classList.remove('sendbird-experimental__rem__units');
 
     if (isREMUnitEnabled) {
@@ -677,32 +643,29 @@ function Sendbird(props) {
     }
   }, [isREMUnitEnabled]); // add-remove theme from body
 
-  React.useEffect(function () {
-    logger.info('Setup theme', "Theme: ".concat(currenttheme));
+  React.useEffect(() => {
+    logger.info('Setup theme', `Theme: ${currenttheme}`);
 
     try {
-      var body = document.querySelector('body');
+      const body = document.querySelector('body');
       body.classList.remove('sendbird-theme--light');
       body.classList.remove('sendbird-theme--dark');
-      body.classList.add("sendbird-theme--".concat(currenttheme || 'light'));
+      body.classList.add(`sendbird-theme--${currenttheme || 'light'}`);
       logger.info('Finish setup theme'); // eslint-disable-next-line no-empty
     } catch (e) {
-      logger.warning('Setup theme failed', "".concat(e));
+      logger.warning('Setup theme failed', `${e}`);
     }
 
-    return function () {
+    return () => {
       try {
-        var _body = document.querySelector('body');
-
-        _body.classList.remove('sendbird-theme--light');
-
-        _body.classList.remove('sendbird-theme--dark'); // eslint-disable-next-line no-empty
-
+        const body = document.querySelector('body');
+        body.classList.remove('sendbird-theme--light');
+        body.classList.remove('sendbird-theme--dark'); // eslint-disable-next-line no-empty
       } catch (_unused) {}
     };
   }, [currenttheme]);
-  var isOnline = useConnectionStatus(sdkStore.sdk, logger);
-  var localeStringSet = React__default["default"].useMemo(function () {
+  const isOnline = useConnectionStatus(sdkStore.sdk, logger, configureSession);
+  const localeStringSet = React__default["default"].useMemo(() => {
     if (!stringSet$1) {
       return stringSet.getStringSet('en');
     }
@@ -712,50 +675,50 @@ function Sendbird(props) {
   return /*#__PURE__*/React__default["default"].createElement(withSendbird.SendbirdSdkContext.Provider, {
     value: {
       stores: {
-        sdkStore: sdkStore,
-        userStore: userStore
+        sdkStore,
+        userStore
       },
       dispatchers: {
-        sdkDispatcher: sdkDispatcher,
-        userDispatcher: userDispatcher,
-        reconnect: function reconnect() {
+        sdkDispatcher,
+        userDispatcher,
+        reconnect: () => {
           handleConnection({
-            userId: userId,
-            appId: appId,
-            accessToken: accessToken,
-            sdkStore: sdkStore,
-            nickname: nickname,
-            profileUrl: profileUrl,
-            logger: logger,
+            userId,
+            appId,
+            accessToken,
+            sdkStore,
+            nickname,
+            profileUrl,
+            logger,
             sdk: sdkStore.sdk
           }, {
-            sdkDispatcher: sdkDispatcher,
-            userDispatcher: userDispatcher
+            sdkDispatcher,
+            userDispatcher
           });
         }
       },
       config: {
-        disableUserProfile: disableUserProfile,
-        renderUserProfile: renderUserProfile,
-        allowProfileEdit: allowProfileEdit,
-        isOnline: isOnline,
-        userId: userId,
-        appId: appId,
-        accessToken: accessToken,
+        disableUserProfile,
+        renderUserProfile,
+        allowProfileEdit,
+        isOnline,
+        userId,
+        appId,
+        accessToken,
         theme: currenttheme,
-        setCurrenttheme: setCurrenttheme,
-        userListQuery: userListQuery,
-        logger: logger,
-        pubSub: pubSub,
-        imageCompression: imageCompression,
-        isReactionEnabled: isReactionEnabled,
+        setCurrenttheme,
+        userListQuery,
+        logger,
+        pubSub,
+        imageCompression,
+        isReactionEnabled,
         isMentionEnabled: isMentionEnabled || false,
         userMention: {
           maxMentionCount: (userMention === null || userMention === void 0 ? void 0 : userMention.maxMentionCount) || 10,
           maxSuggestionCount: (userMention === null || userMention === void 0 ? void 0 : userMention.maxSuggestionCount) || 15
         },
-        isTypingIndicatorEnabledOnChannelList: isTypingIndicatorEnabledOnChannelList,
-        isMessageReceiptStatusEnabledOnChannelList: isMessageReceiptStatusEnabledOnChannelList
+        isTypingIndicatorEnabledOnChannelList,
+        isMessageReceiptStatusEnabledOnChannelList
       }
     }
   }, /*#__PURE__*/React__default["default"].createElement(LocalizationContext.LocalizationProvider, {