sceyt-chat-react-uikit 1.7.8-beta.10 → 1.7.8-beta.11

package/index.js

@@ -9334,7 +9334,8 @@ var initialState = {
   draggedAttachments: [],
   draftIsRemoved: '',
   channelInviteKeys: {},
-  joinableChannel: null
+  joinableChannel: null,
+  channelInviteKeyAvailable: true
 };
 var channelSlice = createSlice({
   name: 'channels',
@@ -9640,6 +9641,9 @@ var channelSlice = createSlice({
     },
     setJoinableChannel: function setJoinableChannel(state, action) {
       state.joinableChannel = action.payload.channel;
+    },
+    setChannelInviteKeyAvailable: function setChannelInviteKeyAvailable(state, action) {
+      state.channelInviteKeyAvailable = action.payload.available;
     }
   },
   extraReducers: function extraReducers(builder) {
@@ -9684,7 +9688,8 @@ var _channelSlice$actions = channelSlice.actions,
   setHideChannelList = _channelSlice$actions.setHideChannelList,
   setDraftIsRemoved = _channelSlice$actions.setDraftIsRemoved,
   setChannelInviteKeys = _channelSlice$actions.setChannelInviteKeys,
-  setJoinableChannel = _channelSlice$actions.setJoinableChannel;
+  setJoinableChannel = _channelSlice$actions.setJoinableChannel,
+  setChannelInviteKeyAvailable = _channelSlice$actions.setChannelInviteKeyAvailable;
 var ChannelReducer = channelSlice.reducer;
 
 var CREATE_CHANNEL = 'CREATE_CHANNEL';
@@ -11980,7 +11985,8 @@ var initialState$2 = {
   rolesMap: {},
   restricted: {
     isRestricted: false,
-    fromChannel: false
+    fromChannel: false,
+    members: []
   },
   openInviteModal: false
 };
@@ -12069,9 +12075,11 @@ var memberSlice = createSlice({
     setActionIsRestricted: function setActionIsRestricted(state, action) {
       var _action$payload2 = action.payload,
         isRestricted = _action$payload2.isRestricted,
-        fromChannel = _action$payload2.fromChannel;
+        fromChannel = _action$payload2.fromChannel,
+        members = _action$payload2.members;
       state.restricted.isRestricted = isRestricted;
       state.restricted.fromChannel = fromChannel;
+      state.restricted.members = members;
     },
     setOpenInviteModal: function setOpenInviteModal(state, action) {
       state.openInviteModal = action.payload.open;
@@ -12587,6 +12595,11 @@ var switchChannelActionAC = function switchChannelActionAC(channel, updateActive
     }
   };
 };
+var setChannelInviteKeyAvailableAC = function setChannelInviteKeyAvailableAC(available) {
+  return setChannelInviteKeyAvailable({
+    available: available
+  });
+};
 var updateChannelAC = function updateChannelAC(channelId, config) {
   return {
     type: UPDATE_CHANNEL,
@@ -13295,10 +13308,11 @@ var setMembersHasNextAC = function setMembersHasNextAC(hasNext) {
     hasNext: hasNext
   });
 };
-var setActionIsRestrictedAC = function setActionIsRestrictedAC(isRestricted, fromChannel) {
+var setActionIsRestrictedAC = function setActionIsRestrictedAC(isRestricted, fromChannel, members) {
   return setActionIsRestricted({
     isRestricted: isRestricted,
-    fromChannel: fromChannel
+    fromChannel: fromChannel,
+    members: members || []
   });
 };
 var setOpenInviteModalAC = function setOpenInviteModalAC(open) {
@@ -16288,7 +16302,7 @@ function createChannel(action) {
           break;
         }
         _context.n = 18;
-        return effects.put(setActionIsRestrictedAC(true, false));
+        return effects.put(setActionIsRestrictedAC(true, false, null));
       case 18:
         log.error(_t, 'Error on create channel');
       case 19:
@@ -18340,13 +18354,20 @@ function getChannelByInviteKey(action) {
       case 4:
         window.history.pushState({}, '', window.location.pathname);
       case 5:
-        _context33.n = 7;
+        _context33.n = 8;
         break;
       case 6:
         _context33.p = 6;
         _t33 = _context33.v;
-        log.error('ERROR in get channel by invite key', _t33);
+        if (!(_t33.code === 1109)) {
+          _context33.n = 7;
+          break;
+        }
+        _context33.n = 7;
+        return effects.put(setChannelInviteKeyAvailableAC(false));
       case 7:
+        log.error('ERROR in get channel by invite key', _t33);
+      case 8:
         return _context33.a(2);
     }
   }, _marked33, null, [[0, 6]]);
@@ -22536,7 +22557,7 @@ function loadMoreMembers(action) {
   }, _marked2$3, null, [[0, 7, 8, 10]]);
 }
 function addMembers(action) {
-  var payload, members, channelId, channel, membersToAdd, addedMembers, membersIds, messageToSend, updateChannelData, _t3;
+  var payload, members, channelId, channel, membersToAdd, addedMembers, membersIds, messageToSend, updateChannelData, _action$payload, _t3;
   return _regenerator().w(function (_context3) {
     while (1) switch (_context3.p = _context3.n) {
       case 0:
@@ -22604,7 +22625,7 @@ function addMembers(action) {
           break;
         }
         _context3.n = 8;
-        return effects.put(setActionIsRestrictedAC(true, true));
+        return effects.put(setActionIsRestrictedAC(true, true, (action === null || action === void 0 ? void 0 : (_action$payload = action.payload) === null || _action$payload === void 0 ? void 0 : _action$payload.members) || []));
       case 8:
         log.error('error on add members... ', _t3);
       case 9:
@@ -22765,11 +22786,11 @@ function reportMember(action) {
   }, _marked7$2, null, [[1, 3]]);
 }
 function getRoles(action) {
-  var _action$payload, timeout, attempts, SceytChatClient, roles, _t8;
+  var _action$payload2, timeout, attempts, SceytChatClient, roles, _t8;
   return _regenerator().w(function (_context8) {
     while (1) switch (_context8.p = _context8.n) {
       case 0:
-        _action$payload = action.payload, timeout = _action$payload.timeout, attempts = _action$payload.attempts;
+        _action$payload2 = action.payload, timeout = _action$payload2.timeout, attempts = _action$payload2.attempts;
         _context8.p = 1;
         SceytChatClient = getClient();
         if (!(store.getState().UserReducer.connectionStatus !== CONNECTION_STATUS.CONNECTED)) {
@@ -23310,6 +23331,9 @@ var channelInviteKeysSelector = function channelInviteKeysSelector(store) {
 var joinableChannelSelector = function joinableChannelSelector(store) {
   return store.ChannelReducer.joinableChannel;
 };
+var channelInviteKeyAvailableSelector = function channelInviteKeyAvailableSelector(store) {
+  return store.ChannelReducer.channelInviteKeyAvailable;
+};
 
 var activeChannelMembersSelector = function activeChannelMembersSelector(store) {
   return store.MembersReducer.activeChannelMembers;
@@ -23899,7 +23923,7 @@ var ActionRestrictedPopup = function ActionRestrictedPopup(_ref) {
     textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
     linkColor = _useColor[THEME_COLORS.LINK_COLOR];
   var handleClose = function handleClose() {
-    dispatch(setActionIsRestrictedAC(false, false));
+    dispatch(setActionIsRestrictedAC(false, false, null));
   };
   var handleInvite = function handleInvite() {
     dispatch(setOpenInviteModalAC(true));
@@ -23919,23 +23943,64 @@ var ActionRestrictedPopup = function ActionRestrictedPopup(_ref) {
   }), /*#__PURE__*/React__default.createElement(PopupName, {
     color: textPrimary,
     marginBottom: '20px'
-  }, "Privacy note"), /*#__PURE__*/React__default.createElement(PopupDescription, {
+  }, fromChannel ? 'Privacy note' : "Can't create group"), /*#__PURE__*/React__default.createElement(PopupDescription, {
     color: textPrimary,
     highlightColor: linkColor
-  }, "Unable to add this member. Try inviting them directly to the group.")), /*#__PURE__*/React__default.createElement(PopupFooter, {
+  }, fromChannel ? 'Couldn’t add the user. Please invite them directly instead.' : 'Not everyone can be added to this group.')), /*#__PURE__*/React__default.createElement(PopupFooter, {
     backgroundColor: surface1
-  }, /*#__PURE__*/React__default.createElement(Button, {
+  }, fromChannel && (/*#__PURE__*/React__default.createElement(Button, {
     type: 'button',
     color: textPrimary,
     backgroundColor: 'transparent',
     onClick: handleClose
-  }, "Cancel"), fromChannel && (/*#__PURE__*/React__default.createElement(Button, {
+  }, "Cancel")), /*#__PURE__*/React__default.createElement(Button, {
+    type: 'button',
+    backgroundColor: accentColor,
+    color: textOnPrimary,
+    borderRadius: '8px',
+    onClick: fromChannel ? handleInvite : handleClose
+  }, fromChannel ? 'Invite' : 'Cancel'))));
+};
+
+var UnavailableInviteKeyPopup = function UnavailableInviteKeyPopup() {
+  var dispatch = useDispatch();
+  var _useColor = useColors(),
+    background = _useColor[THEME_COLORS.BACKGROUND],
+    textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
+    surface1 = _useColor[THEME_COLORS.SURFACE_1],
+    iconPrimary = _useColor[THEME_COLORS.ICON_PRIMARY],
+    accentColor = _useColor[THEME_COLORS.ACCENT],
+    textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
+    linkColor = _useColor[THEME_COLORS.LINK_COLOR];
+  var handleClose = function handleClose() {
+    dispatch(setChannelInviteKeyAvailableAC(true));
+  };
+  return /*#__PURE__*/React__default.createElement(PopupContainer, null, /*#__PURE__*/React__default.createElement(Popup, {
+    backgroundColor: background,
+    maxWidth: '520px',
+    minWidth: '520px',
+    padding: '0'
+  }, /*#__PURE__*/React__default.createElement(PopupBody, {
+    paddingH: '24px',
+    paddingV: '24px'
+  }, /*#__PURE__*/React__default.createElement(CloseIcon, {
+    color: iconPrimary,
+    onClick: handleClose
+  }), /*#__PURE__*/React__default.createElement(PopupName, {
+    color: textPrimary,
+    marginBottom: '20px'
+  }, "Failed to join"), /*#__PURE__*/React__default.createElement(PopupDescription, {
+    color: textPrimary,
+    highlightColor: linkColor
+  }, "You can't join the group or community as the invite link was reset.")), /*#__PURE__*/React__default.createElement(PopupFooter, {
+    backgroundColor: surface1
+  }, /*#__PURE__*/React__default.createElement(Button, {
     type: 'button',
     backgroundColor: accentColor,
     color: textOnPrimary,
     borderRadius: '8px',
-    onClick: handleInvite
-  }, "Invite")))));
+    onClick: handleClose
+  }, "Close"))));
 };
 
 var _templateObject$5, _templateObject2$4, _templateObject3$4;
@@ -23982,6 +24047,7 @@ var SceytChat = function SceytChat(_ref) {
     setSceytChatClient = _useState[1];
   var connectionStatus = useSelector(connectionStatusSelector, reactRedux.shallowEqual);
   var restricted = useSelector(restrictedSelector, reactRedux.shallowEqual);
+  var channelInviteKeyAvailable = useSelector(channelInviteKeyAvailableSelector, reactRedux.shallowEqual);
   var _useState2 = React.useState(true),
     tabIsActive = _useState2[0],
     setTabIsActive = _useState2[1];
@@ -24228,7 +24294,7 @@ var SceytChat = function SceytChat(_ref) {
     chatMinWidth: chatMinWidth
   }, children, embeddedJoinGroupPopup && joinPopup && /*#__PURE__*/React__default.createElement(EmbeddedPopupWrapper, null, joinPopup), (restricted === null || restricted === void 0 ? void 0 : restricted.isRestricted) && /*#__PURE__*/React__default.createElement(ActionRestrictedPopup, {
     fromChannel: restricted === null || restricted === void 0 ? void 0 : restricted.fromChannel
-  }))) : '', !embeddedJoinGroupPopup && joinPopup);
+  }), !channelInviteKeyAvailable && /*#__PURE__*/React__default.createElement(UnavailableInviteKeyPopup, null))) : '', !embeddedJoinGroupPopup && joinPopup);
 };
 var Container$2 = styled__default.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  height: 100vh;\n"])));
 var ChatContainer = styled__default.div(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  height: 100%;\n  max-height: 100vh;\n  min-width: ", ";\n  background-color: ", ";\n  position: relative;\n\n  /* Global highlighted background styles */\n  ::selection {\n    background-color: ", ";\n  }\n\n  ::-moz-selection {\n    background-color: ", ";\n  }\n\n  /* For text selection highlighting */\n  *::selection {\n    background-color: ", ";\n  }\n\n  *::-moz-selection {\n    background-color: ", ";\n  }\n"])), function (props) {

package/index.modern.js

@@ -9333,7 +9333,8 @@ var initialState = {
   draggedAttachments: [],
   draftIsRemoved: '',
   channelInviteKeys: {},
-  joinableChannel: null
+  joinableChannel: null,
+  channelInviteKeyAvailable: true
 };
 var channelSlice = createSlice({
   name: 'channels',
@@ -9639,6 +9640,9 @@ var channelSlice = createSlice({
     },
     setJoinableChannel: function setJoinableChannel(state, action) {
       state.joinableChannel = action.payload.channel;
+    },
+    setChannelInviteKeyAvailable: function setChannelInviteKeyAvailable(state, action) {
+      state.channelInviteKeyAvailable = action.payload.available;
     }
   },
   extraReducers: function extraReducers(builder) {
@@ -9683,7 +9687,8 @@ var _channelSlice$actions = channelSlice.actions,
   setHideChannelList = _channelSlice$actions.setHideChannelList,
   setDraftIsRemoved = _channelSlice$actions.setDraftIsRemoved,
   setChannelInviteKeys = _channelSlice$actions.setChannelInviteKeys,
-  setJoinableChannel = _channelSlice$actions.setJoinableChannel;
+  setJoinableChannel = _channelSlice$actions.setJoinableChannel,
+  setChannelInviteKeyAvailable = _channelSlice$actions.setChannelInviteKeyAvailable;
 var ChannelReducer = channelSlice.reducer;
 
 var CREATE_CHANNEL = 'CREATE_CHANNEL';
@@ -11979,7 +11984,8 @@ var initialState$2 = {
   rolesMap: {},
   restricted: {
     isRestricted: false,
-    fromChannel: false
+    fromChannel: false,
+    members: []
   },
   openInviteModal: false
 };
@@ -12068,9 +12074,11 @@ var memberSlice = createSlice({
     setActionIsRestricted: function setActionIsRestricted(state, action) {
       var _action$payload2 = action.payload,
         isRestricted = _action$payload2.isRestricted,
-        fromChannel = _action$payload2.fromChannel;
+        fromChannel = _action$payload2.fromChannel,
+        members = _action$payload2.members;
       state.restricted.isRestricted = isRestricted;
       state.restricted.fromChannel = fromChannel;
+      state.restricted.members = members;
     },
     setOpenInviteModal: function setOpenInviteModal(state, action) {
       state.openInviteModal = action.payload.open;
@@ -12586,6 +12594,11 @@ var switchChannelActionAC = function switchChannelActionAC(channel, updateActive
     }
   };
 };
+var setChannelInviteKeyAvailableAC = function setChannelInviteKeyAvailableAC(available) {
+  return setChannelInviteKeyAvailable({
+    available: available
+  });
+};
 var updateChannelAC = function updateChannelAC(channelId, config) {
   return {
     type: UPDATE_CHANNEL,
@@ -13294,10 +13307,11 @@ var setMembersHasNextAC = function setMembersHasNextAC(hasNext) {
     hasNext: hasNext
   });
 };
-var setActionIsRestrictedAC = function setActionIsRestrictedAC(isRestricted, fromChannel) {
+var setActionIsRestrictedAC = function setActionIsRestrictedAC(isRestricted, fromChannel, members) {
   return setActionIsRestricted({
     isRestricted: isRestricted,
-    fromChannel: fromChannel
+    fromChannel: fromChannel,
+    members: members || []
   });
 };
 var setOpenInviteModalAC = function setOpenInviteModalAC(open) {
@@ -16287,7 +16301,7 @@ function createChannel(action) {
           break;
         }
         _context.n = 18;
-        return put(setActionIsRestrictedAC(true, false));
+        return put(setActionIsRestrictedAC(true, false, null));
       case 18:
         log.error(_t, 'Error on create channel');
       case 19:
@@ -18339,13 +18353,20 @@ function getChannelByInviteKey(action) {
       case 4:
         window.history.pushState({}, '', window.location.pathname);
       case 5:
-        _context33.n = 7;
+        _context33.n = 8;
         break;
       case 6:
         _context33.p = 6;
         _t33 = _context33.v;
-        log.error('ERROR in get channel by invite key', _t33);
+        if (!(_t33.code === 1109)) {
+          _context33.n = 7;
+          break;
+        }
+        _context33.n = 7;
+        return put(setChannelInviteKeyAvailableAC(false));
       case 7:
+        log.error('ERROR in get channel by invite key', _t33);
+      case 8:
         return _context33.a(2);
     }
   }, _marked33, null, [[0, 6]]);
@@ -22535,7 +22556,7 @@ function loadMoreMembers(action) {
   }, _marked2$3, null, [[0, 7, 8, 10]]);
 }
 function addMembers(action) {
-  var payload, members, channelId, channel, membersToAdd, addedMembers, membersIds, messageToSend, updateChannelData, _t3;
+  var payload, members, channelId, channel, membersToAdd, addedMembers, membersIds, messageToSend, updateChannelData, _action$payload, _t3;
   return _regenerator().w(function (_context3) {
     while (1) switch (_context3.p = _context3.n) {
       case 0:
@@ -22603,7 +22624,7 @@ function addMembers(action) {
           break;
         }
         _context3.n = 8;
-        return put(setActionIsRestrictedAC(true, true));
+        return put(setActionIsRestrictedAC(true, true, (action === null || action === void 0 ? void 0 : (_action$payload = action.payload) === null || _action$payload === void 0 ? void 0 : _action$payload.members) || []));
       case 8:
         log.error('error on add members... ', _t3);
       case 9:
@@ -22764,11 +22785,11 @@ function reportMember(action) {
   }, _marked7$2, null, [[1, 3]]);
 }
 function getRoles(action) {
-  var _action$payload, timeout, attempts, SceytChatClient, roles, _t8;
+  var _action$payload2, timeout, attempts, SceytChatClient, roles, _t8;
   return _regenerator().w(function (_context8) {
     while (1) switch (_context8.p = _context8.n) {
       case 0:
-        _action$payload = action.payload, timeout = _action$payload.timeout, attempts = _action$payload.attempts;
+        _action$payload2 = action.payload, timeout = _action$payload2.timeout, attempts = _action$payload2.attempts;
         _context8.p = 1;
         SceytChatClient = getClient();
         if (!(store.getState().UserReducer.connectionStatus !== CONNECTION_STATUS.CONNECTED)) {
@@ -23309,6 +23330,9 @@ var channelInviteKeysSelector = function channelInviteKeysSelector(store) {
 var joinableChannelSelector = function joinableChannelSelector(store) {
   return store.ChannelReducer.joinableChannel;
 };
+var channelInviteKeyAvailableSelector = function channelInviteKeyAvailableSelector(store) {
+  return store.ChannelReducer.channelInviteKeyAvailable;
+};
 
 var activeChannelMembersSelector = function activeChannelMembersSelector(store) {
   return store.MembersReducer.activeChannelMembers;
@@ -23898,7 +23922,7 @@ var ActionRestrictedPopup = function ActionRestrictedPopup(_ref) {
     textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
     linkColor = _useColor[THEME_COLORS.LINK_COLOR];
   var handleClose = function handleClose() {
-    dispatch(setActionIsRestrictedAC(false, false));
+    dispatch(setActionIsRestrictedAC(false, false, null));
   };
   var handleInvite = function handleInvite() {
     dispatch(setOpenInviteModalAC(true));
@@ -23918,23 +23942,64 @@ var ActionRestrictedPopup = function ActionRestrictedPopup(_ref) {
   }), /*#__PURE__*/React__default.createElement(PopupName, {
     color: textPrimary,
     marginBottom: '20px'
-  }, "Privacy note"), /*#__PURE__*/React__default.createElement(PopupDescription, {
+  }, fromChannel ? 'Privacy note' : "Can't create group"), /*#__PURE__*/React__default.createElement(PopupDescription, {
     color: textPrimary,
     highlightColor: linkColor
-  }, "Unable to add this member. Try inviting them directly to the group.")), /*#__PURE__*/React__default.createElement(PopupFooter, {
+  }, fromChannel ? 'Couldn’t add the user. Please invite them directly instead.' : 'Not everyone can be added to this group.')), /*#__PURE__*/React__default.createElement(PopupFooter, {
     backgroundColor: surface1
-  }, /*#__PURE__*/React__default.createElement(Button, {
+  }, fromChannel && (/*#__PURE__*/React__default.createElement(Button, {
     type: 'button',
     color: textPrimary,
     backgroundColor: 'transparent',
     onClick: handleClose
-  }, "Cancel"), fromChannel && (/*#__PURE__*/React__default.createElement(Button, {
+  }, "Cancel")), /*#__PURE__*/React__default.createElement(Button, {
+    type: 'button',
+    backgroundColor: accentColor,
+    color: textOnPrimary,
+    borderRadius: '8px',
+    onClick: fromChannel ? handleInvite : handleClose
+  }, fromChannel ? 'Invite' : 'Cancel'))));
+};
+
+var UnavailableInviteKeyPopup = function UnavailableInviteKeyPopup() {
+  var dispatch = useDispatch();
+  var _useColor = useColors(),
+    background = _useColor[THEME_COLORS.BACKGROUND],
+    textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
+    surface1 = _useColor[THEME_COLORS.SURFACE_1],
+    iconPrimary = _useColor[THEME_COLORS.ICON_PRIMARY],
+    accentColor = _useColor[THEME_COLORS.ACCENT],
+    textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
+    linkColor = _useColor[THEME_COLORS.LINK_COLOR];
+  var handleClose = function handleClose() {
+    dispatch(setChannelInviteKeyAvailableAC(true));
+  };
+  return /*#__PURE__*/React__default.createElement(PopupContainer, null, /*#__PURE__*/React__default.createElement(Popup, {
+    backgroundColor: background,
+    maxWidth: '520px',
+    minWidth: '520px',
+    padding: '0'
+  }, /*#__PURE__*/React__default.createElement(PopupBody, {
+    paddingH: '24px',
+    paddingV: '24px'
+  }, /*#__PURE__*/React__default.createElement(CloseIcon, {
+    color: iconPrimary,
+    onClick: handleClose
+  }), /*#__PURE__*/React__default.createElement(PopupName, {
+    color: textPrimary,
+    marginBottom: '20px'
+  }, "Failed to join"), /*#__PURE__*/React__default.createElement(PopupDescription, {
+    color: textPrimary,
+    highlightColor: linkColor
+  }, "You can't join the group or community as the invite link was reset.")), /*#__PURE__*/React__default.createElement(PopupFooter, {
+    backgroundColor: surface1
+  }, /*#__PURE__*/React__default.createElement(Button, {
     type: 'button',
     backgroundColor: accentColor,
     color: textOnPrimary,
     borderRadius: '8px',
-    onClick: handleInvite
-  }, "Invite")))));
+    onClick: handleClose
+  }, "Close"))));
 };
 
 var _templateObject$5, _templateObject2$4, _templateObject3$4;
@@ -23981,6 +24046,7 @@ var SceytChat = function SceytChat(_ref) {
     setSceytChatClient = _useState[1];
   var connectionStatus = useSelector(connectionStatusSelector, shallowEqual);
   var restricted = useSelector(restrictedSelector, shallowEqual);
+  var channelInviteKeyAvailable = useSelector(channelInviteKeyAvailableSelector, shallowEqual);
   var _useState2 = useState(true),
     tabIsActive = _useState2[0],
     setTabIsActive = _useState2[1];
@@ -24227,7 +24293,7 @@ var SceytChat = function SceytChat(_ref) {
     chatMinWidth: chatMinWidth
   }, children, embeddedJoinGroupPopup && joinPopup && /*#__PURE__*/React__default.createElement(EmbeddedPopupWrapper, null, joinPopup), (restricted === null || restricted === void 0 ? void 0 : restricted.isRestricted) && /*#__PURE__*/React__default.createElement(ActionRestrictedPopup, {
     fromChannel: restricted === null || restricted === void 0 ? void 0 : restricted.fromChannel
-  }))) : '', !embeddedJoinGroupPopup && joinPopup);
+  }), !channelInviteKeyAvailable && /*#__PURE__*/React__default.createElement(UnavailableInviteKeyPopup, null))) : '', !embeddedJoinGroupPopup && joinPopup);
 };
 var Container$2 = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  height: 100vh;\n"])));
 var ChatContainer = styled.div(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  height: 100%;\n  max-height: 100vh;\n  min-width: ", ";\n  background-color: ", ";\n  position: relative;\n\n  /* Global highlighted background styles */\n  ::selection {\n    background-color: ", ";\n  }\n\n  ::-moz-selection {\n    background-color: ", ";\n  }\n\n  /* For text selection highlighting */\n  *::selection {\n    background-color: ", ";\n  }\n\n  *::-moz-selection {\n    background-color: ", ";\n  }\n"])), function (props) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sceyt-chat-react-uikit",
-  "version": "1.7.8-beta.10",
+  "version": "1.7.8-beta.11",
   "description": "Interactive React UI Components for Sceyt Chat.",
   "author": "Sceyt",
   "license": "MIT",