@sendbird/uikit-react
Version:
Sendbird UIKit for React: A feature-rich and customizable chat UI kit with messaging, channel management, and user authentication.
279 lines (272 loc) • 14.7 kB
JavaScript
;
var _tslib = require('./bundle-Conb-pOy.js');
var SendbirdContext = require('./bundle-B19RHFpR.js');
var React = require('react');
var SendbirdChat = require('@sendbird/chat');
var groupChannel = require('@sendbird/chat/groupChannel');
var openChannel = require('@sendbird/chat/openChannel');
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
var SendbirdChat__default = /*#__PURE__*/_interopDefaultCompat(SendbirdChat);
var updateAppInfoStore = function (state, payload) {
return _tslib.__assign(_tslib.__assign({}, state), { stores: _tslib.__assign(_tslib.__assign({}, state.stores), { appInfoStore: _tslib.__assign(_tslib.__assign({}, state.stores.appInfoStore), payload) }) });
};
var updateSdkStore = function (state, payload) {
return _tslib.__assign(_tslib.__assign({}, state), { stores: _tslib.__assign(_tslib.__assign({}, state.stores), { sdkStore: _tslib.__assign(_tslib.__assign({}, state.stores.sdkStore), payload) }) });
};
var updateUserStore = function (state, payload) {
return _tslib.__assign(_tslib.__assign({}, state), { stores: _tslib.__assign(_tslib.__assign({}, state.stores), { userStore: _tslib.__assign(_tslib.__assign({}, state.stores.userStore), payload) }) });
};
function initSDK(_a) {
var appId = _a.appId, customApiHost = _a.customApiHost, customWebSocketHost = _a.customWebSocketHost, _b = _a.sdkInitParams, sdkInitParams = _b === void 0 ? {} : _b;
var params = Object.assign(sdkInitParams, {
appId: appId,
modules: [new groupChannel.GroupChannelModule(), new openChannel.OpenChannelModule()],
// newInstance: isNewApp,
localCacheEnabled: typeof sdkInitParams.localCacheEnabled !== 'undefined' ? sdkInitParams.localCacheEnabled : true,
});
if (customApiHost)
params.customApiHost = customApiHost;
if (customWebSocketHost)
params.customWebSocketHost = customWebSocketHost;
return SendbirdChat__default.default.init(params);
}
var APP_VERSION_STRING = '3.17.0';
/**
* Sets up the Sendbird SDK after initialization.
* Configures necessary settings, adds extensions, sets the platform, and configures the session handler if provided.
*/
function setupSDK(sdk, params) {
var _a, _b;
var logger = params.logger, sessionHandler = params.sessionHandler, isMobile = params.isMobile, customExtensionParams = params.customExtensionParams;
(_a = logger.info) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect/setupConnection/setVersion', { version: APP_VERSION_STRING });
sdk.addExtension('sb_uikit', APP_VERSION_STRING);
sdk.addSendbirdExtensions([{ product: SendbirdChat.SendbirdProduct.UIKIT_CHAT, version: APP_VERSION_STRING, platform: SendbirdChat.SendbirdPlatform === null || SendbirdChat.SendbirdPlatform === void 0 ? void 0 : SendbirdChat.SendbirdPlatform.JS }], { platform: isMobile ? SendbirdChat.DeviceOsPlatform.MOBILE_WEB : SendbirdChat.DeviceOsPlatform.WEB }, customExtensionParams);
if (sessionHandler) {
(_b = logger.info) === null || _b === void 0 ? void 0 : _b.call(logger, 'SendbirdProvider | useConnect/setupConnection/configureSession', sessionHandler);
sdk.setSessionHandler(sessionHandler);
}
}
var NO_CONTEXT_ERROR = 'No sendbird state value available. Make sure you are rendering `<SendbirdProvider>` at the top of your app.';
var useSendbird = function () {
var _a;
var store = React.useContext(SendbirdContext.SendbirdContext);
if (!store)
throw new Error(NO_CONTEXT_ERROR);
var state = SendbirdContext.shimExports.useSyncExternalStore(store.subscribe, store.getState);
/* AppInfo */
var appInfoActions = {
initMessageTemplateInfo: React.useCallback(function (_a) {
var payload = _a.payload;
store.setState(function (state) { return (updateAppInfoStore(state, {
messageTemplatesInfo: payload,
waitingTemplateKeysMap: {},
})); });
}, [store]),
upsertMessageTemplates: React.useCallback(function (_a) {
var payload = _a.payload;
var appInfoStore = state.stores.appInfoStore;
var templatesInfo = appInfoStore.messageTemplatesInfo;
if (!templatesInfo)
return state; // Not initialized. Ignore.
var waitingTemplateKeysMap = _tslib.__assign({}, appInfoStore.waitingTemplateKeysMap);
payload.forEach(function (templatesMapData) {
var key = templatesMapData.key, template = templatesMapData.template;
templatesInfo.templatesMap[key] = template;
delete waitingTemplateKeysMap[key];
});
store.setState(function (state) { return (updateAppInfoStore(state, {
waitingTemplateKeysMap: waitingTemplateKeysMap,
messageTemplatesInfo: templatesInfo,
})); });
}, [store, state.stores.appInfoStore]),
upsertWaitingTemplateKeys: React.useCallback(function (_a) {
var payload = _a.payload;
var appInfoStore = state.stores.appInfoStore;
var keys = payload.keys, requestedAt = payload.requestedAt;
var waitingTemplateKeysMap = _tslib.__assign({}, appInfoStore.waitingTemplateKeysMap);
keys.forEach(function (key) {
var _a, _b;
waitingTemplateKeysMap[key] = {
erroredMessageIds: (_b = (_a = waitingTemplateKeysMap[key]) === null || _a === void 0 ? void 0 : _a.erroredMessageIds) !== null && _b !== void 0 ? _b : [],
requestedAt: requestedAt,
};
});
store.setState(function (state) { return (updateAppInfoStore(state, {
waitingTemplateKeysMap: waitingTemplateKeysMap,
})); });
}, [store, state.stores.appInfoStore]),
markErrorWaitingTemplateKeys: React.useCallback(function (_a) {
var payload = _a.payload;
var appInfoStore = state.stores.appInfoStore;
var keys = payload.keys, messageId = payload.messageId;
var waitingTemplateKeysMap = _tslib.__assign({}, appInfoStore.waitingTemplateKeysMap);
keys.forEach(function (key) {
var waitingTemplateKeyData = waitingTemplateKeysMap[key];
if (waitingTemplateKeyData && waitingTemplateKeyData.erroredMessageIds.indexOf(messageId) === -1) {
waitingTemplateKeyData.erroredMessageIds.push(messageId);
}
});
store.setState(function (state) { return (updateAppInfoStore(state, {
waitingTemplateKeysMap: waitingTemplateKeysMap,
})); });
}, [store, state.stores.appInfoStore]),
};
/* SDK */
var sdkActions = {
setSdkLoading: React.useCallback(function (payload) {
store.setState(function (state) { return (updateSdkStore(state, {
initialized: false,
loading: payload,
})); });
}, [store]),
sdkError: React.useCallback(function () {
store.setState(function (state) { return (updateSdkStore(state, {
initialized: false,
loading: false,
error: true,
})); });
}, [store]),
initSdk: React.useCallback(function (payload) {
store.setState(function (state) { return (updateSdkStore(state, {
sdk: payload,
initialized: true,
loading: false,
error: false,
})); });
}, [store]),
resetSdk: React.useCallback(function () {
store.setState(function (state) { return (updateSdkStore(state, {
sdk: {},
initialized: false,
loading: false,
error: false,
})); });
}, [store]),
};
/* User */
var userActions = {
initUser: React.useCallback(function (payload) {
store.setState(function (state) { return (updateUserStore(state, {
initialized: true,
loading: false,
user: payload,
})); });
}, [store]),
resetUser: React.useCallback(function () {
store.setState(function (state) { return (updateUserStore(state, {
initialized: false,
loading: false,
user: {},
})); });
}, [store]),
updateUserInfo: React.useCallback(function (payload) {
store.setState(function (state) { return (updateUserStore(state, {
user: payload,
})); });
}, [store]),
};
/* Connection */
var disconnect = React.useCallback(function (_a) { return _tslib.__awaiter(void 0, [_a], void 0, function (_b) {
var sdk;
var _c;
var logger = _b.logger;
return _tslib.__generator(this, function (_d) {
switch (_d.label) {
case 0:
sdkActions.setSdkLoading(true);
sdk = state.stores.sdkStore.sdk;
if (!(sdk === null || sdk === void 0 ? void 0 : sdk.disconnectWebSocket)) return [3 /*break*/, 2];
return [4 /*yield*/, sdk.disconnectWebSocket()];
case 1:
_d.sent();
_d.label = 2;
case 2:
sdkActions.resetSdk();
userActions.resetUser();
(_c = logger.info) === null || _c === void 0 ? void 0 : _c.call(logger, 'SendbirdProvider | useSendbird/disconnect completed');
return [2 /*return*/];
}
});
}); }, [
store,
(_a = state.stores.sdkStore) === null || _a === void 0 ? void 0 : _a.sdk,
sdkActions,
userActions,
]);
var connect = React.useCallback(function (params) { return _tslib.__awaiter(void 0, void 0, void 0, function () {
var logger, userId, appId, accessToken, nickname, profileUrl, isMobile, sdkInitParams, customApiHost, customWebSocketHost, customExtensionParams, eventHandlers, initializeMessageTemplatesInfo, configureSession, initDashboardConfigs, sdk, user, error_1, sendbirdError;
var _a, _b, _c, _d, _e;
return _tslib.__generator(this, function (_f) {
switch (_f.label) {
case 0:
logger = params.logger, userId = params.userId, appId = params.appId, accessToken = params.accessToken, nickname = params.nickname, profileUrl = params.profileUrl, isMobile = params.isMobile, sdkInitParams = params.sdkInitParams, customApiHost = params.customApiHost, customWebSocketHost = params.customWebSocketHost, customExtensionParams = params.customExtensionParams, eventHandlers = params.eventHandlers, initializeMessageTemplatesInfo = params.initializeMessageTemplatesInfo, configureSession = params.configureSession, initDashboardConfigs = params.initDashboardConfigs;
// clean up previous ws connection
return [4 /*yield*/, disconnect({ logger: logger })];
case 1:
// clean up previous ws connection
_f.sent();
sdk = initSDK({
appId: appId,
customApiHost: customApiHost,
customWebSocketHost: customWebSocketHost,
sdkInitParams: sdkInitParams,
});
setupSDK(sdk, {
logger: logger,
isMobile: isMobile,
customExtensionParams: customExtensionParams,
sessionHandler: configureSession ? configureSession(sdk) : undefined,
});
sdkActions.setSdkLoading(true);
_f.label = 2;
case 2:
_f.trys.push([2, 8, , 9]);
return [4 /*yield*/, sdk.connect(userId, accessToken)];
case 3:
user = _f.sent();
userActions.initUser(user);
if (!(nickname || profileUrl)) return [3 /*break*/, 5];
return [4 /*yield*/, sdk.updateCurrentUserInfo({
nickname: nickname || user.nickname || '',
profileUrl: profileUrl || user.profileUrl,
})];
case 4:
_f.sent();
_f.label = 5;
case 5: return [4 /*yield*/, (initializeMessageTemplatesInfo === null || initializeMessageTemplatesInfo === void 0 ? void 0 : initializeMessageTemplatesInfo(sdk))];
case 6:
_f.sent();
return [4 /*yield*/, (initDashboardConfigs === null || initDashboardConfigs === void 0 ? void 0 : initDashboardConfigs(sdk))];
case 7:
_f.sent();
sdkActions.initSdk(sdk);
(_b = (_a = eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.connection) === null || _a === void 0 ? void 0 : _a.onConnected) === null || _b === void 0 ? void 0 : _b.call(_a, user);
return [3 /*break*/, 9];
case 8:
error_1 = _f.sent();
sendbirdError = error_1;
sdkActions.resetSdk();
userActions.resetUser();
(_c = logger.error) === null || _c === void 0 ? void 0 : _c.call(logger, 'SendbirdProvider | useSendbird/connect failed', sendbirdError);
(_e = (_d = eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.connection) === null || _d === void 0 ? void 0 : _d.onFailed) === null || _e === void 0 ? void 0 : _e.call(_d, sendbirdError);
return [3 /*break*/, 9];
case 9: return [2 /*return*/];
}
});
}); }, [
store,
sdkActions,
userActions,
disconnect,
]);
var actions = React.useMemo(function () { return (_tslib.__assign(_tslib.__assign(_tslib.__assign(_tslib.__assign({}, appInfoActions), sdkActions), userActions), { disconnect: disconnect, connect: connect })); }, [
appInfoActions,
sdkActions,
userActions,
disconnect,
connect,
]);
return { state: state, actions: actions };
};
exports.useSendbird = useSendbird;
//# sourceMappingURL=bundle-Bq15P9qk.js.map