mr-chat-bird 1.0.8 → 1.0.10
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.
- package/dist/index.js +117 -116
- package/dist/index.mjs +79 -78
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -38,7 +38,7 @@ module.exports = __toCommonJS(index_exports);
|
|
|
38
38
|
var import_styles = require("@mantine/core/styles.css");
|
|
39
39
|
var import_styles2 = require("@mantine/tiptap/styles.css");
|
|
40
40
|
var import_styles3 = require("@mantine/notifications/styles.css");
|
|
41
|
-
var
|
|
41
|
+
var import_react10 = __toESM(require("react"));
|
|
42
42
|
var import_core9 = require("@mantine/core");
|
|
43
43
|
var import_notifications2 = require("@mantine/notifications");
|
|
44
44
|
|
|
@@ -119,6 +119,7 @@ var createAppTheme = (primaryColor) => (0, import_core.createTheme)({
|
|
|
119
119
|
});
|
|
120
120
|
|
|
121
121
|
// src/store/provider.tsx
|
|
122
|
+
var import_react = __toESM(require("react"));
|
|
122
123
|
var import_react_redux = require("react-redux");
|
|
123
124
|
|
|
124
125
|
// src/store/store.ts
|
|
@@ -326,11 +327,11 @@ var store = (0, import_toolkit2.configureStore)({
|
|
|
326
327
|
|
|
327
328
|
// src/store/provider.tsx
|
|
328
329
|
function ReduxProvider({ children }) {
|
|
329
|
-
return /* @__PURE__ */
|
|
330
|
+
return /* @__PURE__ */ import_react.default.createElement(import_react_redux.Provider, { store }, children);
|
|
330
331
|
}
|
|
331
332
|
|
|
332
333
|
// src/store/socket/index.tsx
|
|
333
|
-
var
|
|
334
|
+
var import_react2 = __toESM(require("react"));
|
|
334
335
|
|
|
335
336
|
// src/lib/socket.ts
|
|
336
337
|
var import_socket = require("socket.io-client");
|
|
@@ -358,7 +359,7 @@ var getSocket = (userId) => {
|
|
|
358
359
|
|
|
359
360
|
// src/store/socket/index.tsx
|
|
360
361
|
function SocketProvider({ children, userId }) {
|
|
361
|
-
(0,
|
|
362
|
+
(0, import_react2.useEffect)(() => {
|
|
362
363
|
if (!userId) return;
|
|
363
364
|
const socket2 = getSocket(userId);
|
|
364
365
|
if (!socket2) return;
|
|
@@ -373,7 +374,7 @@ function SocketProvider({ children, userId }) {
|
|
|
373
374
|
}
|
|
374
375
|
};
|
|
375
376
|
}, [userId]);
|
|
376
|
-
return /* @__PURE__ */
|
|
377
|
+
return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, children);
|
|
377
378
|
}
|
|
378
379
|
|
|
379
380
|
// src/components/ChatUserList/ChatUserList.tsx
|
|
@@ -386,7 +387,7 @@ var import_core7 = require("@mantine/core");
|
|
|
386
387
|
var import_icons_react3 = require("@tabler/icons-react");
|
|
387
388
|
|
|
388
389
|
// src/components/RichTextEditor/RichTextEditor.tsx
|
|
389
|
-
var
|
|
390
|
+
var import_react4 = __toESM(require("react"));
|
|
390
391
|
var import_icons_react = require("@tabler/icons-react");
|
|
391
392
|
var import_extension_highlight = __toESM(require("@tiptap/extension-highlight"));
|
|
392
393
|
var import_extension_subscript = __toESM(require("@tiptap/extension-subscript"));
|
|
@@ -4745,16 +4746,16 @@ var Underline = Mark.create({
|
|
|
4745
4746
|
var index_default = Underline;
|
|
4746
4747
|
|
|
4747
4748
|
// src/components/RichTextEditor/RichTextEditor.tsx
|
|
4748
|
-
var
|
|
4749
|
+
var import_react5 = require("@tiptap/react");
|
|
4749
4750
|
var import_starter_kit = __toESM(require("@tiptap/starter-kit"));
|
|
4750
4751
|
var import_tiptap = require("@mantine/tiptap");
|
|
4751
4752
|
var import_core5 = require("@mantine/core");
|
|
4752
4753
|
|
|
4753
4754
|
// src/components/EmojiPickerPopover/EmojiPickerPopover.tsx
|
|
4754
|
-
var
|
|
4755
|
+
var import_react3 = __toESM(require("react"));
|
|
4755
4756
|
var import_core3 = require("@mantine/core");
|
|
4756
4757
|
var import_data = __toESM(require("@emoji-mart/data"));
|
|
4757
|
-
var EmojiPicker = (0,
|
|
4758
|
+
var EmojiPicker = (0, import_react3.lazy)(() => import("@emoji-mart/react"));
|
|
4758
4759
|
function EmojiPickerPopover({
|
|
4759
4760
|
onSelect,
|
|
4760
4761
|
action,
|
|
@@ -4762,8 +4763,8 @@ function EmojiPickerPopover({
|
|
|
4762
4763
|
offset = 8,
|
|
4763
4764
|
position = "bottom-start"
|
|
4764
4765
|
}) {
|
|
4765
|
-
const [opened, setOpened] = (0,
|
|
4766
|
-
return /* @__PURE__ */
|
|
4766
|
+
const [opened, setOpened] = (0, import_react3.useState)(false);
|
|
4767
|
+
return /* @__PURE__ */ import_react3.default.createElement(
|
|
4767
4768
|
import_core3.Popover,
|
|
4768
4769
|
{
|
|
4769
4770
|
opened,
|
|
@@ -4776,18 +4777,18 @@ function EmojiPickerPopover({
|
|
|
4776
4777
|
trapFocus: false,
|
|
4777
4778
|
closeOnEscape: true
|
|
4778
4779
|
},
|
|
4779
|
-
/* @__PURE__ */
|
|
4780
|
+
/* @__PURE__ */ import_react3.default.createElement(import_core3.Popover.Target, null, (0, import_react3.cloneElement)(action, {
|
|
4780
4781
|
onClick: (e) => {
|
|
4781
4782
|
action.props?.onClick?.(e);
|
|
4782
4783
|
setOpened((prev) => !prev);
|
|
4783
4784
|
}
|
|
4784
4785
|
})),
|
|
4785
|
-
/* @__PURE__ */
|
|
4786
|
-
|
|
4786
|
+
/* @__PURE__ */ import_react3.default.createElement(import_core3.Popover.Dropdown, { p: 0 }, /* @__PURE__ */ import_react3.default.createElement(
|
|
4787
|
+
import_react3.Suspense,
|
|
4787
4788
|
{
|
|
4788
|
-
fallback: /* @__PURE__ */
|
|
4789
|
+
fallback: /* @__PURE__ */ import_react3.default.createElement("div", { style: { padding: 12, width: 320 } }, /* @__PURE__ */ import_react3.default.createElement(import_core3.Skeleton, { height: 280, radius: "md" }))
|
|
4789
4790
|
},
|
|
4790
|
-
/* @__PURE__ */
|
|
4791
|
+
/* @__PURE__ */ import_react3.default.createElement(
|
|
4791
4792
|
EmojiPicker,
|
|
4792
4793
|
{
|
|
4793
4794
|
previewPosition: "none",
|
|
@@ -4849,10 +4850,10 @@ function CustomRichTextEditor({
|
|
|
4849
4850
|
onChange,
|
|
4850
4851
|
onSubmit
|
|
4851
4852
|
}) {
|
|
4852
|
-
const [charCount, setCharCount] = (0,
|
|
4853
|
-
const [showWarning, setShowWarning] = (0,
|
|
4854
|
-
const [showToolbar, setShowToolbar] = (0,
|
|
4855
|
-
const editor = (0,
|
|
4853
|
+
const [charCount, setCharCount] = (0, import_react4.useState)(0);
|
|
4854
|
+
const [showWarning, setShowWarning] = (0, import_react4.useState)(false);
|
|
4855
|
+
const [showToolbar, setShowToolbar] = (0, import_react4.useState)(false);
|
|
4856
|
+
const editor = (0, import_react5.useEditor)({
|
|
4856
4857
|
extensions: [
|
|
4857
4858
|
import_starter_kit.default,
|
|
4858
4859
|
EmojiNode,
|
|
@@ -4885,15 +4886,15 @@ function CustomRichTextEditor({
|
|
|
4885
4886
|
editor.commands.focus();
|
|
4886
4887
|
setCharCount(0);
|
|
4887
4888
|
};
|
|
4888
|
-
return /* @__PURE__ */
|
|
4889
|
+
return /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
4889
4890
|
import_tiptap.RichTextEditor,
|
|
4890
4891
|
{
|
|
4891
4892
|
editor,
|
|
4892
4893
|
w: "100%",
|
|
4893
4894
|
className: "mrchat-richTextEditorContainer"
|
|
4894
4895
|
},
|
|
4895
|
-
/* @__PURE__ */
|
|
4896
|
-
/* @__PURE__ */
|
|
4896
|
+
/* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.Content, null),
|
|
4897
|
+
/* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.Toolbar, { sticky: true, stickyOffset: "var(--docs-header-height)" }, /* @__PURE__ */ import_react4.default.createElement("div", { className: "mrchat-mainActionContainer" }, /* @__PURE__ */ import_react4.default.createElement(
|
|
4897
4898
|
EmojiPickerPopover,
|
|
4898
4899
|
{
|
|
4899
4900
|
onSelect: (emoji) => {
|
|
@@ -4904,7 +4905,7 @@ function CustomRichTextEditor({
|
|
|
4904
4905
|
}
|
|
4905
4906
|
}).run();
|
|
4906
4907
|
},
|
|
4907
|
-
action: /* @__PURE__ */
|
|
4908
|
+
action: /* @__PURE__ */ import_react4.default.createElement(
|
|
4908
4909
|
import_core5.ActionIcon,
|
|
4909
4910
|
{
|
|
4910
4911
|
radius: "lg",
|
|
@@ -4913,10 +4914,10 @@ function CustomRichTextEditor({
|
|
|
4913
4914
|
color: "#333",
|
|
4914
4915
|
className: "mrchat-mainActionEmojiIcon"
|
|
4915
4916
|
},
|
|
4916
|
-
/* @__PURE__ */
|
|
4917
|
+
/* @__PURE__ */ import_react4.default.createElement(AddReaction_default, null)
|
|
4917
4918
|
)
|
|
4918
4919
|
}
|
|
4919
|
-
), /* @__PURE__ */
|
|
4920
|
+
), /* @__PURE__ */ import_react4.default.createElement(
|
|
4920
4921
|
import_core5.ActionIcon,
|
|
4921
4922
|
{
|
|
4922
4923
|
radius: "lg",
|
|
@@ -4926,8 +4927,8 @@ function CustomRichTextEditor({
|
|
|
4926
4927
|
className: "mrchat-mainTextFormatIcon",
|
|
4927
4928
|
onClick: () => setShowToolbar((prev) => !prev)
|
|
4928
4929
|
},
|
|
4929
|
-
/* @__PURE__ */
|
|
4930
|
-
), /* @__PURE__ */
|
|
4930
|
+
/* @__PURE__ */ import_react4.default.createElement(TextFormat_default, null)
|
|
4931
|
+
), /* @__PURE__ */ import_react4.default.createElement(
|
|
4931
4932
|
import_core5.ActionIcon,
|
|
4932
4933
|
{
|
|
4933
4934
|
radius: "lg",
|
|
@@ -4936,15 +4937,15 @@ function CustomRichTextEditor({
|
|
|
4936
4937
|
className: "mrchat-mainSendMsgIcon",
|
|
4937
4938
|
onClick: () => handleSubmitMsg()
|
|
4938
4939
|
},
|
|
4939
|
-
/* @__PURE__ */
|
|
4940
|
-
)), showToolbar && /* @__PURE__ */
|
|
4940
|
+
/* @__PURE__ */ import_react4.default.createElement(import_icons_react.IconSend, { size: 18 })
|
|
4941
|
+
)), showToolbar && /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, /* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.ControlsGroup, null, /* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.Bold, null), /* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.Italic, null), /* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.Underline, null), /* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.Strikethrough, null), /* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.Code, null), /* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.Highlight, null)), /* @__PURE__ */ import_react4.default.createElement(
|
|
4941
4942
|
import_tiptap.RichTextEditor.ControlsGroup,
|
|
4942
4943
|
{
|
|
4943
4944
|
className: "mrchat-secondRichTextEditorToolBar"
|
|
4944
4945
|
},
|
|
4945
|
-
/* @__PURE__ */
|
|
4946
|
-
/* @__PURE__ */
|
|
4947
|
-
/* @__PURE__ */
|
|
4946
|
+
/* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.BulletList, null),
|
|
4947
|
+
/* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.OrderedList, null),
|
|
4948
|
+
/* @__PURE__ */ import_react4.default.createElement(import_core5.Menu, { trigger: "hover", openDelay: 200 }, /* @__PURE__ */ import_react4.default.createElement(import_core5.Menu.Target, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
4948
4949
|
import_core5.ActionIcon,
|
|
4949
4950
|
{
|
|
4950
4951
|
variant: "outline",
|
|
@@ -4952,35 +4953,35 @@ function CustomRichTextEditor({
|
|
|
4952
4953
|
color: "#495057",
|
|
4953
4954
|
className: "mrchat-customToolActionItem"
|
|
4954
4955
|
},
|
|
4955
|
-
/* @__PURE__ */
|
|
4956
|
-
)), /* @__PURE__ */
|
|
4956
|
+
/* @__PURE__ */ import_react4.default.createElement(import_icons_react.IconAlignLeft, { size: 16, stroke: 1.5 })
|
|
4957
|
+
)), /* @__PURE__ */ import_react4.default.createElement(import_core5.Menu.Dropdown, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
4957
4958
|
import_core5.Menu.Item,
|
|
4958
4959
|
{
|
|
4959
4960
|
onClick: () => editor?.chain().focus().setTextAlign("left").run()
|
|
4960
4961
|
},
|
|
4961
|
-
/* @__PURE__ */
|
|
4962
|
-
), /* @__PURE__ */
|
|
4962
|
+
/* @__PURE__ */ import_react4.default.createElement(import_icons_react.IconAlignLeft, { size: 14 })
|
|
4963
|
+
), /* @__PURE__ */ import_react4.default.createElement(
|
|
4963
4964
|
import_core5.Menu.Item,
|
|
4964
4965
|
{
|
|
4965
4966
|
onClick: () => editor?.chain().focus().setTextAlign("center").run()
|
|
4966
4967
|
},
|
|
4967
|
-
/* @__PURE__ */
|
|
4968
|
-
), /* @__PURE__ */
|
|
4968
|
+
/* @__PURE__ */ import_react4.default.createElement(import_icons_react.IconAlignCenter, { size: 14 })
|
|
4969
|
+
), /* @__PURE__ */ import_react4.default.createElement(
|
|
4969
4970
|
import_core5.Menu.Item,
|
|
4970
4971
|
{
|
|
4971
4972
|
onClick: () => editor?.chain().focus().setTextAlign("right").run()
|
|
4972
4973
|
},
|
|
4973
|
-
/* @__PURE__ */
|
|
4974
|
+
/* @__PURE__ */ import_react4.default.createElement(import_icons_react.IconAlignRight, { size: 14 })
|
|
4974
4975
|
))),
|
|
4975
|
-
/* @__PURE__ */
|
|
4976
|
-
), /* @__PURE__ */
|
|
4976
|
+
/* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.Link, null)
|
|
4977
|
+
), /* @__PURE__ */ import_react4.default.createElement(
|
|
4977
4978
|
import_tiptap.RichTextEditor.ControlsGroup,
|
|
4978
4979
|
{
|
|
4979
4980
|
className: "mrchat-secondRichTextEditorToolBar"
|
|
4980
4981
|
},
|
|
4981
|
-
/* @__PURE__ */
|
|
4982
|
+
/* @__PURE__ */ import_react4.default.createElement(import_tiptap.RichTextEditor.ClearFormatting, null)
|
|
4982
4983
|
))),
|
|
4983
|
-
showWarning && /* @__PURE__ */
|
|
4984
|
+
showWarning && /* @__PURE__ */ import_react4.default.createElement(
|
|
4984
4985
|
"div",
|
|
4985
4986
|
{
|
|
4986
4987
|
style: {
|
|
@@ -5001,11 +5002,11 @@ function CustomRichTextEditor({
|
|
|
5001
5002
|
|
|
5002
5003
|
// src/components/ChatUserList/ChatUserMessage.tsx
|
|
5003
5004
|
var import_react_redux2 = require("react-redux");
|
|
5004
|
-
var
|
|
5005
|
+
var import_react8 = __toESM(require("react"));
|
|
5005
5006
|
var import_dompurify = __toESM(require("dompurify"));
|
|
5006
5007
|
|
|
5007
5008
|
// src/components/VirtualizedList/ChatScrollContainer.tsx
|
|
5008
|
-
var
|
|
5009
|
+
var import_react6 = __toESM(require("react"));
|
|
5009
5010
|
function ChatScrollContainer({
|
|
5010
5011
|
data: data2,
|
|
5011
5012
|
renderItem,
|
|
@@ -5013,18 +5014,18 @@ function ChatScrollContainer({
|
|
|
5013
5014
|
hasMore,
|
|
5014
5015
|
scrollToBottomTrigger
|
|
5015
5016
|
}) {
|
|
5016
|
-
const containerRef = (0,
|
|
5017
|
-
const isFetchingRef = (0,
|
|
5018
|
-
const isInitialLoadRef = (0,
|
|
5019
|
-
const prevLengthRef = (0,
|
|
5020
|
-
(0,
|
|
5017
|
+
const containerRef = (0, import_react6.useRef)(null);
|
|
5018
|
+
const isFetchingRef = (0, import_react6.useRef)(false);
|
|
5019
|
+
const isInitialLoadRef = (0, import_react6.useRef)(true);
|
|
5020
|
+
const prevLengthRef = (0, import_react6.useRef)(0);
|
|
5021
|
+
(0, import_react6.useEffect)(() => {
|
|
5021
5022
|
const el = containerRef.current;
|
|
5022
5023
|
if (!el) return;
|
|
5023
5024
|
setTimeout(() => {
|
|
5024
5025
|
el.scrollTop = el.scrollHeight;
|
|
5025
5026
|
}, 100);
|
|
5026
5027
|
}, [scrollToBottomTrigger]);
|
|
5027
|
-
(0,
|
|
5028
|
+
(0, import_react6.useEffect)(() => {
|
|
5028
5029
|
const el = containerRef.current;
|
|
5029
5030
|
if (!el || !data2.length) return;
|
|
5030
5031
|
if (isInitialLoadRef.current) {
|
|
@@ -5054,7 +5055,7 @@ function ChatScrollContainer({
|
|
|
5054
5055
|
isFetchingRef.current = false;
|
|
5055
5056
|
}, 0);
|
|
5056
5057
|
};
|
|
5057
|
-
return /* @__PURE__ */
|
|
5058
|
+
return /* @__PURE__ */ import_react6.default.createElement(
|
|
5058
5059
|
"div",
|
|
5059
5060
|
{
|
|
5060
5061
|
ref: containerRef,
|
|
@@ -5066,12 +5067,12 @@ function ChatScrollContainer({
|
|
|
5066
5067
|
flexDirection: "column"
|
|
5067
5068
|
}
|
|
5068
5069
|
},
|
|
5069
|
-
data2.map((item, index) => /* @__PURE__ */
|
|
5070
|
+
data2.map((item, index) => /* @__PURE__ */ import_react6.default.createElement("div", { key: item?.id || index }, renderItem(item, index)))
|
|
5070
5071
|
);
|
|
5071
5072
|
}
|
|
5072
5073
|
|
|
5073
5074
|
// src/components/UserProfile/UserProfileDrawer.tsx
|
|
5074
|
-
var
|
|
5075
|
+
var import_react7 = __toESM(require("react"));
|
|
5075
5076
|
var import_core6 = require("@mantine/core");
|
|
5076
5077
|
var import_icons_react2 = require("@tabler/icons-react");
|
|
5077
5078
|
function UserProfileDrawer({
|
|
@@ -5081,9 +5082,9 @@ function UserProfileDrawer({
|
|
|
5081
5082
|
onDeleteMessages,
|
|
5082
5083
|
onBlock
|
|
5083
5084
|
}) {
|
|
5084
|
-
const [visible, setVisible] = (0,
|
|
5085
|
-
const [showImagePreview, setShowImagePreview] = (0,
|
|
5086
|
-
(0,
|
|
5085
|
+
const [visible, setVisible] = (0, import_react7.useState)(opened);
|
|
5086
|
+
const [showImagePreview, setShowImagePreview] = (0, import_react7.useState)(false);
|
|
5087
|
+
(0, import_react7.useEffect)(() => {
|
|
5087
5088
|
if (opened) setVisible(true);
|
|
5088
5089
|
}, [opened]);
|
|
5089
5090
|
const handleClose = () => {
|
|
@@ -5091,14 +5092,14 @@ function UserProfileDrawer({
|
|
|
5091
5092
|
setTimeout(onClose, 250);
|
|
5092
5093
|
};
|
|
5093
5094
|
if (!opened && !visible) return null;
|
|
5094
|
-
return /* @__PURE__ */
|
|
5095
|
+
return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, /* @__PURE__ */ import_react7.default.createElement("div", { className: "mrchat-overlay", onClick: handleClose }, /* @__PURE__ */ import_react7.default.createElement(
|
|
5095
5096
|
"div",
|
|
5096
5097
|
{
|
|
5097
5098
|
className: `${"mrchat-drawer"} ${visible ? "mrchat-open" : "mrchat-close"}`,
|
|
5098
5099
|
onClick: (e) => e.stopPropagation()
|
|
5099
5100
|
},
|
|
5100
|
-
/* @__PURE__ */
|
|
5101
|
-
/* @__PURE__ */
|
|
5101
|
+
/* @__PURE__ */ import_react7.default.createElement("div", { className: "mrchat-header" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "mrchat-backBtn", onClick: handleClose }, /* @__PURE__ */ import_react7.default.createElement(import_icons_react2.IconArrowLeft, { size: 20 })), /* @__PURE__ */ import_react7.default.createElement(import_core6.Text, { fw: 600 }, "Contact info")),
|
|
5102
|
+
/* @__PURE__ */ import_react7.default.createElement("div", { className: "mrchat-profileSection" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
5102
5103
|
import_core6.Avatar,
|
|
5103
5104
|
{
|
|
5104
5105
|
src: user?.avatar,
|
|
@@ -5107,31 +5108,31 @@ function UserProfileDrawer({
|
|
|
5107
5108
|
style: { cursor: "pointer" },
|
|
5108
5109
|
onClick: () => user?.avatar ? setShowImagePreview(true) : {}
|
|
5109
5110
|
}
|
|
5110
|
-
), /* @__PURE__ */
|
|
5111
|
-
/* @__PURE__ */
|
|
5111
|
+
), /* @__PURE__ */ import_react7.default.createElement(import_core6.Text, { fw: 700, size: "lg", mt: "sm" }, user?.displayName), /* @__PURE__ */ import_react7.default.createElement(import_core6.Text, { size: "sm", c: "dimmed" }, "@", user?.username)),
|
|
5112
|
+
/* @__PURE__ */ import_react7.default.createElement("div", { className: "mrchat-actions" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
5112
5113
|
"div",
|
|
5113
5114
|
{
|
|
5114
5115
|
className: `${"mrchat-item"} ${"mrchat-itemDanger"}`,
|
|
5115
5116
|
onClick: onDeleteMessages
|
|
5116
5117
|
},
|
|
5117
|
-
/* @__PURE__ */
|
|
5118
|
-
/* @__PURE__ */
|
|
5119
|
-
), /* @__PURE__ */
|
|
5118
|
+
/* @__PURE__ */ import_react7.default.createElement(import_icons_react2.IconTrash, { size: 18 }),
|
|
5119
|
+
/* @__PURE__ */ import_react7.default.createElement("span", null, "Delete all messages")
|
|
5120
|
+
), /* @__PURE__ */ import_react7.default.createElement(
|
|
5120
5121
|
"div",
|
|
5121
5122
|
{
|
|
5122
5123
|
className: `${"mrchat-item"} ${"mrchat-itemDanger"}`,
|
|
5123
5124
|
onClick: onBlock
|
|
5124
5125
|
},
|
|
5125
|
-
/* @__PURE__ */
|
|
5126
|
-
/* @__PURE__ */
|
|
5126
|
+
/* @__PURE__ */ import_react7.default.createElement(import_icons_react2.IconBan, { size: 18 }),
|
|
5127
|
+
/* @__PURE__ */ import_react7.default.createElement("span", null, "Block")
|
|
5127
5128
|
))
|
|
5128
|
-
)), showImagePreview && /* @__PURE__ */
|
|
5129
|
+
)), showImagePreview && /* @__PURE__ */ import_react7.default.createElement(
|
|
5129
5130
|
"div",
|
|
5130
5131
|
{
|
|
5131
5132
|
className: "mrchat-imagePreview",
|
|
5132
5133
|
onClick: () => setShowImagePreview(false)
|
|
5133
5134
|
},
|
|
5134
|
-
/* @__PURE__ */
|
|
5135
|
+
/* @__PURE__ */ import_react7.default.createElement("img", { src: user?.avatar, alt: "profile" })
|
|
5135
5136
|
));
|
|
5136
5137
|
}
|
|
5137
5138
|
|
|
@@ -5147,9 +5148,9 @@ function ChatUserMessage({
|
|
|
5147
5148
|
const messageList = (0, import_react_redux2.useSelector)(
|
|
5148
5149
|
(state) => state.chat.messageList
|
|
5149
5150
|
);
|
|
5150
|
-
const [page, setPage] = (0,
|
|
5151
|
-
const [scrollTrigger, setScrollTrigger] = (0,
|
|
5152
|
-
const [showUserInfo, setShowUserInfo] = (0,
|
|
5151
|
+
const [page, setPage] = (0, import_react8.useState)(0);
|
|
5152
|
+
const [scrollTrigger, setScrollTrigger] = (0, import_react8.useState)(0);
|
|
5153
|
+
const [showUserInfo, setShowUserInfo] = (0, import_react8.useState)(false);
|
|
5153
5154
|
const messages = messageList?.rows?.data || [];
|
|
5154
5155
|
const isEmpty = messages.length === 0;
|
|
5155
5156
|
const loadOlderMessages = () => {
|
|
@@ -5165,7 +5166,7 @@ function ChatUserMessage({
|
|
|
5165
5166
|
);
|
|
5166
5167
|
setPage(nextPage);
|
|
5167
5168
|
};
|
|
5168
|
-
(0,
|
|
5169
|
+
(0, import_react8.useEffect)(() => {
|
|
5169
5170
|
if (chatId) {
|
|
5170
5171
|
setPage(0);
|
|
5171
5172
|
dispatch(
|
|
@@ -5177,7 +5178,7 @@ function ChatUserMessage({
|
|
|
5177
5178
|
);
|
|
5178
5179
|
}
|
|
5179
5180
|
}, [chatId]);
|
|
5180
|
-
(0,
|
|
5181
|
+
(0, import_react8.useEffect)(() => {
|
|
5181
5182
|
if (!senderDetails?.userId) return;
|
|
5182
5183
|
const socket2 = getSocket(senderDetails?.userId || "");
|
|
5183
5184
|
if (!socket2) return;
|
|
@@ -5282,13 +5283,13 @@ function ChatUserMessage({
|
|
|
5282
5283
|
deleteMessagesByChatId({ chatId, userId: senderDetails?.userId })
|
|
5283
5284
|
);
|
|
5284
5285
|
};
|
|
5285
|
-
return /* @__PURE__ */
|
|
5286
|
+
return /* @__PURE__ */ import_react8.default.createElement("div", { className: "mrchat-mainArea" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "mrchat-chatHeader" }, receiverDetails && /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, /* @__PURE__ */ import_react8.default.createElement(
|
|
5286
5287
|
"div",
|
|
5287
5288
|
{
|
|
5288
5289
|
className: "mrchat-receiverInfo",
|
|
5289
5290
|
onClick: () => setShowUserInfo(true)
|
|
5290
5291
|
},
|
|
5291
|
-
receiverDetails?.avatar ? /* @__PURE__ */
|
|
5292
|
+
receiverDetails?.avatar ? /* @__PURE__ */ import_react8.default.createElement(import_core7.Avatar, { src: receiverDetails.avatar, size: 36, radius: "xl" }) : /* @__PURE__ */ import_react8.default.createElement(
|
|
5292
5293
|
import_core7.Avatar,
|
|
5293
5294
|
{
|
|
5294
5295
|
key: receiverDetails?.displayName || receiverDetails?.username,
|
|
@@ -5296,16 +5297,16 @@ function ChatUserMessage({
|
|
|
5296
5297
|
color: "initials"
|
|
5297
5298
|
}
|
|
5298
5299
|
),
|
|
5299
|
-
/* @__PURE__ */
|
|
5300
|
-
), /* @__PURE__ */
|
|
5300
|
+
/* @__PURE__ */ import_react8.default.createElement(import_core7.Text, { fw: 600, size: "md" }, receiverDetails?.displayName || receiverDetails?.username)
|
|
5301
|
+
), /* @__PURE__ */ import_react8.default.createElement(import_core7.Menu, { shadow: "md", width: 200, position: "bottom-end" }, /* @__PURE__ */ import_react8.default.createElement(import_core7.Menu.Target, null, /* @__PURE__ */ import_react8.default.createElement(import_icons_react3.IconDotsVertical, { size: 20, style: { cursor: "pointer" } })), /* @__PURE__ */ import_react8.default.createElement(import_core7.Menu.Dropdown, null, /* @__PURE__ */ import_react8.default.createElement(
|
|
5301
5302
|
import_core7.Menu.Item,
|
|
5302
5303
|
{
|
|
5303
5304
|
color: "red",
|
|
5304
|
-
leftSection: /* @__PURE__ */
|
|
5305
|
+
leftSection: /* @__PURE__ */ import_react8.default.createElement(import_icons_react3.IconTrash, { size: 16 }),
|
|
5305
5306
|
onClick: handleDeleteMessages
|
|
5306
5307
|
},
|
|
5307
5308
|
"Delete all messages"
|
|
5308
|
-
), /* @__PURE__ */
|
|
5309
|
+
), /* @__PURE__ */ import_react8.default.createElement(import_core7.Menu.Item, { color: "red", leftSection: /* @__PURE__ */ import_react8.default.createElement(import_icons_react3.IconBan, { size: 16 }) }, "Block"))))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "mrchat-messageArea" }, isEmpty ? /* @__PURE__ */ import_react8.default.createElement("div", { className: "mrchat-emptyState" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "mrchat-encryptionMinimal" }, /* @__PURE__ */ import_react8.default.createElement(import_icons_react3.IconLock, { size: 20, stroke: 1.8 }), /* @__PURE__ */ import_react8.default.createElement(import_core7.Text, { className: "mrchat-encryptionText", size: "md" }, "End-to-end encrypted"))) : /* @__PURE__ */ import_react8.default.createElement(
|
|
5309
5310
|
ChatScrollContainer,
|
|
5310
5311
|
{
|
|
5311
5312
|
data: messages,
|
|
@@ -5339,7 +5340,7 @@ function ChatUserMessage({
|
|
|
5339
5340
|
minute: "2-digit",
|
|
5340
5341
|
hour12: false
|
|
5341
5342
|
});
|
|
5342
|
-
return /* @__PURE__ */
|
|
5343
|
+
return /* @__PURE__ */ import_react8.default.createElement("div", { key: item?.id + "_" + index }, showDate && /* @__PURE__ */ import_react8.default.createElement("div", { className: "mrchat-dateSeparator" }, formattedDate), /* @__PURE__ */ import_react8.default.createElement(
|
|
5343
5344
|
"div",
|
|
5344
5345
|
{
|
|
5345
5346
|
style: {
|
|
@@ -5347,7 +5348,7 @@ function ChatUserMessage({
|
|
|
5347
5348
|
},
|
|
5348
5349
|
className: `${"mrchat-messageBubble"} ${isOutgoing ? "mrchat-outgoing" : "mrchat-incoming"}`
|
|
5349
5350
|
},
|
|
5350
|
-
/* @__PURE__ */
|
|
5351
|
+
/* @__PURE__ */ import_react8.default.createElement(
|
|
5351
5352
|
"div",
|
|
5352
5353
|
{
|
|
5353
5354
|
className: "mrchat-messageContent",
|
|
@@ -5356,11 +5357,11 @@ function ChatUserMessage({
|
|
|
5356
5357
|
}
|
|
5357
5358
|
}
|
|
5358
5359
|
),
|
|
5359
|
-
/* @__PURE__ */
|
|
5360
|
+
/* @__PURE__ */ import_react8.default.createElement("div", { className: "mrchat-messageTime" }, time)
|
|
5360
5361
|
));
|
|
5361
5362
|
}
|
|
5362
5363
|
}
|
|
5363
|
-
)), (chatId || enableChat) && /* @__PURE__ */
|
|
5364
|
+
)), (chatId || enableChat) && /* @__PURE__ */ import_react8.default.createElement("div", { className: "mrchat-inputBar" }, /* @__PURE__ */ import_react8.default.createElement(CustomRichTextEditor, { onSubmit: handleSendMessage })), /* @__PURE__ */ import_react8.default.createElement(
|
|
5364
5365
|
UserProfileDrawer,
|
|
5365
5366
|
{
|
|
5366
5367
|
opened: showUserInfo,
|
|
@@ -5382,7 +5383,7 @@ function ChatUserMessage({
|
|
|
5382
5383
|
|
|
5383
5384
|
// src/components/ChatUserList/ChatUserList.tsx
|
|
5384
5385
|
var import_react_redux3 = require("react-redux");
|
|
5385
|
-
var
|
|
5386
|
+
var import_react9 = __toESM(require("react"));
|
|
5386
5387
|
|
|
5387
5388
|
// src/components/ChatUserList/users_list.json
|
|
5388
5389
|
var users_list_default = [
|
|
@@ -6093,21 +6094,21 @@ function ChatUserList() {
|
|
|
6093
6094
|
const chatList = (0, import_react_redux3.useSelector)(
|
|
6094
6095
|
(state) => state.chat.messagedUserList
|
|
6095
6096
|
);
|
|
6096
|
-
const [page, setPage] = (0,
|
|
6097
|
-
const [chatId, setChatId] = (0,
|
|
6098
|
-
const [enableChat, setEnableChat] = (0,
|
|
6099
|
-
const [receiverSearchValue, setReceiverSearchValue] = (0,
|
|
6100
|
-
const [receiverDetails, setReceiverDetails] = (0,
|
|
6101
|
-
const [receiverUserDetails, setReceiverUserDetails] = (0,
|
|
6102
|
-
const [senderSearchValue, setSenderSearchValue] = (0,
|
|
6103
|
-
const [senderDetails, setSenderDetails] = (0,
|
|
6104
|
-
const [senderUserDetails, setSenderUserDetails] = (0,
|
|
6105
|
-
(0,
|
|
6097
|
+
const [page, setPage] = (0, import_react9.useState)(0);
|
|
6098
|
+
const [chatId, setChatId] = (0, import_react9.useState)("");
|
|
6099
|
+
const [enableChat, setEnableChat] = (0, import_react9.useState)(false);
|
|
6100
|
+
const [receiverSearchValue, setReceiverSearchValue] = (0, import_react9.useState)("");
|
|
6101
|
+
const [receiverDetails, setReceiverDetails] = (0, import_react9.useState)();
|
|
6102
|
+
const [receiverUserDetails, setReceiverUserDetails] = (0, import_react9.useState)();
|
|
6103
|
+
const [senderSearchValue, setSenderSearchValue] = (0, import_react9.useState)("");
|
|
6104
|
+
const [senderDetails, setSenderDetails] = (0, import_react9.useState)("");
|
|
6105
|
+
const [senderUserDetails, setSenderUserDetails] = (0, import_react9.useState)();
|
|
6106
|
+
(0, import_react9.useEffect)(() => {
|
|
6106
6107
|
if (senderUserDetails) {
|
|
6107
6108
|
setSenderDetails(senderUserDetails);
|
|
6108
6109
|
}
|
|
6109
6110
|
}, [senderUserDetails]);
|
|
6110
|
-
(0,
|
|
6111
|
+
(0, import_react9.useEffect)(() => {
|
|
6111
6112
|
if (!senderUserDetails) return;
|
|
6112
6113
|
dispatch(
|
|
6113
6114
|
fetchMessageListByUserId({ userId: senderUserDetails.userId, page: 0 })
|
|
@@ -6139,7 +6140,7 @@ function ChatUserList() {
|
|
|
6139
6140
|
setChatId("");
|
|
6140
6141
|
setEnableChat(true);
|
|
6141
6142
|
};
|
|
6142
|
-
(0,
|
|
6143
|
+
(0, import_react9.useEffect)(() => {
|
|
6143
6144
|
if (!senderDetails?.userId) return;
|
|
6144
6145
|
const socket2 = getSocket(senderDetails.userId);
|
|
6145
6146
|
if (!socket2) return;
|
|
@@ -6147,7 +6148,7 @@ function ChatUserList() {
|
|
|
6147
6148
|
socket2.connect();
|
|
6148
6149
|
}
|
|
6149
6150
|
}, [senderDetails?.userId]);
|
|
6150
|
-
(0,
|
|
6151
|
+
(0, import_react9.useEffect)(() => {
|
|
6151
6152
|
if (!senderUserDetails?.userId) return;
|
|
6152
6153
|
const socket2 = getSocket(senderDetails.userId);
|
|
6153
6154
|
if (!socket2) return;
|
|
@@ -6169,7 +6170,7 @@ function ChatUserList() {
|
|
|
6169
6170
|
socket2.off("newChat", handleNewChat);
|
|
6170
6171
|
};
|
|
6171
6172
|
}, [senderDetails.userId]);
|
|
6172
|
-
(0,
|
|
6173
|
+
(0, import_react9.useEffect)(() => {
|
|
6173
6174
|
if (!senderDetails?.userId) return;
|
|
6174
6175
|
const socket2 = getSocket(senderDetails?.userId || "");
|
|
6175
6176
|
if (!socket2) return;
|
|
@@ -6258,7 +6259,7 @@ function ChatUserList() {
|
|
|
6258
6259
|
label: user.displayName || user.username,
|
|
6259
6260
|
user
|
|
6260
6261
|
}));
|
|
6261
|
-
return /* @__PURE__ */
|
|
6262
|
+
return /* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-chatWrapper" }, /* @__PURE__ */ import_react9.default.createElement(
|
|
6262
6263
|
import_core8.Modal,
|
|
6263
6264
|
{
|
|
6264
6265
|
opened,
|
|
@@ -6270,7 +6271,7 @@ function ChatUserList() {
|
|
|
6270
6271
|
centered: true,
|
|
6271
6272
|
withCloseButton: true
|
|
6272
6273
|
},
|
|
6273
|
-
/* @__PURE__ */
|
|
6274
|
+
/* @__PURE__ */ import_react9.default.createElement(
|
|
6274
6275
|
import_core8.Autocomplete,
|
|
6275
6276
|
{
|
|
6276
6277
|
mb: 12,
|
|
@@ -6289,11 +6290,11 @@ function ChatUserList() {
|
|
|
6289
6290
|
},
|
|
6290
6291
|
renderOption: ({ option }) => {
|
|
6291
6292
|
const user = option.user;
|
|
6292
|
-
return /* @__PURE__ */
|
|
6293
|
+
return /* @__PURE__ */ import_react9.default.createElement(import_core8.Group, { gap: "sm" }, /* @__PURE__ */ import_react9.default.createElement(import_core8.Avatar, { src: user.avatar, size: 36, radius: "xl" }), /* @__PURE__ */ import_react9.default.createElement("div", null, /* @__PURE__ */ import_react9.default.createElement(import_core8.Text, { size: "sm" }, user.displayName || user.username), user.displayName && /* @__PURE__ */ import_react9.default.createElement(import_core8.Text, { size: "xs", opacity: 0.5 }, "@", user.username)));
|
|
6293
6294
|
}
|
|
6294
6295
|
}
|
|
6295
6296
|
),
|
|
6296
|
-
/* @__PURE__ */
|
|
6297
|
+
/* @__PURE__ */ import_react9.default.createElement(
|
|
6297
6298
|
import_core8.Autocomplete,
|
|
6298
6299
|
{
|
|
6299
6300
|
mb: 12,
|
|
@@ -6312,11 +6313,11 @@ function ChatUserList() {
|
|
|
6312
6313
|
},
|
|
6313
6314
|
renderOption: ({ option }) => {
|
|
6314
6315
|
const user = option.user;
|
|
6315
|
-
return /* @__PURE__ */
|
|
6316
|
+
return /* @__PURE__ */ import_react9.default.createElement(import_core8.Group, { gap: "sm" }, /* @__PURE__ */ import_react9.default.createElement(import_core8.Avatar, { src: user.avatar, size: 36, radius: "xl" }), /* @__PURE__ */ import_react9.default.createElement("div", null, /* @__PURE__ */ import_react9.default.createElement(import_core8.Text, { size: "sm" }, user.displayName || user.username), user.displayName && /* @__PURE__ */ import_react9.default.createElement(import_core8.Text, { size: "xs", opacity: 0.5 }, "@", user.username)));
|
|
6316
6317
|
}
|
|
6317
6318
|
}
|
|
6318
6319
|
),
|
|
6319
|
-
/* @__PURE__ */
|
|
6320
|
+
/* @__PURE__ */ import_react9.default.createElement(
|
|
6320
6321
|
import_core8.Button,
|
|
6321
6322
|
{
|
|
6322
6323
|
fullWidth: true,
|
|
@@ -6325,7 +6326,7 @@ function ChatUserList() {
|
|
|
6325
6326
|
},
|
|
6326
6327
|
"Start Chat"
|
|
6327
6328
|
)
|
|
6328
|
-
), /* @__PURE__ */
|
|
6329
|
+
), /* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-chatContainer" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-sidebar" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-sidebarTop" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-topBar" }, /* @__PURE__ */ import_react9.default.createElement(import_core8.Text, { size: "lg", fw: 600 }, "MrChat"), /* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-topActions" }, /* @__PURE__ */ import_react9.default.createElement(
|
|
6329
6330
|
import_core8.ActionIcon,
|
|
6330
6331
|
{
|
|
6331
6332
|
variant: "subtle",
|
|
@@ -6335,15 +6336,15 @@ function ChatUserList() {
|
|
|
6335
6336
|
},
|
|
6336
6337
|
radius: "lg"
|
|
6337
6338
|
},
|
|
6338
|
-
/* @__PURE__ */
|
|
6339
|
-
)))), /* @__PURE__ */
|
|
6339
|
+
/* @__PURE__ */ import_react9.default.createElement(import_icons_react4.IconPlus, { size: 20, stroke: 3 })
|
|
6340
|
+
)))), /* @__PURE__ */ import_react9.default.createElement(import_core8.Text, { size: "xs", c: "dimmed", mt: "sm", mb: "xs", ml: 12 }, "All Messages"), /* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-scrollWrapper" }, /* @__PURE__ */ import_react9.default.createElement(
|
|
6340
6341
|
VirtualizedList,
|
|
6341
6342
|
{
|
|
6342
6343
|
data: chatList?.rows?.data || [],
|
|
6343
6344
|
endReached: loadMoreChats,
|
|
6344
6345
|
itemContent: (_, item) => {
|
|
6345
6346
|
const isActive = item.chatId === chatId;
|
|
6346
|
-
return /* @__PURE__ */
|
|
6347
|
+
return /* @__PURE__ */ import_react9.default.createElement(
|
|
6347
6348
|
"div",
|
|
6348
6349
|
{
|
|
6349
6350
|
className: `${"mrchat-chatItem"} ${isActive ? "mrchat-activeChatItem" : ""}`,
|
|
@@ -6352,7 +6353,7 @@ function ChatUserList() {
|
|
|
6352
6353
|
handleJoinChat(item);
|
|
6353
6354
|
}
|
|
6354
6355
|
},
|
|
6355
|
-
item.avatar ? /* @__PURE__ */
|
|
6356
|
+
item.avatar ? /* @__PURE__ */ import_react9.default.createElement(import_core8.Avatar, { src: item.avatar, size: 36, radius: "xl" }) : /* @__PURE__ */ import_react9.default.createElement(
|
|
6356
6357
|
import_core8.Avatar,
|
|
6357
6358
|
{
|
|
6358
6359
|
key: item.displayName || item.username,
|
|
@@ -6360,7 +6361,7 @@ function ChatUserList() {
|
|
|
6360
6361
|
color: "initials"
|
|
6361
6362
|
}
|
|
6362
6363
|
),
|
|
6363
|
-
/* @__PURE__ */
|
|
6364
|
+
/* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-chatInfo" }, /* @__PURE__ */ import_react9.default.createElement(import_core8.Text, { className: "mrchat-chatLabelItem", truncate: true }, item.displayName || item.username), item.unreadCount > 0 && /* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-unreadBadge" }, item.unreadCount || 10), /* @__PURE__ */ import_react9.default.createElement("div", { className: "mrchat-messagePreview" }, /* @__PURE__ */ import_react9.default.createElement(
|
|
6364
6365
|
import_core8.Text,
|
|
6365
6366
|
{
|
|
6366
6367
|
truncate: true,
|
|
@@ -6370,7 +6371,7 @@ function ChatUserList() {
|
|
|
6370
6371
|
className: "mrchat-messagePreviewContent"
|
|
6371
6372
|
},
|
|
6372
6373
|
stripHtml(import_dompurify2.default.sanitize(item.message))
|
|
6373
|
-
), /* @__PURE__ */
|
|
6374
|
+
), /* @__PURE__ */ import_react9.default.createElement(
|
|
6374
6375
|
import_core8.Text,
|
|
6375
6376
|
{
|
|
6376
6377
|
size: "xs",
|
|
@@ -6382,7 +6383,7 @@ function ChatUserList() {
|
|
|
6382
6383
|
);
|
|
6383
6384
|
}
|
|
6384
6385
|
}
|
|
6385
|
-
))), /* @__PURE__ */
|
|
6386
|
+
))), /* @__PURE__ */ import_react9.default.createElement(
|
|
6386
6387
|
ChatUserMessage,
|
|
6387
6388
|
{
|
|
6388
6389
|
chatId,
|
|
@@ -6404,9 +6405,9 @@ function ChatUserList() {
|
|
|
6404
6405
|
|
|
6405
6406
|
// src/components/MrChat/index.tsx
|
|
6406
6407
|
function MrChat(props) {
|
|
6407
|
-
const [primaryColor] = (0,
|
|
6408
|
+
const [primaryColor] = (0, import_react10.useState)("customBrand");
|
|
6408
6409
|
const theme = createAppTheme(primaryColor);
|
|
6409
|
-
return /* @__PURE__ */
|
|
6410
|
+
return /* @__PURE__ */ import_react10.default.createElement(ReduxProvider, null, /* @__PURE__ */ import_react10.default.createElement(SocketProvider, null, /* @__PURE__ */ import_react10.default.createElement(import_core9.MantineProvider, { defaultColorScheme: "light", theme }, /* @__PURE__ */ import_react10.default.createElement(import_notifications2.Notifications, null), /* @__PURE__ */ import_react10.default.createElement(ChatUserList, { ...props }))));
|
|
6410
6411
|
}
|
|
6411
6412
|
// Annotate the CommonJS export names for ESM import in node:
|
|
6412
6413
|
0 && (module.exports = {
|
package/dist/index.mjs
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import "@mantine/core/styles.css";
|
|
3
3
|
import "@mantine/tiptap/styles.css";
|
|
4
4
|
import "@mantine/notifications/styles.css";
|
|
5
|
-
import
|
|
5
|
+
import React10, { useState as useState6 } from "react";
|
|
6
6
|
import { MantineProvider } from "@mantine/core";
|
|
7
7
|
import { Notifications } from "@mantine/notifications";
|
|
8
8
|
|
|
@@ -83,6 +83,7 @@ var createAppTheme = (primaryColor) => createTheme({
|
|
|
83
83
|
});
|
|
84
84
|
|
|
85
85
|
// src/store/provider.tsx
|
|
86
|
+
import React2 from "react";
|
|
86
87
|
import { Provider } from "react-redux";
|
|
87
88
|
|
|
88
89
|
// src/store/store.ts
|
|
@@ -290,11 +291,11 @@ var store = configureStore({
|
|
|
290
291
|
|
|
291
292
|
// src/store/provider.tsx
|
|
292
293
|
function ReduxProvider({ children }) {
|
|
293
|
-
return /* @__PURE__ */
|
|
294
|
+
return /* @__PURE__ */ React2.createElement(Provider, { store }, children);
|
|
294
295
|
}
|
|
295
296
|
|
|
296
297
|
// src/store/socket/index.tsx
|
|
297
|
-
import { useEffect } from "react";
|
|
298
|
+
import React3, { useEffect } from "react";
|
|
298
299
|
|
|
299
300
|
// src/lib/socket.ts
|
|
300
301
|
import { io } from "socket.io-client";
|
|
@@ -337,7 +338,7 @@ function SocketProvider({ children, userId }) {
|
|
|
337
338
|
}
|
|
338
339
|
};
|
|
339
340
|
}, [userId]);
|
|
340
|
-
return /* @__PURE__ */
|
|
341
|
+
return /* @__PURE__ */ React3.createElement(React3.Fragment, null, children);
|
|
341
342
|
}
|
|
342
343
|
|
|
343
344
|
// src/components/ChatUserList/ChatUserList.tsx
|
|
@@ -363,7 +364,7 @@ import {
|
|
|
363
364
|
} from "@tabler/icons-react";
|
|
364
365
|
|
|
365
366
|
// src/components/RichTextEditor/RichTextEditor.tsx
|
|
366
|
-
import { useState as useState2 } from "react";
|
|
367
|
+
import React5, { useState as useState2 } from "react";
|
|
367
368
|
import {
|
|
368
369
|
IconSend,
|
|
369
370
|
IconAlignLeft,
|
|
@@ -4738,7 +4739,7 @@ import { Link, RichTextEditor } from "@mantine/tiptap";
|
|
|
4738
4739
|
import { ActionIcon, Menu } from "@mantine/core";
|
|
4739
4740
|
|
|
4740
4741
|
// src/components/EmojiPickerPopover/EmojiPickerPopover.tsx
|
|
4741
|
-
import {
|
|
4742
|
+
import React4, {
|
|
4742
4743
|
useState,
|
|
4743
4744
|
lazy,
|
|
4744
4745
|
Suspense,
|
|
@@ -4755,7 +4756,7 @@ function EmojiPickerPopover({
|
|
|
4755
4756
|
position = "bottom-start"
|
|
4756
4757
|
}) {
|
|
4757
4758
|
const [opened, setOpened] = useState(false);
|
|
4758
|
-
return /* @__PURE__ */
|
|
4759
|
+
return /* @__PURE__ */ React4.createElement(
|
|
4759
4760
|
Popover,
|
|
4760
4761
|
{
|
|
4761
4762
|
opened,
|
|
@@ -4768,18 +4769,18 @@ function EmojiPickerPopover({
|
|
|
4768
4769
|
trapFocus: false,
|
|
4769
4770
|
closeOnEscape: true
|
|
4770
4771
|
},
|
|
4771
|
-
/* @__PURE__ */
|
|
4772
|
+
/* @__PURE__ */ React4.createElement(Popover.Target, null, cloneElement(action, {
|
|
4772
4773
|
onClick: (e) => {
|
|
4773
4774
|
action.props?.onClick?.(e);
|
|
4774
4775
|
setOpened((prev) => !prev);
|
|
4775
4776
|
}
|
|
4776
4777
|
})),
|
|
4777
|
-
/* @__PURE__ */
|
|
4778
|
+
/* @__PURE__ */ React4.createElement(Popover.Dropdown, { p: 0 }, /* @__PURE__ */ React4.createElement(
|
|
4778
4779
|
Suspense,
|
|
4779
4780
|
{
|
|
4780
|
-
fallback: /* @__PURE__ */
|
|
4781
|
+
fallback: /* @__PURE__ */ React4.createElement("div", { style: { padding: 12, width: 320 } }, /* @__PURE__ */ React4.createElement(Skeleton, { height: 280, radius: "md" }))
|
|
4781
4782
|
},
|
|
4782
|
-
/* @__PURE__ */
|
|
4783
|
+
/* @__PURE__ */ React4.createElement(
|
|
4783
4784
|
EmojiPicker,
|
|
4784
4785
|
{
|
|
4785
4786
|
previewPosition: "none",
|
|
@@ -4877,15 +4878,15 @@ function CustomRichTextEditor({
|
|
|
4877
4878
|
editor.commands.focus();
|
|
4878
4879
|
setCharCount(0);
|
|
4879
4880
|
};
|
|
4880
|
-
return /* @__PURE__ */
|
|
4881
|
+
return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(
|
|
4881
4882
|
RichTextEditor,
|
|
4882
4883
|
{
|
|
4883
4884
|
editor,
|
|
4884
4885
|
w: "100%",
|
|
4885
4886
|
className: "mrchat-richTextEditorContainer"
|
|
4886
4887
|
},
|
|
4887
|
-
/* @__PURE__ */
|
|
4888
|
-
/* @__PURE__ */
|
|
4888
|
+
/* @__PURE__ */ React5.createElement(RichTextEditor.Content, null),
|
|
4889
|
+
/* @__PURE__ */ React5.createElement(RichTextEditor.Toolbar, { sticky: true, stickyOffset: "var(--docs-header-height)" }, /* @__PURE__ */ React5.createElement("div", { className: "mrchat-mainActionContainer" }, /* @__PURE__ */ React5.createElement(
|
|
4889
4890
|
EmojiPickerPopover,
|
|
4890
4891
|
{
|
|
4891
4892
|
onSelect: (emoji) => {
|
|
@@ -4896,7 +4897,7 @@ function CustomRichTextEditor({
|
|
|
4896
4897
|
}
|
|
4897
4898
|
}).run();
|
|
4898
4899
|
},
|
|
4899
|
-
action: /* @__PURE__ */
|
|
4900
|
+
action: /* @__PURE__ */ React5.createElement(
|
|
4900
4901
|
ActionIcon,
|
|
4901
4902
|
{
|
|
4902
4903
|
radius: "lg",
|
|
@@ -4905,10 +4906,10 @@ function CustomRichTextEditor({
|
|
|
4905
4906
|
color: "#333",
|
|
4906
4907
|
className: "mrchat-mainActionEmojiIcon"
|
|
4907
4908
|
},
|
|
4908
|
-
/* @__PURE__ */
|
|
4909
|
+
/* @__PURE__ */ React5.createElement(AddReaction_default, null)
|
|
4909
4910
|
)
|
|
4910
4911
|
}
|
|
4911
|
-
), /* @__PURE__ */
|
|
4912
|
+
), /* @__PURE__ */ React5.createElement(
|
|
4912
4913
|
ActionIcon,
|
|
4913
4914
|
{
|
|
4914
4915
|
radius: "lg",
|
|
@@ -4918,8 +4919,8 @@ function CustomRichTextEditor({
|
|
|
4918
4919
|
className: "mrchat-mainTextFormatIcon",
|
|
4919
4920
|
onClick: () => setShowToolbar((prev) => !prev)
|
|
4920
4921
|
},
|
|
4921
|
-
/* @__PURE__ */
|
|
4922
|
-
), /* @__PURE__ */
|
|
4922
|
+
/* @__PURE__ */ React5.createElement(TextFormat_default, null)
|
|
4923
|
+
), /* @__PURE__ */ React5.createElement(
|
|
4923
4924
|
ActionIcon,
|
|
4924
4925
|
{
|
|
4925
4926
|
radius: "lg",
|
|
@@ -4928,15 +4929,15 @@ function CustomRichTextEditor({
|
|
|
4928
4929
|
className: "mrchat-mainSendMsgIcon",
|
|
4929
4930
|
onClick: () => handleSubmitMsg()
|
|
4930
4931
|
},
|
|
4931
|
-
/* @__PURE__ */
|
|
4932
|
-
)), showToolbar && /* @__PURE__ */
|
|
4932
|
+
/* @__PURE__ */ React5.createElement(IconSend, { size: 18 })
|
|
4933
|
+
)), showToolbar && /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(RichTextEditor.ControlsGroup, null, /* @__PURE__ */ React5.createElement(RichTextEditor.Bold, null), /* @__PURE__ */ React5.createElement(RichTextEditor.Italic, null), /* @__PURE__ */ React5.createElement(RichTextEditor.Underline, null), /* @__PURE__ */ React5.createElement(RichTextEditor.Strikethrough, null), /* @__PURE__ */ React5.createElement(RichTextEditor.Code, null), /* @__PURE__ */ React5.createElement(RichTextEditor.Highlight, null)), /* @__PURE__ */ React5.createElement(
|
|
4933
4934
|
RichTextEditor.ControlsGroup,
|
|
4934
4935
|
{
|
|
4935
4936
|
className: "mrchat-secondRichTextEditorToolBar"
|
|
4936
4937
|
},
|
|
4937
|
-
/* @__PURE__ */
|
|
4938
|
-
/* @__PURE__ */
|
|
4939
|
-
/* @__PURE__ */
|
|
4938
|
+
/* @__PURE__ */ React5.createElement(RichTextEditor.BulletList, null),
|
|
4939
|
+
/* @__PURE__ */ React5.createElement(RichTextEditor.OrderedList, null),
|
|
4940
|
+
/* @__PURE__ */ React5.createElement(Menu, { trigger: "hover", openDelay: 200 }, /* @__PURE__ */ React5.createElement(Menu.Target, null, /* @__PURE__ */ React5.createElement(
|
|
4940
4941
|
ActionIcon,
|
|
4941
4942
|
{
|
|
4942
4943
|
variant: "outline",
|
|
@@ -4944,35 +4945,35 @@ function CustomRichTextEditor({
|
|
|
4944
4945
|
color: "#495057",
|
|
4945
4946
|
className: "mrchat-customToolActionItem"
|
|
4946
4947
|
},
|
|
4947
|
-
/* @__PURE__ */
|
|
4948
|
-
)), /* @__PURE__ */
|
|
4948
|
+
/* @__PURE__ */ React5.createElement(IconAlignLeft, { size: 16, stroke: 1.5 })
|
|
4949
|
+
)), /* @__PURE__ */ React5.createElement(Menu.Dropdown, null, /* @__PURE__ */ React5.createElement(
|
|
4949
4950
|
Menu.Item,
|
|
4950
4951
|
{
|
|
4951
4952
|
onClick: () => editor?.chain().focus().setTextAlign("left").run()
|
|
4952
4953
|
},
|
|
4953
|
-
/* @__PURE__ */
|
|
4954
|
-
), /* @__PURE__ */
|
|
4954
|
+
/* @__PURE__ */ React5.createElement(IconAlignLeft, { size: 14 })
|
|
4955
|
+
), /* @__PURE__ */ React5.createElement(
|
|
4955
4956
|
Menu.Item,
|
|
4956
4957
|
{
|
|
4957
4958
|
onClick: () => editor?.chain().focus().setTextAlign("center").run()
|
|
4958
4959
|
},
|
|
4959
|
-
/* @__PURE__ */
|
|
4960
|
-
), /* @__PURE__ */
|
|
4960
|
+
/* @__PURE__ */ React5.createElement(IconAlignCenter, { size: 14 })
|
|
4961
|
+
), /* @__PURE__ */ React5.createElement(
|
|
4961
4962
|
Menu.Item,
|
|
4962
4963
|
{
|
|
4963
4964
|
onClick: () => editor?.chain().focus().setTextAlign("right").run()
|
|
4964
4965
|
},
|
|
4965
|
-
/* @__PURE__ */
|
|
4966
|
+
/* @__PURE__ */ React5.createElement(IconAlignRight, { size: 14 })
|
|
4966
4967
|
))),
|
|
4967
|
-
/* @__PURE__ */
|
|
4968
|
-
), /* @__PURE__ */
|
|
4968
|
+
/* @__PURE__ */ React5.createElement(RichTextEditor.Link, null)
|
|
4969
|
+
), /* @__PURE__ */ React5.createElement(
|
|
4969
4970
|
RichTextEditor.ControlsGroup,
|
|
4970
4971
|
{
|
|
4971
4972
|
className: "mrchat-secondRichTextEditorToolBar"
|
|
4972
4973
|
},
|
|
4973
|
-
/* @__PURE__ */
|
|
4974
|
+
/* @__PURE__ */ React5.createElement(RichTextEditor.ClearFormatting, null)
|
|
4974
4975
|
))),
|
|
4975
|
-
showWarning && /* @__PURE__ */
|
|
4976
|
+
showWarning && /* @__PURE__ */ React5.createElement(
|
|
4976
4977
|
"div",
|
|
4977
4978
|
{
|
|
4978
4979
|
style: {
|
|
@@ -4993,11 +4994,11 @@ function CustomRichTextEditor({
|
|
|
4993
4994
|
|
|
4994
4995
|
// src/components/ChatUserList/ChatUserMessage.tsx
|
|
4995
4996
|
import { useDispatch, useSelector } from "react-redux";
|
|
4996
|
-
import { useEffect as useEffect4, useState as useState4 } from "react";
|
|
4997
|
+
import React8, { useEffect as useEffect4, useState as useState4 } from "react";
|
|
4997
4998
|
import DOMPurify from "dompurify";
|
|
4998
4999
|
|
|
4999
5000
|
// src/components/VirtualizedList/ChatScrollContainer.tsx
|
|
5000
|
-
import
|
|
5001
|
+
import React6, { useRef, useEffect as useEffect2 } from "react";
|
|
5001
5002
|
function ChatScrollContainer({
|
|
5002
5003
|
data: data2,
|
|
5003
5004
|
renderItem,
|
|
@@ -5046,7 +5047,7 @@ function ChatScrollContainer({
|
|
|
5046
5047
|
isFetchingRef.current = false;
|
|
5047
5048
|
}, 0);
|
|
5048
5049
|
};
|
|
5049
|
-
return /* @__PURE__ */
|
|
5050
|
+
return /* @__PURE__ */ React6.createElement(
|
|
5050
5051
|
"div",
|
|
5051
5052
|
{
|
|
5052
5053
|
ref: containerRef,
|
|
@@ -5058,12 +5059,12 @@ function ChatScrollContainer({
|
|
|
5058
5059
|
flexDirection: "column"
|
|
5059
5060
|
}
|
|
5060
5061
|
},
|
|
5061
|
-
data2.map((item, index) => /* @__PURE__ */
|
|
5062
|
+
data2.map((item, index) => /* @__PURE__ */ React6.createElement("div", { key: item?.id || index }, renderItem(item, index)))
|
|
5062
5063
|
);
|
|
5063
5064
|
}
|
|
5064
5065
|
|
|
5065
5066
|
// src/components/UserProfile/UserProfileDrawer.tsx
|
|
5066
|
-
import { useEffect as useEffect3, useState as useState3 } from "react";
|
|
5067
|
+
import React7, { useEffect as useEffect3, useState as useState3 } from "react";
|
|
5067
5068
|
import { Avatar, Text } from "@mantine/core";
|
|
5068
5069
|
import {
|
|
5069
5070
|
IconArrowLeft,
|
|
@@ -5087,14 +5088,14 @@ function UserProfileDrawer({
|
|
|
5087
5088
|
setTimeout(onClose, 250);
|
|
5088
5089
|
};
|
|
5089
5090
|
if (!opened && !visible) return null;
|
|
5090
|
-
return /* @__PURE__ */
|
|
5091
|
+
return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement("div", { className: "mrchat-overlay", onClick: handleClose }, /* @__PURE__ */ React7.createElement(
|
|
5091
5092
|
"div",
|
|
5092
5093
|
{
|
|
5093
5094
|
className: `${"mrchat-drawer"} ${visible ? "mrchat-open" : "mrchat-close"}`,
|
|
5094
5095
|
onClick: (e) => e.stopPropagation()
|
|
5095
5096
|
},
|
|
5096
|
-
/* @__PURE__ */
|
|
5097
|
-
/* @__PURE__ */
|
|
5097
|
+
/* @__PURE__ */ React7.createElement("div", { className: "mrchat-header" }, /* @__PURE__ */ React7.createElement("div", { className: "mrchat-backBtn", onClick: handleClose }, /* @__PURE__ */ React7.createElement(IconArrowLeft, { size: 20 })), /* @__PURE__ */ React7.createElement(Text, { fw: 600 }, "Contact info")),
|
|
5098
|
+
/* @__PURE__ */ React7.createElement("div", { className: "mrchat-profileSection" }, /* @__PURE__ */ React7.createElement(
|
|
5098
5099
|
Avatar,
|
|
5099
5100
|
{
|
|
5100
5101
|
src: user?.avatar,
|
|
@@ -5103,31 +5104,31 @@ function UserProfileDrawer({
|
|
|
5103
5104
|
style: { cursor: "pointer" },
|
|
5104
5105
|
onClick: () => user?.avatar ? setShowImagePreview(true) : {}
|
|
5105
5106
|
}
|
|
5106
|
-
), /* @__PURE__ */
|
|
5107
|
-
/* @__PURE__ */
|
|
5107
|
+
), /* @__PURE__ */ React7.createElement(Text, { fw: 700, size: "lg", mt: "sm" }, user?.displayName), /* @__PURE__ */ React7.createElement(Text, { size: "sm", c: "dimmed" }, "@", user?.username)),
|
|
5108
|
+
/* @__PURE__ */ React7.createElement("div", { className: "mrchat-actions" }, /* @__PURE__ */ React7.createElement(
|
|
5108
5109
|
"div",
|
|
5109
5110
|
{
|
|
5110
5111
|
className: `${"mrchat-item"} ${"mrchat-itemDanger"}`,
|
|
5111
5112
|
onClick: onDeleteMessages
|
|
5112
5113
|
},
|
|
5113
|
-
/* @__PURE__ */
|
|
5114
|
-
/* @__PURE__ */
|
|
5115
|
-
), /* @__PURE__ */
|
|
5114
|
+
/* @__PURE__ */ React7.createElement(IconTrash, { size: 18 }),
|
|
5115
|
+
/* @__PURE__ */ React7.createElement("span", null, "Delete all messages")
|
|
5116
|
+
), /* @__PURE__ */ React7.createElement(
|
|
5116
5117
|
"div",
|
|
5117
5118
|
{
|
|
5118
5119
|
className: `${"mrchat-item"} ${"mrchat-itemDanger"}`,
|
|
5119
5120
|
onClick: onBlock
|
|
5120
5121
|
},
|
|
5121
|
-
/* @__PURE__ */
|
|
5122
|
-
/* @__PURE__ */
|
|
5122
|
+
/* @__PURE__ */ React7.createElement(IconBan, { size: 18 }),
|
|
5123
|
+
/* @__PURE__ */ React7.createElement("span", null, "Block")
|
|
5123
5124
|
))
|
|
5124
|
-
)), showImagePreview && /* @__PURE__ */
|
|
5125
|
+
)), showImagePreview && /* @__PURE__ */ React7.createElement(
|
|
5125
5126
|
"div",
|
|
5126
5127
|
{
|
|
5127
5128
|
className: "mrchat-imagePreview",
|
|
5128
5129
|
onClick: () => setShowImagePreview(false)
|
|
5129
5130
|
},
|
|
5130
|
-
/* @__PURE__ */
|
|
5131
|
+
/* @__PURE__ */ React7.createElement("img", { src: user?.avatar, alt: "profile" })
|
|
5131
5132
|
));
|
|
5132
5133
|
}
|
|
5133
5134
|
|
|
@@ -5278,13 +5279,13 @@ function ChatUserMessage({
|
|
|
5278
5279
|
deleteMessagesByChatId({ chatId, userId: senderDetails?.userId })
|
|
5279
5280
|
);
|
|
5280
5281
|
};
|
|
5281
|
-
return /* @__PURE__ */
|
|
5282
|
+
return /* @__PURE__ */ React8.createElement("div", { className: "mrchat-mainArea" }, /* @__PURE__ */ React8.createElement("div", { className: "mrchat-chatHeader" }, receiverDetails && /* @__PURE__ */ React8.createElement(React8.Fragment, null, /* @__PURE__ */ React8.createElement(
|
|
5282
5283
|
"div",
|
|
5283
5284
|
{
|
|
5284
5285
|
className: "mrchat-receiverInfo",
|
|
5285
5286
|
onClick: () => setShowUserInfo(true)
|
|
5286
5287
|
},
|
|
5287
|
-
receiverDetails?.avatar ? /* @__PURE__ */
|
|
5288
|
+
receiverDetails?.avatar ? /* @__PURE__ */ React8.createElement(Avatar2, { src: receiverDetails.avatar, size: 36, radius: "xl" }) : /* @__PURE__ */ React8.createElement(
|
|
5288
5289
|
Avatar2,
|
|
5289
5290
|
{
|
|
5290
5291
|
key: receiverDetails?.displayName || receiverDetails?.username,
|
|
@@ -5292,16 +5293,16 @@ function ChatUserMessage({
|
|
|
5292
5293
|
color: "initials"
|
|
5293
5294
|
}
|
|
5294
5295
|
),
|
|
5295
|
-
/* @__PURE__ */
|
|
5296
|
-
), /* @__PURE__ */
|
|
5296
|
+
/* @__PURE__ */ React8.createElement(Text2, { fw: 600, size: "md" }, receiverDetails?.displayName || receiverDetails?.username)
|
|
5297
|
+
), /* @__PURE__ */ React8.createElement(Menu2, { shadow: "md", width: 200, position: "bottom-end" }, /* @__PURE__ */ React8.createElement(Menu2.Target, null, /* @__PURE__ */ React8.createElement(IconDotsVertical, { size: 20, style: { cursor: "pointer" } })), /* @__PURE__ */ React8.createElement(Menu2.Dropdown, null, /* @__PURE__ */ React8.createElement(
|
|
5297
5298
|
Menu2.Item,
|
|
5298
5299
|
{
|
|
5299
5300
|
color: "red",
|
|
5300
|
-
leftSection: /* @__PURE__ */
|
|
5301
|
+
leftSection: /* @__PURE__ */ React8.createElement(IconTrash2, { size: 16 }),
|
|
5301
5302
|
onClick: handleDeleteMessages
|
|
5302
5303
|
},
|
|
5303
5304
|
"Delete all messages"
|
|
5304
|
-
), /* @__PURE__ */
|
|
5305
|
+
), /* @__PURE__ */ React8.createElement(Menu2.Item, { color: "red", leftSection: /* @__PURE__ */ React8.createElement(IconBan2, { size: 16 }) }, "Block"))))), /* @__PURE__ */ React8.createElement("div", { className: "mrchat-messageArea" }, isEmpty ? /* @__PURE__ */ React8.createElement("div", { className: "mrchat-emptyState" }, /* @__PURE__ */ React8.createElement("div", { className: "mrchat-encryptionMinimal" }, /* @__PURE__ */ React8.createElement(IconLock, { size: 20, stroke: 1.8 }), /* @__PURE__ */ React8.createElement(Text2, { className: "mrchat-encryptionText", size: "md" }, "End-to-end encrypted"))) : /* @__PURE__ */ React8.createElement(
|
|
5305
5306
|
ChatScrollContainer,
|
|
5306
5307
|
{
|
|
5307
5308
|
data: messages,
|
|
@@ -5335,7 +5336,7 @@ function ChatUserMessage({
|
|
|
5335
5336
|
minute: "2-digit",
|
|
5336
5337
|
hour12: false
|
|
5337
5338
|
});
|
|
5338
|
-
return /* @__PURE__ */
|
|
5339
|
+
return /* @__PURE__ */ React8.createElement("div", { key: item?.id + "_" + index }, showDate && /* @__PURE__ */ React8.createElement("div", { className: "mrchat-dateSeparator" }, formattedDate), /* @__PURE__ */ React8.createElement(
|
|
5339
5340
|
"div",
|
|
5340
5341
|
{
|
|
5341
5342
|
style: {
|
|
@@ -5343,7 +5344,7 @@ function ChatUserMessage({
|
|
|
5343
5344
|
},
|
|
5344
5345
|
className: `${"mrchat-messageBubble"} ${isOutgoing ? "mrchat-outgoing" : "mrchat-incoming"}`
|
|
5345
5346
|
},
|
|
5346
|
-
/* @__PURE__ */
|
|
5347
|
+
/* @__PURE__ */ React8.createElement(
|
|
5347
5348
|
"div",
|
|
5348
5349
|
{
|
|
5349
5350
|
className: "mrchat-messageContent",
|
|
@@ -5352,11 +5353,11 @@ function ChatUserMessage({
|
|
|
5352
5353
|
}
|
|
5353
5354
|
}
|
|
5354
5355
|
),
|
|
5355
|
-
/* @__PURE__ */
|
|
5356
|
+
/* @__PURE__ */ React8.createElement("div", { className: "mrchat-messageTime" }, time)
|
|
5356
5357
|
));
|
|
5357
5358
|
}
|
|
5358
5359
|
}
|
|
5359
|
-
)), (chatId || enableChat) && /* @__PURE__ */
|
|
5360
|
+
)), (chatId || enableChat) && /* @__PURE__ */ React8.createElement("div", { className: "mrchat-inputBar" }, /* @__PURE__ */ React8.createElement(CustomRichTextEditor, { onSubmit: handleSendMessage })), /* @__PURE__ */ React8.createElement(
|
|
5360
5361
|
UserProfileDrawer,
|
|
5361
5362
|
{
|
|
5362
5363
|
opened: showUserInfo,
|
|
@@ -5378,7 +5379,7 @@ function ChatUserMessage({
|
|
|
5378
5379
|
|
|
5379
5380
|
// src/components/ChatUserList/ChatUserList.tsx
|
|
5380
5381
|
import { useDispatch as useDispatch2, useSelector as useSelector2 } from "react-redux";
|
|
5381
|
-
import { useEffect as useEffect5, useState as useState5 } from "react";
|
|
5382
|
+
import React9, { useEffect as useEffect5, useState as useState5 } from "react";
|
|
5382
5383
|
|
|
5383
5384
|
// src/components/ChatUserList/users_list.json
|
|
5384
5385
|
var users_list_default = [
|
|
@@ -6254,7 +6255,7 @@ function ChatUserList() {
|
|
|
6254
6255
|
label: user.displayName || user.username,
|
|
6255
6256
|
user
|
|
6256
6257
|
}));
|
|
6257
|
-
return /* @__PURE__ */
|
|
6258
|
+
return /* @__PURE__ */ React9.createElement("div", { className: "mrchat-chatWrapper" }, /* @__PURE__ */ React9.createElement(
|
|
6258
6259
|
Modal,
|
|
6259
6260
|
{
|
|
6260
6261
|
opened,
|
|
@@ -6266,7 +6267,7 @@ function ChatUserList() {
|
|
|
6266
6267
|
centered: true,
|
|
6267
6268
|
withCloseButton: true
|
|
6268
6269
|
},
|
|
6269
|
-
/* @__PURE__ */
|
|
6270
|
+
/* @__PURE__ */ React9.createElement(
|
|
6270
6271
|
Autocomplete,
|
|
6271
6272
|
{
|
|
6272
6273
|
mb: 12,
|
|
@@ -6285,11 +6286,11 @@ function ChatUserList() {
|
|
|
6285
6286
|
},
|
|
6286
6287
|
renderOption: ({ option }) => {
|
|
6287
6288
|
const user = option.user;
|
|
6288
|
-
return /* @__PURE__ */
|
|
6289
|
+
return /* @__PURE__ */ React9.createElement(Group, { gap: "sm" }, /* @__PURE__ */ React9.createElement(Avatar3, { src: user.avatar, size: 36, radius: "xl" }), /* @__PURE__ */ React9.createElement("div", null, /* @__PURE__ */ React9.createElement(Text3, { size: "sm" }, user.displayName || user.username), user.displayName && /* @__PURE__ */ React9.createElement(Text3, { size: "xs", opacity: 0.5 }, "@", user.username)));
|
|
6289
6290
|
}
|
|
6290
6291
|
}
|
|
6291
6292
|
),
|
|
6292
|
-
/* @__PURE__ */
|
|
6293
|
+
/* @__PURE__ */ React9.createElement(
|
|
6293
6294
|
Autocomplete,
|
|
6294
6295
|
{
|
|
6295
6296
|
mb: 12,
|
|
@@ -6308,11 +6309,11 @@ function ChatUserList() {
|
|
|
6308
6309
|
},
|
|
6309
6310
|
renderOption: ({ option }) => {
|
|
6310
6311
|
const user = option.user;
|
|
6311
|
-
return /* @__PURE__ */
|
|
6312
|
+
return /* @__PURE__ */ React9.createElement(Group, { gap: "sm" }, /* @__PURE__ */ React9.createElement(Avatar3, { src: user.avatar, size: 36, radius: "xl" }), /* @__PURE__ */ React9.createElement("div", null, /* @__PURE__ */ React9.createElement(Text3, { size: "sm" }, user.displayName || user.username), user.displayName && /* @__PURE__ */ React9.createElement(Text3, { size: "xs", opacity: 0.5 }, "@", user.username)));
|
|
6312
6313
|
}
|
|
6313
6314
|
}
|
|
6314
6315
|
),
|
|
6315
|
-
/* @__PURE__ */
|
|
6316
|
+
/* @__PURE__ */ React9.createElement(
|
|
6316
6317
|
Button,
|
|
6317
6318
|
{
|
|
6318
6319
|
fullWidth: true,
|
|
@@ -6321,7 +6322,7 @@ function ChatUserList() {
|
|
|
6321
6322
|
},
|
|
6322
6323
|
"Start Chat"
|
|
6323
6324
|
)
|
|
6324
|
-
), /* @__PURE__ */
|
|
6325
|
+
), /* @__PURE__ */ React9.createElement("div", { className: "mrchat-chatContainer" }, /* @__PURE__ */ React9.createElement("div", { className: "mrchat-sidebar" }, /* @__PURE__ */ React9.createElement("div", { className: "mrchat-sidebarTop" }, /* @__PURE__ */ React9.createElement("div", { className: "mrchat-topBar" }, /* @__PURE__ */ React9.createElement(Text3, { size: "lg", fw: 600 }, "MrChat"), /* @__PURE__ */ React9.createElement("div", { className: "mrchat-topActions" }, /* @__PURE__ */ React9.createElement(
|
|
6325
6326
|
ActionIcon2,
|
|
6326
6327
|
{
|
|
6327
6328
|
variant: "subtle",
|
|
@@ -6331,15 +6332,15 @@ function ChatUserList() {
|
|
|
6331
6332
|
},
|
|
6332
6333
|
radius: "lg"
|
|
6333
6334
|
},
|
|
6334
|
-
/* @__PURE__ */
|
|
6335
|
-
)))), /* @__PURE__ */
|
|
6335
|
+
/* @__PURE__ */ React9.createElement(IconPlus, { size: 20, stroke: 3 })
|
|
6336
|
+
)))), /* @__PURE__ */ React9.createElement(Text3, { size: "xs", c: "dimmed", mt: "sm", mb: "xs", ml: 12 }, "All Messages"), /* @__PURE__ */ React9.createElement("div", { className: "mrchat-scrollWrapper" }, /* @__PURE__ */ React9.createElement(
|
|
6336
6337
|
VirtualizedList,
|
|
6337
6338
|
{
|
|
6338
6339
|
data: chatList?.rows?.data || [],
|
|
6339
6340
|
endReached: loadMoreChats,
|
|
6340
6341
|
itemContent: (_, item) => {
|
|
6341
6342
|
const isActive = item.chatId === chatId;
|
|
6342
|
-
return /* @__PURE__ */
|
|
6343
|
+
return /* @__PURE__ */ React9.createElement(
|
|
6343
6344
|
"div",
|
|
6344
6345
|
{
|
|
6345
6346
|
className: `${"mrchat-chatItem"} ${isActive ? "mrchat-activeChatItem" : ""}`,
|
|
@@ -6348,7 +6349,7 @@ function ChatUserList() {
|
|
|
6348
6349
|
handleJoinChat(item);
|
|
6349
6350
|
}
|
|
6350
6351
|
},
|
|
6351
|
-
item.avatar ? /* @__PURE__ */
|
|
6352
|
+
item.avatar ? /* @__PURE__ */ React9.createElement(Avatar3, { src: item.avatar, size: 36, radius: "xl" }) : /* @__PURE__ */ React9.createElement(
|
|
6352
6353
|
Avatar3,
|
|
6353
6354
|
{
|
|
6354
6355
|
key: item.displayName || item.username,
|
|
@@ -6356,7 +6357,7 @@ function ChatUserList() {
|
|
|
6356
6357
|
color: "initials"
|
|
6357
6358
|
}
|
|
6358
6359
|
),
|
|
6359
|
-
/* @__PURE__ */
|
|
6360
|
+
/* @__PURE__ */ React9.createElement("div", { className: "mrchat-chatInfo" }, /* @__PURE__ */ React9.createElement(Text3, { className: "mrchat-chatLabelItem", truncate: true }, item.displayName || item.username), item.unreadCount > 0 && /* @__PURE__ */ React9.createElement("div", { className: "mrchat-unreadBadge" }, item.unreadCount || 10), /* @__PURE__ */ React9.createElement("div", { className: "mrchat-messagePreview" }, /* @__PURE__ */ React9.createElement(
|
|
6360
6361
|
Text3,
|
|
6361
6362
|
{
|
|
6362
6363
|
truncate: true,
|
|
@@ -6366,7 +6367,7 @@ function ChatUserList() {
|
|
|
6366
6367
|
className: "mrchat-messagePreviewContent"
|
|
6367
6368
|
},
|
|
6368
6369
|
stripHtml(DOMPurify2.sanitize(item.message))
|
|
6369
|
-
), /* @__PURE__ */
|
|
6370
|
+
), /* @__PURE__ */ React9.createElement(
|
|
6370
6371
|
Text3,
|
|
6371
6372
|
{
|
|
6372
6373
|
size: "xs",
|
|
@@ -6378,7 +6379,7 @@ function ChatUserList() {
|
|
|
6378
6379
|
);
|
|
6379
6380
|
}
|
|
6380
6381
|
}
|
|
6381
|
-
))), /* @__PURE__ */
|
|
6382
|
+
))), /* @__PURE__ */ React9.createElement(
|
|
6382
6383
|
ChatUserMessage,
|
|
6383
6384
|
{
|
|
6384
6385
|
chatId,
|
|
@@ -6402,7 +6403,7 @@ function ChatUserList() {
|
|
|
6402
6403
|
function MrChat(props) {
|
|
6403
6404
|
const [primaryColor] = useState6("customBrand");
|
|
6404
6405
|
const theme = createAppTheme(primaryColor);
|
|
6405
|
-
return /* @__PURE__ */
|
|
6406
|
+
return /* @__PURE__ */ React10.createElement(ReduxProvider, null, /* @__PURE__ */ React10.createElement(SocketProvider, null, /* @__PURE__ */ React10.createElement(MantineProvider, { defaultColorScheme: "light", theme }, /* @__PURE__ */ React10.createElement(Notifications, null), /* @__PURE__ */ React10.createElement(ChatUserList, { ...props }))));
|
|
6406
6407
|
}
|
|
6407
6408
|
export {
|
|
6408
6409
|
MrChat
|