@samparkchat/sampark-web-chat 0.1.6 → 0.1.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/package.json +1 -1
  2. package/sampark/sampark-chat/components/Actions/GroupMessageActions.d.ts +5 -0
  3. package/sampark/sampark-chat/components/Actions/GroupMessageActions.js +49 -33
  4. package/sampark/sampark-chat/components/Actions/MessageActions.d.ts +4 -0
  5. package/sampark/sampark-chat/components/Actions/MessageActions.js +69 -40
  6. package/sampark/sampark-chat/components/AttachmentGroupFileSharing.js +7 -0
  7. package/sampark/sampark-chat/components/Headers/ChatHeader.d.ts +3 -0
  8. package/sampark/sampark-chat/components/Headers/ChatHeader.js +39 -6
  9. package/sampark/sampark-chat/components/Headers/GroupChatHeader.d.ts +2 -0
  10. package/sampark/sampark-chat/components/Headers/GroupChatHeader.js +8 -3
  11. package/sampark/sampark-chat/components/Headers/HeaderPanel/GroupList.js +150 -82
  12. package/sampark/sampark-chat/components/bottomsheets/GroupBottomSheet.d.ts +2 -0
  13. package/sampark/sampark-chat/components/bottomsheets/GroupBottomSheet.js +47 -23
  14. package/sampark/sampark-chat/components/lists/CommonList.d.ts +1 -0
  15. package/sampark/sampark-chat/components/lists/CommonList.js +29 -6
  16. package/sampark/sampark-chat/components/lists/UserInfo.d.ts +2 -0
  17. package/sampark/sampark-chat/components/lists/UserInfo.js +16 -12
  18. package/sampark/sampark-chat/components/lists/ViewParticipents.d.ts +2 -0
  19. package/sampark/sampark-chat/components/lists/ViewParticipents.js +331 -47
  20. package/sampark/sampark-chat/components/modals/MessageInfoModal.d.ts +26 -0
  21. package/sampark/sampark-chat/components/modals/MessageInfoModal.js +177 -0
  22. package/sampark/sampark-chat/components/modals/UnbanRequestModal.js +5 -4
  23. package/sampark/sampark-chat/models/ConfirmActionModal.d.ts +1 -0
  24. package/sampark/sampark-chat/models/ConfirmActionModal.js +2 -2
  25. package/sampark/sampark-chat/screens/PeerChatScreen.d.ts +2 -0
  26. package/sampark/sampark-chat/screens/PeerChatScreen.js +152 -79
  27. package/sampark/sampark-chat/screens/SamparkChatsScreen.js +201 -62
  28. package/sampark/sampark-chat/screens/groupChatScreen.d.ts +2 -0
  29. package/sampark/sampark-chat/screens/groupChatScreen.js +231 -53
  30. package/sampark/sampark-chat/sdk/client/Groupchat.d.ts +33 -2
  31. package/sampark/sampark-chat/sdk/client/Groupchat.js +189 -15
  32. package/sampark/sampark-chat/sdk/interface/SamparkGroupChatService.d.ts +6 -0
  33. package/sampark/sampark-chat/sdk/types/DirectUnbanParticipantRequest.d.ts +12 -0
  34. package/sampark/sampark-chat/sdk/types/DirectUnbanParticipantRequest.js +15 -0
  35. package/sampark/sampark-chat/sdk/types/UpdateGroupStatus.d.ts +3 -1
  36. package/sampark/sampark-chat/sdk/types/UpdateGroupStatus.js +4 -2
  37. package/sampark/sampark-chat/services/Common.d.ts +4 -0
  38. package/sampark/sampark-chat/services/Common.js +17 -0
  39. package/sampark/sampark-chat/theme/icons.d.ts +5 -0
  40. package/sampark/sampark-chat/theme/icons.js +2 -1
  41. package/sampark/sampark-chat/types/ChatSettings.d.ts +23 -0
  42. package/sampark/sampark-chat/types/ChatSettings.js +45 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@samparkchat/sampark-web-chat",
3
- "version": "0.1.6",
3
+ "version": "0.1.7",
4
4
  "main": "sampark/sampark-web-chat/index.js",
5
5
  "types": "sampark/sampark-web-chat/index.d.ts",
6
6
  "private": false,
package/sampark/sampark-chat/components/Actions/GroupMessageActions.d.ts CHANGED
@@ -16,11 +16,16 @@ interface GroupMessageActionsProps {
16
16
  onEditClick?: () => void;
17
17
  onReplyClick?: () => void;
18
18
  onThreadClick?: () => void;
19
+ onInfoClick?: () => void;
19
20
  allowReact?: boolean;
20
21
  visible?: boolean;
21
22
  canDelete?: boolean;
22
23
  onDeleteClick?: () => void;
23
24
  messageType?: string;
25
+ is_thread?: boolean;
26
+ isQuoteReplyDisabled?: boolean;
27
+ isMessageReactionDisabled?: boolean;
28
+ isDeleteChatDisabled?: boolean;
24
29
  }
25
30
  declare const GroupMessageActions: React.FC<GroupMessageActionsProps>;
26
31
  export default GroupMessageActions;
package/sampark/sampark-chat/components/Actions/GroupMessageActions.js CHANGED
@@ -15,19 +15,20 @@ import EmojiPicker from 'emoji-picker-react';
15
15
  import CustomIcons, { AppIcons } from '../../theme/icons';
16
16
  import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
17
17
  import colors from '../../theme/colors';
18
+ import Tooltip from '../Tooltip';
18
19
  var GroupMessageActions = function (_a) {
19
20
  var _b;
20
- var showEmojiPicker = _a.showEmojiPicker, showMenu = _a.showMenu, onEmojiClick = _a.onEmojiClick, onMenuClick = _a.onMenuClick, onEmojiSelect = _a.onEmojiSelect, onCloseEmojiPicker = _a.onCloseEmojiPicker, onCloseMenu = _a.onCloseMenu, message = _a.message, _c = _a.position, position = _c === void 0 ? 'right' : _c, _d = _a.inline, inline = _d === void 0 ? false : _d, _e = _a.canEdit, canEdit = _e === void 0 ? false : _e, onEditClick = _a.onEditClick, onReplyClick = _a.onReplyClick, onThreadClick = _a.onThreadClick, _f = _a.allowReact, allowReact = _f === void 0 ? true : _f, _g = _a.visible, visible = _g === void 0 ? false : _g, _h = _a.canDelete, canDelete = _h === void 0 ? false : _h, onDeleteClick = _a.onDeleteClick, _j = _a.messageType, messageType = _j === void 0 ? 'text' : _j;
21
- var _k = React.useState(false), copied = _k[0], setCopied = _k[1];
22
- var _l = React.useState(false), isHovered = _l[0], setIsHovered = _l[1];
21
+ var showEmojiPicker = _a.showEmojiPicker, showMenu = _a.showMenu, onEmojiClick = _a.onEmojiClick, onMenuClick = _a.onMenuClick, onEmojiSelect = _a.onEmojiSelect, onCloseEmojiPicker = _a.onCloseEmojiPicker, onCloseMenu = _a.onCloseMenu, message = _a.message, _c = _a.position, position = _c === void 0 ? 'right' : _c, _d = _a.inline, inline = _d === void 0 ? false : _d, _e = _a.canEdit, canEdit = _e === void 0 ? false : _e, onEditClick = _a.onEditClick, onReplyClick = _a.onReplyClick, onThreadClick = _a.onThreadClick, onInfoClick = _a.onInfoClick, _f = _a.allowReact, allowReact = _f === void 0 ? true : _f, _g = _a.visible, visible = _g === void 0 ? false : _g, _h = _a.canDelete, canDelete = _h === void 0 ? false : _h, onDeleteClick = _a.onDeleteClick, _j = _a.messageType, messageType = _j === void 0 ? 'text' : _j, _k = _a.is_thread, is_thread = _k === void 0 ? true : _k, _l = _a.isQuoteReplyDisabled, isQuoteReplyDisabled = _l === void 0 ? false : _l, _m = _a.isMessageReactionDisabled, isMessageReactionDisabled = _m === void 0 ? false : _m, _o = _a.isDeleteChatDisabled, isDeleteChatDisabled = _o === void 0 ? false : _o;
22
+ var _p = React.useState(false), copied = _p[0], setCopied = _p[1];
23
+ var _q = React.useState(false), isHovered = _q[0], setIsHovered = _q[1];
23
24
  var containerRef = React.useRef(null);
24
- var _m = React.useState('above'), menuPlacement = _m[0], setMenuPlacement = _m[1];
25
- var _o = React.useState('right'), menuAlign = _o[0], setMenuAlign = _o[1];
26
- var _p = React.useState(null), anchorRect = _p[0], setAnchorRect = _p[1];
25
+ var _r = React.useState('above'), menuPlacement = _r[0], setMenuPlacement = _r[1];
26
+ var _s = React.useState('right'), menuAlign = _s[0], setMenuAlign = _s[1];
27
+ var _t = React.useState(null), anchorRect = _t[0], setAnchorRect = _t[1];
27
28
  var menuRef = React.useRef(null);
28
29
  var emojiRef = React.useRef(null);
29
- var _q = React.useState(null), menuPortalStyle = _q[0], setMenuPortalStyle = _q[1];
30
- var _r = React.useState(null), emojiPortalStyle = _r[0], setEmojiPortalStyle = _r[1];
30
+ var _u = React.useState(null), menuPortalStyle = _u[0], setMenuPortalStyle = _u[1];
31
+ var _v = React.useState(null), emojiPortalStyle = _v[0], setEmojiPortalStyle = _v[1];
31
32
  var handleCopy = function () {
32
33
  if (navigator && navigator.clipboard) {
33
34
  navigator.clipboard.writeText(message);
@@ -138,7 +139,7 @@ var GroupMessageActions = function (_a) {
138
139
  setMenuPortalStyle(computeStyle(false));
139
140
  setEmojiPortalStyle(computeStyle(true));
140
141
  }, [anchorRect, menuPlacement, menuAlign, showMenu, showEmojiPicker]);
141
- var emojiPortalEl = (emojiPortalStyle && showEmojiPicker && allowReact) ? ReactDOM.createPortal(React.createElement("div", { ref: emojiRef, className: "emoji-picker-container", onClick: function (e) { return e.stopPropagation(); }, style: __assign(__assign({}, emojiPortalStyle), { borderRadius: 12, boxShadow: '0 4px 20px rgba(0,0,0,0.15)', border: '1px solid #e0e0e0', overflow: 'hidden' }) },
142
+ var emojiPortalEl = (emojiPortalStyle && showEmojiPicker && allowReact && !isMessageReactionDisabled) ? ReactDOM.createPortal(React.createElement("div", { ref: emojiRef, className: "emoji-picker-container", onClick: function (e) { return e.stopPropagation(); }, style: __assign(__assign({}, emojiPortalStyle), { borderRadius: 12, boxShadow: '0 4px 20px rgba(0,0,0,0.15)', border: '1px solid #e0e0e0', overflow: 'hidden' }) },
142
143
  React.createElement(EmojiPicker, { onEmojiClick: function (emojiData) {
143
144
  var _a;
144
145
  var emojiId = emojiData.unified;
@@ -147,23 +148,33 @@ var GroupMessageActions = function (_a) {
147
148
  onEmojiSelect({ emojiId: emojiId, emojiType: emojiType });
148
149
  }, width: 280, height: 300, previewConfig: { showPreview: false }, searchDisabled: true })), document.body) : null;
149
150
  var menuPortalEl = (menuPortalStyle && showMenu) ? ReactDOM.createPortal(React.createElement("div", { ref: menuRef, className: "message-menu-container", style: __assign(__assign({}, menuPortalStyle), { background: '#fff', borderRadius: 10, boxShadow: '0 8px 24px rgba(0,0,0,0.10)', border: '1px solid rgba(15,23,42,0.06)', minWidth: 150, padding: '6px 0', display: 'flex', flexDirection: 'column', gap: 0, animation: 'fadeInScale 0.12s ease-out', overflow: 'hidden' }) },
150
- React.createElement("button", { style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: '#444', cursor: 'pointer' }, onClick: function () { onCloseMenu(); onThreadClick === null || onThreadClick === void 0 ? void 0 : onThreadClick(); } },
151
+ is_thread ? (React.createElement("button", { style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: '#444', cursor: 'pointer' }, onClick: function () { onCloseMenu(); onThreadClick === null || onThreadClick === void 0 ? void 0 : onThreadClick(); } },
151
152
  React.createElement(FontAwesomeIcon, { icon: AppIcons.faCommentDots.icon, style: { fontSize: AppIcons.faCommentDots.size, color: AppIcons.faCommentDots.color }, "aria-hidden": true }),
152
- "Thread"),
153
+ "Thread")) : (React.createElement(Tooltip, { content: "this is disabled" },
154
+ React.createElement("div", { style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: '#444', cursor: 'not-allowed', opacity: 0.5 } },
155
+ React.createElement(FontAwesomeIcon, { icon: AppIcons.faCommentDots.icon, style: { fontSize: AppIcons.faCommentDots.size, color: AppIcons.faCommentDots.color }, "aria-hidden": true }),
156
+ "Thread"))),
153
157
  messageType === 'text' && React.createElement("button", { style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: copied ? '#007bff' : '#444', cursor: 'pointer', position: 'relative' }, onClick: handleCopy },
154
158
  React.createElement(FontAwesomeIcon, { icon: AppIcons.faCopy.icon, style: { fontSize: AppIcons.faCopy.size, color: AppIcons.faCopy.color }, "aria-hidden": true }),
155
159
  copied ? 'Copied' : 'Copy'),
156
160
  canEdit && messageType === 'text' && (React.createElement("button", { style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: '#444', cursor: 'pointer' }, onClick: function () { onCloseMenu(); onEditClick && onEditClick(); } },
157
161
  React.createElement(FontAwesomeIcon, { icon: AppIcons.faPenToSquare.icon, style: { fontSize: AppIcons.faPenToSquare.size, color: AppIcons.faPenToSquare.color }, "aria-hidden": true }),
158
162
  "Edit")),
159
- React.createElement("button", { style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: '#444', cursor: 'pointer' }, onClick: function () { onCloseMenu(); onReplyClick === null || onReplyClick === void 0 ? void 0 : onReplyClick(); } },
160
- React.createElement(FontAwesomeIcon, { icon: AppIcons.faReply.icon, style: { fontSize: AppIcons.faReply.size, color: AppIcons.faReply.color }, "aria-hidden": true }),
161
- "Reply"),
162
- canDelete && (React.createElement("button", { style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: '#444', cursor: 'pointer' }, onClick: function () { onCloseMenu(); onDeleteClick && onDeleteClick(); } },
163
- React.createElement(FontAwesomeIcon, { icon: AppIcons.DeleteChat.icon, style: { fontSize: AppIcons.DeleteChat.size, color: AppIcons.DeleteChat.color }, "aria-hidden": true }),
164
- "Delete"))), document.body) : null;
163
+ React.createElement(Tooltip, { content: isQuoteReplyDisabled ? "Reply is disabled by admin" : "", position: "bottom", disabled: !isQuoteReplyDisabled },
164
+ React.createElement("button", { className: isQuoteReplyDisabled ? "disabled-reply" : "", style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: '#444', cursor: isQuoteReplyDisabled ? 'not-allowed' : 'pointer',
165
+ opacity: isQuoteReplyDisabled ? 0.5 : 1,
166
+ pointerEvents: isQuoteReplyDisabled ? 'none' : 'auto' }, onClick: isQuoteReplyDisabled ? undefined : function () { onCloseMenu(); onReplyClick === null || onReplyClick === void 0 ? void 0 : onReplyClick(); } },
167
+ React.createElement(FontAwesomeIcon, { icon: AppIcons.faReply.icon, style: { fontSize: AppIcons.faReply.size, color: AppIcons.faReply.color }, "aria-hidden": true }),
168
+ "Reply")),
169
+ onInfoClick && (React.createElement("button", { style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: '#444', cursor: 'pointer' }, onClick: function () { onCloseMenu(); onInfoClick(); } },
170
+ React.createElement(FontAwesomeIcon, { icon: AppIcons.faMessage.icon, style: { fontSize: AppIcons.faMessage.size, color: AppIcons.faMessage.color }, "aria-hidden": true }),
171
+ "Info")),
172
+ canDelete && (React.createElement(Tooltip, { content: isDeleteChatDisabled ? "this is disabled by admin" : "", position: "bottom", disabled: !isDeleteChatDisabled },
173
+ React.createElement("button", { style: { background: 'none', border: 'none', width: '100%', display: 'flex', alignItems: 'center', gap: '12px', padding: '10px 16px', fontSize: '14px', color: '#444', cursor: isDeleteChatDisabled ? 'not-allowed' : 'pointer', opacity: isDeleteChatDisabled ? 0.5 : 1, pointerEvents: isDeleteChatDisabled ? 'none' : 'auto' }, onClick: isDeleteChatDisabled ? undefined : function () { onCloseMenu(); onDeleteClick && onDeleteClick(); } },
174
+ React.createElement(FontAwesomeIcon, { icon: AppIcons.DeleteChat.icon, style: { fontSize: AppIcons.DeleteChat.size, color: AppIcons.DeleteChat.color }, "aria-hidden": true }),
175
+ "Delete")))), document.body) : null;
165
176
  return (React.createElement(React.Fragment, null,
166
- React.createElement("style", null, "\n @keyframes fadeInScale {\n from { opacity: 0; transform: scale(0.98); }\n to { opacity: 1; transform: scale(1); }\n }\n .message-menu-container button:hover { background: rgba(0,0,0,0.04); }\n .message-menu-container i { width: 18px; text-align: center; }\n /* Prevent vertical movement on hover; keep icons visually interactive without shifting layout */\n .chat-message-icons span button:hover { transform: none; }\n "),
177
+ React.createElement("style", null, "\n @keyframes fadeInScale {\n from { opacity: 0; transform: scale(0.98); }\n to { opacity: 1; transform: scale(1); }\n }\n .message-menu-container button:hover:not(.disabled-reply) { background: rgba(0,0,0,0.04); }\n .message-menu-container i { width: 18px; text-align: center; }\n /* Prevent vertical movement on hover; keep icons visually interactive without shifting layout */\n .chat-message-icons span button:hover { transform: none; }\n "),
167
178
  React.createElement("div", { ref: containerRef, className: "chat-message-icons", style: (_b = {
168
179
  display: 'flex',
169
180
  flexDirection: 'row',
@@ -191,21 +202,26 @@ var GroupMessageActions = function (_a) {
191
202
  boxShadow: '0 2px 8px rgba(0,0,0,0.10)',
192
203
  border: '1px solid #eee',
193
204
  } },
194
- React.createElement("button", { style: {
195
- background: 'none',
196
- border: 'none',
197
- padding: 0,
198
- cursor: 'pointer',
199
- color: '#888',
200
- fontSize: '20px',
201
- display: 'flex',
202
- alignItems: 'center',
203
- justifyContent: 'center',
204
- }, onClick: function (e) {
205
- e.stopPropagation();
206
- onEmojiClick();
207
- } },
208
- React.createElement(FontAwesomeIcon, { icon: AppIcons.faFaceSmile.icon, style: { fontSize: AppIcons.faFaceSmile.size, color: AppIcons.faFaceSmile.color }, "aria-hidden": true })))),
205
+ React.createElement(Tooltip, { content: isMessageReactionDisabled ? "this is disabled by admin" : "", position: "bottom", disabled: !isMessageReactionDisabled, offset: -5 },
206
+ React.createElement("button", { style: {
207
+ background: 'none',
208
+ border: 'none',
209
+ padding: 0,
210
+ cursor: isMessageReactionDisabled ? 'not-allowed' : 'pointer',
211
+ color: '#888',
212
+ fontSize: '20px',
213
+ display: 'flex',
214
+ alignItems: 'center',
215
+ justifyContent: 'center',
216
+ opacity: isMessageReactionDisabled ? 0.5 : 1,
217
+ pointerEvents: isMessageReactionDisabled ? 'none' : 'auto',
218
+ }, onClick: function (e) {
219
+ e.stopPropagation();
220
+ if (!isMessageReactionDisabled) {
221
+ onEmojiClick();
222
+ }
223
+ } },
224
+ React.createElement(FontAwesomeIcon, { icon: AppIcons.faFaceSmile.icon, style: { fontSize: AppIcons.faFaceSmile.size, color: AppIcons.faFaceSmile.color }, "aria-hidden": true }))))),
209
225
  React.createElement("span", { style: {
210
226
  display: 'flex',
211
227
  alignItems: 'center',
package/sampark/sampark-chat/components/Actions/MessageActions.d.ts CHANGED
@@ -18,7 +18,11 @@ interface MessageActionsProps {
18
18
  onReplyClick?: () => void;
19
19
  canDelete?: boolean;
20
20
  onDeleteClick?: () => void;
21
+ onInfoClick?: () => void;
21
22
  messageType?: string;
23
+ isQuoteReplyDisabled?: boolean;
24
+ isMessageReactionDisabled?: boolean;
25
+ isDeleteChatDisabled?: boolean;
22
26
  }
23
27
  declare const MessageActions: React.FC<MessageActionsProps>;
24
28
  export default MessageActions;
package/sampark/sampark-chat/components/Actions/MessageActions.js CHANGED
@@ -14,13 +14,14 @@ import EmojiPicker from 'emoji-picker-react';
14
14
  import CustomIcons, { AppIcons } from '../../theme/icons';
15
15
  import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
16
16
  import colors from '../../theme/colors';
17
+ import Tooltip from '../Tooltip';
17
18
  var MessageActions = function (_a) {
18
19
  var _b;
19
- var showEmojiPicker = _a.showEmojiPicker, showMenu = _a.showMenu, onEmojiClick = _a.onEmojiClick, onMenuClick = _a.onMenuClick, onEmojiSelect = _a.onEmojiSelect, onCloseEmojiPicker = _a.onCloseEmojiPicker, onCloseMenu = _a.onCloseMenu, message = _a.message, _c = _a.position, position = _c === void 0 ? 'right' : _c, _d = _a.canEdit, canEdit = _d === void 0 ? false : _d, _e = _a.allowReact, allowReact = _e === void 0 ? true : _e, onEditClick = _a.onEditClick, onThreadClick = _a.onThreadClick, _f = _a.canDelete, canDelete = _f === void 0 ? false : _f, onDeleteClick = _a.onDeleteClick, _g = _a.messageType, messageType = _g === void 0 ? 'text' : _g, onReplyClick = _a.onReplyClick;
20
- var _h = React.useState(false), copied = _h[0], setCopied = _h[1];
21
- var _j = React.useState(false), isHovered = _j[0], setIsHovered = _j[1];
20
+ var showEmojiPicker = _a.showEmojiPicker, showMenu = _a.showMenu, onEmojiClick = _a.onEmojiClick, onMenuClick = _a.onMenuClick, onEmojiSelect = _a.onEmojiSelect, onCloseEmojiPicker = _a.onCloseEmojiPicker, onCloseMenu = _a.onCloseMenu, message = _a.message, _c = _a.position, position = _c === void 0 ? 'right' : _c, _d = _a.canEdit, canEdit = _d === void 0 ? false : _d, _e = _a.allowReact, allowReact = _e === void 0 ? true : _e, onEditClick = _a.onEditClick, onThreadClick = _a.onThreadClick, _f = _a.canDelete, canDelete = _f === void 0 ? false : _f, onDeleteClick = _a.onDeleteClick, onInfoClick = _a.onInfoClick, _g = _a.messageType, messageType = _g === void 0 ? 'text' : _g, onReplyClick = _a.onReplyClick, _h = _a.isQuoteReplyDisabled, isQuoteReplyDisabled = _h === void 0 ? false : _h, _j = _a.isMessageReactionDisabled, isMessageReactionDisabled = _j === void 0 ? false : _j, _k = _a.isDeleteChatDisabled, isDeleteChatDisabled = _k === void 0 ? false : _k;
21
+ var _l = React.useState(false), copied = _l[0], setCopied = _l[1];
22
+ var _m = React.useState(false), isHovered = _m[0], setIsHovered = _m[1];
22
23
  var containerRef = React.useRef(null);
23
- var _k = React.useState('above'), menuPlacement = _k[0], setMenuPlacement = _k[1];
24
+ var _o = React.useState('above'), menuPlacement = _o[0], setMenuPlacement = _o[1];
24
25
  var handleCopy = function () {
25
26
  if (navigator && navigator.clipboard) {
26
27
  navigator.clipboard.writeText(message);
@@ -69,7 +70,7 @@ var MessageActions = function (_a) {
69
70
  };
70
71
  }, [showMenu, showEmojiPicker]);
71
72
  return (React.createElement(React.Fragment, null,
72
- React.createElement("style", null, "\n @keyframes fadeInScale {\n from { opacity: 0; transform: scale(0.98); }\n to { opacity: 1; transform: scale(1); }\n }\n .message-menu-container button:hover { background: rgba(0,0,0,0.04); }\n .message-menu-container i { width: 18px; text-align: center; }\n /* Prevent vertical movement on hover; keep icons visually interactive without shifting layout */\n .chat-message-icons span button:hover { transform: none; }\n "),
73
+ React.createElement("style", null, "\n @keyframes fadeInScale {\n from { opacity: 0; transform: scale(0.98); }\n to { opacity: 1; transform: scale(1); }\n }\n .message-menu-container button:hover:not(.disabled-reply) { background: rgba(0,0,0,0.04); }\n .message-menu-container i { width: 18px; text-align: center; }\n /* Prevent vertical movement on hover; keep icons visually interactive without shifting layout */\n .chat-message-icons span button:hover { transform: none; }\n "),
73
74
  React.createElement("div", { ref: containerRef, className: "chat-message-icons", style: (_b = {
74
75
  display: 'flex',
75
76
  flexDirection: 'row',
@@ -97,21 +98,26 @@ var MessageActions = function (_a) {
97
98
  boxShadow: '0 2px 8px rgba(0,0,0,0.10)',
98
99
  border: '1px solid #eee',
99
100
  } },
100
- React.createElement("button", { style: {
101
- background: 'none',
102
- border: 'none',
103
- padding: 0,
104
- cursor: 'pointer',
105
- color: '#888',
106
- fontSize: '20px',
107
- display: 'flex',
108
- alignItems: 'center',
109
- justifyContent: 'center',
110
- }, onClick: function (e) {
111
- e.stopPropagation();
112
- onEmojiClick();
113
- } },
114
- React.createElement(FontAwesomeIcon, { icon: AppIcons.faFaceSmile.icon, style: { fontSize: AppIcons.faFaceSmile.size, color: AppIcons.faFaceSmile.color }, "aria-hidden": true })))),
101
+ React.createElement(Tooltip, { content: isMessageReactionDisabled ? "this is disabled by admin" : "", position: "bottom", disabled: !isMessageReactionDisabled, offset: -5 },
102
+ React.createElement("button", { style: {
103
+ background: 'none',
104
+ border: 'none',
105
+ padding: 0,
106
+ cursor: isMessageReactionDisabled ? 'not-allowed' : 'pointer',
107
+ color: '#888',
108
+ fontSize: '20px',
109
+ display: 'flex',
110
+ alignItems: 'center',
111
+ justifyContent: 'center',
112
+ opacity: isMessageReactionDisabled ? 0.5 : 1,
113
+ pointerEvents: isMessageReactionDisabled ? 'none' : 'auto',
114
+ }, onClick: function (e) {
115
+ e.stopPropagation();
116
+ if (!isMessageReactionDisabled) {
117
+ onEmojiClick();
118
+ }
119
+ } },
120
+ React.createElement(FontAwesomeIcon, { icon: AppIcons.faFaceSmile.icon, style: { fontSize: AppIcons.faFaceSmile.size, color: AppIcons.faFaceSmile.color }, "aria-hidden": true }))))),
115
121
  React.createElement("span", { style: {
116
122
  display: 'flex',
117
123
  alignItems: 'center',
@@ -138,7 +144,7 @@ var MessageActions = function (_a) {
138
144
  onMenuClick();
139
145
  } },
140
146
  React.createElement(FontAwesomeIcon, { icon: CustomIcons.faEllipsisV.icon, style: { fontSize: CustomIcons.faEllipsisV.size, color: colors.muted } }))),
141
- showEmojiPicker && allowReact && (React.createElement("div", { className: "emoji-picker-container", onClick: function (e) { return e.stopPropagation(); }, style: __assign(__assign({ position: 'absolute' }, (menuPlacement === 'above' ? { bottom: '100%', marginBottom: '8px' } : { top: '100%', marginTop: '8px' })), { zIndex: 9999, backgroundColor: 'white', borderRadius: '12px', boxShadow: '0 4px 20px rgba(0,0,0,0.15)', border: '1px solid #e0e0e0' }) },
147
+ showEmojiPicker && allowReact && !isMessageReactionDisabled && (React.createElement("div", { className: "emoji-picker-container", onClick: function (e) { return e.stopPropagation(); }, style: __assign(__assign({ position: 'absolute' }, (menuPlacement === 'above' ? { bottom: '100%', marginBottom: '8px' } : { top: '100%', marginTop: '8px' })), { zIndex: 9999, backgroundColor: 'white', borderRadius: '12px', boxShadow: '0 4px 20px rgba(0,0,0,0.15)', border: '1px solid #e0e0e0' }) },
142
148
  React.createElement(EmojiPicker, { onEmojiClick: function (emojiData) {
143
149
  var _a;
144
150
  var emojiId = emojiData.unified; // unique
@@ -146,7 +152,7 @@ var MessageActions = function (_a) {
146
152
  var emojiType = rawType.toLowerCase().replace(/\s+/g, "_");
147
153
  onEmojiSelect({ emojiId: emojiId, emojiType: emojiType });
148
154
  }, width: 300, height: 300, previewConfig: { showPreview: false }, searchDisabled: true }))),
149
- showMenu && (React.createElement("div", { className: "message-menu-container", style: __assign(__assign({ position: 'absolute' }, (menuPlacement === 'above' ? { bottom: '100%', marginBottom: '8px' } : { top: '100%', marginTop: '8px' })), { right: position === 'right' ? '0' : 'auto', left: position === 'left' ? '0' : '-20px', zIndex: 9999, background: colors.white, borderRadius: '10px', boxShadow: '0 8px 24px rgba(0,0,0,0.10)', border: '1px solid rgba(15,23,42,0.06)', minWidth: '160px', padding: '6px 0', display: 'flex', flexDirection: 'column', gap: '0', animation: 'fadeInScale 0.12s ease-out' }) },
155
+ showMenu && (React.createElement("div", { className: "message-menu-container", style: __assign(__assign({ position: 'absolute' }, (menuPlacement === 'above' ? { bottom: '100%', marginBottom: '8px' } : { top: '100%', marginTop: '8px' })), { right: position === 'right' ? '0' : 'auto', left: position === 'left' ? '0' : '-20px', zIndex: 9999, background: colors.white, borderRadius: '10px', boxShadow: '0 8px 24px rgba(0,0,0,0.10)', border: '1px solid rgba(15,23,42,0.06)', minWidth: '160px', padding: '6px 0', display: 'flex', flexDirection: 'column', gap: '0', animation: 'fadeInScale 0.12s ease-out', overflow: 'visible' }) },
150
156
  React.createElement("button", { style: {
151
157
  background: 'none',
152
158
  border: 'none',
@@ -196,7 +202,24 @@ var MessageActions = function (_a) {
196
202
  } },
197
203
  React.createElement(FontAwesomeIcon, { icon: AppIcons.faPenToSquare.icon, style: { fontSize: AppIcons.faPenToSquare.size, color: AppIcons.faPenToSquare.color }, "aria-hidden": true }),
198
204
  "Edit")),
199
- React.createElement("button", { style: {
205
+ React.createElement(Tooltip, { content: isQuoteReplyDisabled ? "Reply is disabled by admin" : "", position: "bottom", disabled: !isQuoteReplyDisabled },
206
+ React.createElement("button", { className: isQuoteReplyDisabled ? "disabled-reply" : "", style: {
207
+ background: 'none',
208
+ border: 'none',
209
+ width: '100%',
210
+ display: 'flex',
211
+ alignItems: 'center',
212
+ gap: '12px',
213
+ padding: '10px 16px',
214
+ fontSize: '14px',
215
+ color: '#444',
216
+ cursor: isQuoteReplyDisabled ? 'not-allowed' : 'pointer',
217
+ opacity: isQuoteReplyDisabled ? 0.5 : 1,
218
+ pointerEvents: isQuoteReplyDisabled ? 'none' : 'auto',
219
+ }, onClick: isQuoteReplyDisabled ? undefined : function () { onCloseMenu(); onReplyClick && onReplyClick(); } },
220
+ React.createElement(FontAwesomeIcon, { icon: AppIcons.faReply.icon, style: { fontSize: AppIcons.faReply.size, color: AppIcons.faReply.color }, "aria-hidden": true }),
221
+ "Reply")),
222
+ onInfoClick && (React.createElement("button", { style: {
200
223
  background: 'none',
201
224
  border: 'none',
202
225
  width: '100%',
@@ -207,22 +230,28 @@ var MessageActions = function (_a) {
207
230
  fontSize: '14px',
208
231
  color: '#444',
209
232
  cursor: 'pointer',
210
- }, onClick: function () { onCloseMenu(); onReplyClick && onReplyClick(); } },
211
- React.createElement(FontAwesomeIcon, { icon: AppIcons.faReply.icon, style: { fontSize: AppIcons.faReply.size, color: AppIcons.faReply.color }, "aria-hidden": true }),
212
- "Reply"),
213
- canDelete && (React.createElement("button", { style: {
214
- background: 'none',
215
- border: 'none',
216
- width: '100%',
217
- display: 'flex',
218
- alignItems: 'center',
219
- gap: '12px',
220
- padding: '10px 16px',
221
- fontSize: '14px',
222
- color: '#444',
223
- cursor: 'pointer',
224
- }, onClick: function () { onCloseMenu(); onDeleteClick && onDeleteClick(); } },
225
- React.createElement(FontAwesomeIcon, { icon: AppIcons.DeleteChat.icon, style: { fontSize: AppIcons.DeleteChat.size, color: colors.muted }, "aria-hidden": true }),
226
- "Delete")))))));
233
+ }, onClick: function () {
234
+ onCloseMenu();
235
+ onInfoClick();
236
+ } },
237
+ React.createElement(FontAwesomeIcon, { icon: AppIcons.faMessage.icon, style: { fontSize: AppIcons.faMessage.size, color: AppIcons.faMessage.color }, "aria-hidden": true }),
238
+ "Info")),
239
+ canDelete && (React.createElement(Tooltip, { content: isDeleteChatDisabled ? "this is disabled by admin" : "", position: "top", disabled: !isDeleteChatDisabled },
240
+ React.createElement("button", { style: {
241
+ background: 'none',
242
+ border: 'none',
243
+ width: '100%',
244
+ display: 'flex',
245
+ alignItems: 'center',
246
+ gap: '12px',
247
+ padding: '10px 16px',
248
+ fontSize: '14px',
249
+ color: '#444',
250
+ cursor: isDeleteChatDisabled ? 'not-allowed' : 'pointer',
251
+ opacity: isDeleteChatDisabled ? 0.5 : 1,
252
+ pointerEvents: isDeleteChatDisabled ? 'none' : 'auto',
253
+ }, onClick: isDeleteChatDisabled ? undefined : function () { onCloseMenu(); onDeleteClick && onDeleteClick(); } },
254
+ React.createElement(FontAwesomeIcon, { icon: AppIcons.DeleteChat.icon, style: { fontSize: AppIcons.DeleteChat.size, color: colors.muted }, "aria-hidden": true }),
255
+ "Delete"))))))));
227
256
  };
228
257
  export default MessageActions;
package/sampark/sampark-chat/components/AttachmentGroupFileSharing.js CHANGED
@@ -173,6 +173,13 @@ var AttachmentGroupFileSharing = function (_a) {
173
173
  React.createElement("div", { style: styles.attachmentIcon },
174
174
  React.createElement(FontAwesomeIcon, { icon: CustomIcons.faFile.icon, style: { fontSize: CustomIcons.faFile.size, color: colors.white } })),
175
175
  React.createElement("span", { style: __assign({}, fonts.content) }, "Attach File")),
176
+ React.createElement("div", { style: styles.attachmentMenuItem, onMouseEnter: function (e) { return e.currentTarget.style.backgroundColor = colors.optionHover; }, onMouseLeave: function (e) { return e.currentTarget.style.backgroundColor = 'transparent'; }, onClick: function () {
177
+ console.log('Polls clicked');
178
+ onClose();
179
+ } },
180
+ React.createElement("div", { style: styles.attachmentIcon },
181
+ React.createElement(FontAwesomeIcon, { icon: CustomIcons.faChartBar.icon, style: { fontSize: CustomIcons.faChartBar.size, color: colors.white } })),
182
+ React.createElement("span", { style: __assign({}, fonts.content) }, "Polls")),
176
183
  React.createElement("input", { type: "file", ref: imageInputRef, accept: "image/*", style: { display: 'none' }, onChange: function (e) {
177
184
  var files = e.target.files;
178
185
  if (onAttachImage) {
package/sampark/sampark-chat/components/Headers/ChatHeader.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import React from "react";
2
+ import { ChatSettings } from "../../types/ChatSettings";
2
3
  type PeerChatHeaderProps = {
3
4
  userProfilePic?: string;
4
5
  onclick?: any;
@@ -21,6 +22,8 @@ type PeerChatHeaderProps = {
21
22
  participantStatuses?: {
22
23
  [userId: string]: string;
23
24
  };
25
+ chatSettings?: ChatSettings;
26
+ showProfile?: boolean;
24
27
  };
25
28
  declare const PeerChatHeader: React.FC<PeerChatHeaderProps>;
26
29
  export default PeerChatHeader;
package/sampark/sampark-chat/components/Headers/ChatHeader.js CHANGED
@@ -17,23 +17,51 @@ import fonts from "../../theme/fonts";
17
17
  import ProfileAvatar from "../modals/ProfileAvatar";
18
18
  import Tooltip from "../Tooltip";
19
19
  var PeerChatHeader = function (_a) {
20
- var userProfilePic = _a.userProfilePic, onclick = _a.onclick, _b = _a.showBackButton, showBackButton = _b === void 0 ? true : _b, mainHeading = _a.mainHeading, _c = _a.headingStyle, headingStyle = _c === void 0 ? {} : _c, isPeerOnline = _a.isPeerOnline, _d = _a.showActionButtons, showActionButtons = _d === void 0 ? true : _d, onVideoCall = _a.onVideoCall, onAudioCall = _a.onAudioCall, onUserClick = _a.onUserClick, _e = _a.showVideoCall, showVideoCall = _e === void 0 ? false : _e, onSearch = _a.onSearch, _f = _a.showOptions, showOptions = _f === void 0 ? false : _f, onOptionsClick = _a.onOptionsClick, primaryColor = _a.primaryColor, secondaryColor = _a.secondaryColor, busyCallusersList = _a.busyCallusersList, peerUserId = _a.peerUserId, _g = _a.participantStatuses, participantStatuses = _g === void 0 ? {} : _g;
20
+ var userProfilePic = _a.userProfilePic, onclick = _a.onclick, _b = _a.showBackButton, showBackButton = _b === void 0 ? true : _b, mainHeading = _a.mainHeading, _c = _a.headingStyle, headingStyle = _c === void 0 ? {} : _c, isPeerOnline = _a.isPeerOnline, _d = _a.showActionButtons, showActionButtons = _d === void 0 ? true : _d, onVideoCall = _a.onVideoCall, onAudioCall = _a.onAudioCall, onUserClick = _a.onUserClick, _e = _a.showVideoCall, showVideoCall = _e === void 0 ? false : _e, onSearch = _a.onSearch, _f = _a.showOptions, showOptions = _f === void 0 ? false : _f, onOptionsClick = _a.onOptionsClick, _g = _a.showProfile, showProfile = _g === void 0 ? true : _g, primaryColor = _a.primaryColor, secondaryColor = _a.secondaryColor, busyCallusersList = _a.busyCallusersList, peerUserId = _a.peerUserId, _h = _a.participantStatuses, participantStatuses = _h === void 0 ? {} : _h, chatSettings = _a.chatSettings;
21
21
  var getHeaderGradient = function () {
22
22
  var primary = primaryColor || colors.blue;
23
23
  var secondary = secondaryColor || colors.blueLight;
24
24
  return "linear-gradient(115deg, ".concat(primary, " 0%, ").concat(secondary, " 100%)");
25
25
  };
26
+ var getDisplayedStatus = function () {
27
+ if (!isPeerOnline)
28
+ return 'Offline';
29
+ var explicit = participantStatuses && peerUserId ? participantStatuses[peerUserId] : undefined;
30
+ if (explicit)
31
+ return explicit;
32
+ if (busyCallusersList === null || busyCallusersList === void 0 ? void 0 : busyCallusersList.includes(peerUserId || ""))
33
+ return 'Busy';
34
+ return 'Available';
35
+ };
36
+ var formatStatusLabel = function (raw) {
37
+ if (!raw)
38
+ return '';
39
+ var lower = raw.toLowerCase();
40
+ var mapping = {
41
+ 'do_not_disturb': 'Do Not Disturb',
42
+ 'dnd': 'Do Not Disturb',
43
+ 'in_call': 'In a call',
44
+ 'on_call': 'In a call',
45
+ 'busy': 'Busy',
46
+ 'available': 'Available',
47
+ 'online': 'Available',
48
+ 'offline': 'Offline',
49
+ 'away': 'Away',
50
+ };
51
+ if (mapping[lower])
52
+ return mapping[lower];
53
+ return raw.replace(/[_-]+/g, ' ').replace(/\b\w/g, function (c) { return c.toUpperCase(); });
54
+ };
26
55
  return (React.createElement("div", { style: __assign(__assign({}, styles.headerContainer), { background: getHeaderGradient() }) },
27
56
  showBackButton && (React.createElement("button", { onClick: onclick, style: styles.backButton },
28
57
  React.createElement(FontAwesomeIcon, { icon: CustomIcons.BackArrow.icon, style: { fontSize: CustomIcons.BackArrow.size, color: CustomIcons.BackArrow.color } }))),
29
58
  React.createElement("div", { style: styles.userInfo },
30
- React.createElement("div", { style: styles.profilePicContainer },
31
- React.createElement(ProfileAvatar, { userName: mainHeading || '', profilePic: userProfilePic, size: 45, showOnlineIndicator: true, isOnline: isPeerOnline || false, isBusy: busyCallusersList === null || busyCallusersList === void 0 ? void 0 : busyCallusersList.includes(peerUserId || ""), userId: peerUserId, participantStatuses: participantStatuses, primaryColor: primaryColor, secondaryColor: secondaryColor })),
59
+ React.createElement("div", { style: styles.profilePicContainer }, showProfile ? (React.createElement(ProfileAvatar, { userName: mainHeading || '', profilePic: userProfilePic, size: 45, showOnlineIndicator: true, isOnline: isPeerOnline || false, isBusy: busyCallusersList === null || busyCallusersList === void 0 ? void 0 : busyCallusersList.includes(peerUserId || ""), userId: peerUserId, participantStatuses: participantStatuses, primaryColor: primaryColor, secondaryColor: secondaryColor })) : (React.createElement("div", { style: { width: 45, height: 45, borderRadius: 22, display: 'block' } }))),
32
60
  React.createElement("div", { style: styles.userDetails },
33
61
  React.createElement("h2", { style: styles.userName, onClick: onUserClick },
34
62
  " ",
35
63
  mainHeading),
36
- React.createElement("span", { style: __assign(__assign({}, styles.onlineStatus), { color: isPeerOnline ? colors.onlineColor : colors.disabledColor }) }))),
64
+ showProfile && (React.createElement("span", { style: __assign(__assign({}, styles.onlineStatus), { marginTop: 4, fontSize: 13 }) }, formatStatusLabel(getDisplayedStatus()))))),
37
65
  (showActionButtons || showOptions) && (React.createElement("div", { style: styles.actionButtons },
38
66
  showActionButtons && (React.createElement(React.Fragment, null,
39
67
  React.createElement(Tooltip, { content: "Audio Call", position: "bottom" },
@@ -42,8 +70,13 @@ var PeerChatHeader = function (_a) {
42
70
  React.createElement(Tooltip, { content: "Video Call", position: "bottom" },
43
71
  React.createElement("button", { disabled: !isPeerOnline || showVideoCall || (busyCallusersList === null || busyCallusersList === void 0 ? void 0 : busyCallusersList.includes(peerUserId || "")), style: __assign(__assign({}, styles.actionButton), { opacity: (!isPeerOnline || showVideoCall || (busyCallusersList === null || busyCallusersList === void 0 ? void 0 : busyCallusersList.includes(peerUserId || ""))) ? 0.5 : 1 }), "aria-label": "Video Call", onClick: onVideoCall },
44
72
  React.createElement(FontAwesomeIcon, { icon: CustomIcons.faVideo.icon, style: { fontSize: CustomIcons.faVideo.size, color: colors.white } }))),
45
- React.createElement(Tooltip, { content: "Search", position: "bottom" },
46
- React.createElement("button", { style: styles.actionButton, "aria-label": "Search", onClick: onSearch },
73
+ React.createElement(Tooltip, { content: (chatSettings === null || chatSettings === void 0 ? void 0 : chatSettings.is_search_message) === false ? "Search is disabled by admin" : "Search", position: "bottom", offset: 4 },
74
+ React.createElement("button", { style: __assign(__assign({}, styles.actionButton), { cursor: (chatSettings === null || chatSettings === void 0 ? void 0 : chatSettings.is_search_message) === false ? 'not-allowed' : 'pointer', opacity: (chatSettings === null || chatSettings === void 0 ? void 0 : chatSettings.is_search_message) === false ? 0.5 : 1 }), "aria-label": "Search", onClick: function () {
75
+ if ((chatSettings === null || chatSettings === void 0 ? void 0 : chatSettings.is_search_message) === false) {
76
+ return;
77
+ }
78
+ onSearch === null || onSearch === void 0 ? void 0 : onSearch();
79
+ } },
47
80
  React.createElement(FontAwesomeIcon, { icon: CustomIcons.faSearch.icon, style: { fontSize: CustomIcons.faSearch.size, color: colors.white } }))))),
48
81
  showOptions && (React.createElement(Tooltip, { content: "Options", position: "top", offset: 12 },
49
82
  React.createElement("button", { style: styles.actionButton, "aria-label": "Options", onClick: onOptionsClick },
package/sampark/sampark-chat/components/Headers/GroupChatHeader.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import React, { FunctionComponent } from 'react';
2
+ import { ChatSettings } from '../../types/ChatSettings';
2
3
  type props = {
3
4
  onClick: () => void;
4
5
  showBackButton: boolean;
@@ -20,6 +21,7 @@ type props = {
20
21
  showVideoCall?: boolean;
21
22
  primaryColor?: string;
22
23
  secondaryColor?: string;
24
+ chatSettings?: ChatSettings;
23
25
  };
24
26
  declare const GroupChatHeader: FunctionComponent<props>;
25
27
  export default GroupChatHeader;
package/sampark/sampark-chat/components/Headers/GroupChatHeader.js CHANGED
@@ -53,7 +53,7 @@ import CustomIcons from '../../theme/icons';
53
53
  import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
54
54
  import Tooltip from '../Tooltip';
55
55
  var GroupChatHeader = function (_a) {
56
- var onClick = _a.onClick, showBackButton = _a.showBackButton, mainHeading = _a.mainHeading, setShowParticipantsList = _a.setShowParticipantsList, headingStyle = _a.headingStyle, setShowHideParticipantScreen = _a.setShowHideParticipantScreen, setViewParticipantsList = _a.setViewParticipantsList, setShowGroupOptionBottomSheet = _a.setShowGroupOptionBottomSheet, onSearch = _a.onSearch, userJoinedGroupStatus = _a.userJoinedGroupStatus, _b = _a.groupType, groupType = _b === void 0 ? 'public' : _b, _c = _a.participantsCount, participantsCount = _c === void 0 ? 0 : _c, onHeaderClick = _a.onHeaderClick, handleVideoCall = _a.handleVideoCall, handleAudioCall = _a.handleAudioCall, rejoinGroupCall = _a.rejoinGroupCall, _d = _a.showJoinGroupCallBtn, showJoinGroupCallBtn = _d === void 0 ? false : _d, _e = _a.showVideoCall, showVideoCall = _e === void 0 ? false : _e, primaryColor = _a.primaryColor, secondaryColor = _a.secondaryColor;
56
+ var onClick = _a.onClick, showBackButton = _a.showBackButton, mainHeading = _a.mainHeading, setShowParticipantsList = _a.setShowParticipantsList, headingStyle = _a.headingStyle, setShowHideParticipantScreen = _a.setShowHideParticipantScreen, setViewParticipantsList = _a.setViewParticipantsList, setShowGroupOptionBottomSheet = _a.setShowGroupOptionBottomSheet, onSearch = _a.onSearch, userJoinedGroupStatus = _a.userJoinedGroupStatus, _b = _a.groupType, groupType = _b === void 0 ? 'public' : _b, _c = _a.participantsCount, participantsCount = _c === void 0 ? 0 : _c, onHeaderClick = _a.onHeaderClick, handleVideoCall = _a.handleVideoCall, handleAudioCall = _a.handleAudioCall, rejoinGroupCall = _a.rejoinGroupCall, _d = _a.showJoinGroupCallBtn, showJoinGroupCallBtn = _d === void 0 ? false : _d, _e = _a.showVideoCall, showVideoCall = _e === void 0 ? false : _e, primaryColor = _a.primaryColor, secondaryColor = _a.secondaryColor, chatSettings = _a.chatSettings;
57
57
  var _f = React.useState(false), showInfoModal = _f[0], setShowInfoModal = _f[1];
58
58
  var _g = React.useState(""), infoModalMessage = _g[0], setInfoModalMessage = _g[1];
59
59
  var getHeaderGradient = function () {
@@ -125,8 +125,13 @@ var GroupChatHeader = function (_a) {
125
125
  showJoinGroupCallBtn && (React.createElement(Tooltip, { content: "Rejoin Call", position: "bottom" },
126
126
  React.createElement("button", { style: __assign(__assign({}, styles.actionButton), { opacity: showVideoCall ? 0.5 : 1 }), disabled: showVideoCall, onClick: rejoinGroupCall },
127
127
  React.createElement(FontAwesomeIcon, { icon: CustomIcons.faVideo.icon, style: { fontSize: CustomIcons.faVideo.size, color: 'red' } })))),
128
- React.createElement(Tooltip, { content: "Search", position: "bottom" },
129
- React.createElement("button", { onClick: function () { return onSearch && onSearch(); }, style: styles.actionButton, "aria-label": "Search" },
128
+ React.createElement(Tooltip, { content: (chatSettings === null || chatSettings === void 0 ? void 0 : chatSettings.is_search_message) === false ? "Search is disabled by admin" : "Search", position: "bottom", offset: 4 },
129
+ React.createElement("button", { onClick: function () {
130
+ if ((chatSettings === null || chatSettings === void 0 ? void 0 : chatSettings.is_search_message) === false) {
131
+ return;
132
+ }
133
+ onSearch && onSearch();
134
+ }, style: __assign(__assign({}, styles.actionButton), { cursor: (chatSettings === null || chatSettings === void 0 ? void 0 : chatSettings.is_search_message) === false ? 'not-allowed' : 'pointer', opacity: (chatSettings === null || chatSettings === void 0 ? void 0 : chatSettings.is_search_message) === false ? 0.5 : 1 }), "aria-label": "Search" },
130
135
  React.createElement(FontAwesomeIcon, { icon: CustomIcons.faSearch.icon, style: { fontSize: CustomIcons.faSearch.size, color: colors.white } })))))),
131
136
  React.createElement(InfoModal, { open: showInfoModal, message: infoModalMessage, onClose: function () { return setShowInfoModal(false); } })));
132
137
  };