@messenger-box/platform-browser 6.5.1-alpha.0 → 7.0.11-alpha.0
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/CHANGELOG.md +6 -6
- package/lib/components/InboxMessage/InboxDetails/index.js +17 -5
- package/lib/components/InboxMessage/InboxDetails/index.js.map +1 -1
- package/lib/components/InboxMessage/InboxDetails/style.js +25 -25
- package/lib/components/InboxMessage/InboxDetails/style.js.map +1 -1
- package/lib/components/InboxMessage/InboxSidebar/index.js +57 -24
- package/lib/components/InboxMessage/InboxSidebar/index.js.map +1 -1
- package/lib/components/InboxMessage/InboxSidebar/styles.js +54 -54
- package/lib/components/InboxMessage/InboxSidebar/styles.js.map +1 -1
- package/lib/components/InboxMessage/Messages/index.js +148 -69
- package/lib/components/InboxMessage/Messages/index.js.map +1 -1
- package/lib/components/InboxMessage/Messages/styles.js +81 -81
- package/lib/components/InboxMessage/Messages/styles.js.map +1 -1
- package/lib/components/InboxMessage/MessagesList/index.js +77 -28
- package/lib/components/InboxMessage/MessagesList/index.js.map +1 -1
- package/lib/components/InboxMessage/Popover/index.js +45 -22
- package/lib/components/InboxMessage/Popover/index.js.map +1 -1
- package/lib/components/InboxMessage/Popover/style.js +25 -25
- package/lib/components/InboxMessage/Popover/style.js.map +1 -1
- package/lib/components/InboxMessage/UserModalContent/index.js +55 -30
- package/lib/components/InboxMessage/UserModalContent/index.js.map +1 -1
- package/lib/components/InboxMessage/UserModalContent/style.js +91 -91
- package/lib/components/InboxMessage/UserModalContent/style.js.map +1 -1
- package/lib/components/InboxMessage/index.js +263 -187
- package/lib/components/InboxMessage/index.js.map +1 -1
- package/lib/components/InboxMessage/style.js +181 -181
- package/lib/components/InboxMessage/style.js.map +1 -1
- package/lib/components/channel_view/DirectChannelView.js +16 -8
- package/lib/components/channel_view/DirectChannelView.js.map +1 -1
- package/lib/components/channel_view/PublicChannelView.js +16 -8
- package/lib/components/channel_view/PublicChannelView.js.map +1 -1
- package/lib/components/dashboard/menu_header.js +40 -23
- package/lib/components/dashboard/menu_header.js.map +1 -1
- package/lib/components/dashboard/modals/direct_modal.js +52 -17
- package/lib/components/dashboard/modals/direct_modal.js.map +1 -1
- package/lib/components/dashboard/modals.js +115 -54
- package/lib/components/dashboard/modals.js.map +1 -1
- package/lib/components/messenger/index.js +283 -207
- package/lib/components/messenger/index.js.map +1 -1
- package/lib/components/messenger/messagesList/index.js +523 -402
- package/lib/components/messenger/messagesList/index.js.map +1 -1
- package/lib/components/messenger/messagesList/style.js +434 -434
- package/lib/components/messenger/messagesList/style.js.map +1 -1
- package/lib/components/messenger/more_action/index.js +44 -41
- package/lib/components/messenger/more_action/index.js.map +1 -1
- package/lib/components/messenger/more_action/style.js +42 -42
- package/lib/components/messenger/more_action/style.js.map +1 -1
- package/lib/components/post/index.d.ts.map +1 -1
- package/lib/components/post/index.js +112 -65
- package/lib/components/post/index.js.map +1 -1
- package/lib/components/post/style.js +20098 -20096
- package/lib/components/post/style.js.map +1 -1
- package/lib/compute.d.ts.map +1 -1
- package/lib/compute.js +53 -44
- package/lib/compute.js.map +1 -1
- package/lib/containers/Dashboard.d.ts.map +1 -1
- package/lib/containers/Dashboard.js +408 -324
- package/lib/containers/Dashboard.js.map +1 -1
- package/lib/containers/DashboardWithLoader.d.ts +4 -0
- package/lib/containers/DashboardWithLoader.d.ts.map +1 -0
- package/lib/containers/DashboardWithLoader.js +25 -0
- package/lib/containers/DashboardWithLoader.js.map +1 -0
- package/lib/containers/Inbox.js +1 -2
- package/lib/containers/Inbox.js.map +1 -1
- package/lib/containers/Messenger.js +8 -2
- package/lib/containers/Messenger.js.map +1 -1
- package/lib/module.js +13 -14
- package/lib/module.js.map +1 -1
- package/lib/routes.json +22 -0
- package/lib/style.js +378 -378
- package/lib/style.js.map +1 -1
- package/lib/utils/index.js +26 -21
- package/lib/utils/index.js.map +1 -1
- package/package.json +6 -6
- package/rollup.config.mjs +13 -17
- package/src/components/InboxMessage/MessagesList/index.tsx +1 -1
- package/src/components/NavBar.tsx +1 -1
- package/src/components/channel_view/DirectChannelView.tsx +1 -1
- package/src/components/channel_view/PublicChannelView.tsx +1 -1
- package/src/components/messenger/index.tsx +1 -1
- package/src/components/post/channel_layout/center_channel/center_channel.tsx +1 -1
- package/src/components/post/channel_layout/channel_controller.tsx +1 -1
- package/src/components/post/index.tsx +1 -3
- package/src/components/post/textbox/textbox_links/textbox_links.tsx +1 -1
- package/src/components/post_view/post_attachment_container/post_attachment_container.tsx +1 -1
- package/src/components/post_view/post_time/post_time.tsx +1 -1
- package/src/{compute.tsx → compute.ts} +6 -6
- package/src/containers/Dashboard.tsx +261 -221
- package/src/containers/DashboardWithLoader.tsx +35 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,15 +3,15 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
-
##
|
|
6
|
+
## 7.0.11-alpha.0 (2024-06-25)
|
|
7
7
|
|
|
8
8
|
### Bug Fixes
|
|
9
9
|
|
|
10
|
-
- bug in fetching messages ([a4e7928](https://github.com/
|
|
11
|
-
- **chakra-ui:** chat screen and list design ([132f893](https://github.com/
|
|
10
|
+
- bug in fetching messages ([a4e7928](https://github.com/cdmbase/messenger-box/commit/a4e7928051f26f6b7d7b5b34baea2a9d94248ab6))
|
|
11
|
+
- **chakra-ui:** chat screen and list design ([132f893](https://github.com/cdmbase/messenger-box/commit/132f893848b86ec54fd92e1fa637e93bffd5f5c1))
|
|
12
12
|
|
|
13
13
|
### Features
|
|
14
14
|
|
|
15
|
-
- add inbox right side bar slot ([a90e137](https://github.com/
|
|
16
|
-
- add support to upload files via signed url ([d83f7d3](https://github.com/
|
|
17
|
-
- **chkra-ui:** move improved components from the pubngo repo to here ([0e1a7b1](https://github.com/
|
|
15
|
+
- add inbox right side bar slot ([a90e137](https://github.com/cdmbase/messenger-box/commit/a90e1370c010218c27b057526605e105f049cc5c))
|
|
16
|
+
- add support to upload files via signed url ([d83f7d3](https://github.com/cdmbase/messenger-box/commit/d83f7d360d5bab45a55f6ea45e44da670d8a6ace))
|
|
17
|
+
- **chkra-ui:** move improved components from the pubngo repo to here ([0e1a7b1](https://github.com/cdmbase/messenger-box/commit/0e1a7b13373cb21f3c9ea2a3d9872022de69ea09))
|
|
@@ -1,6 +1,18 @@
|
|
|
1
|
-
import React__default from'react';import {Button}from'@chakra-ui/react';import {AiOutlineClose}from'@react-icons/all-files/ai/AiOutlineClose';import {css}from'@emotion/css';import {styleSheet}from'./style.js';function InboxDetails({
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import React__default from'react';import {Button}from'@chakra-ui/react';import {AiOutlineClose}from'@react-icons/all-files/ai/AiOutlineClose.js';import {css}from'@emotion/css';import {styleSheet}from'./style.js';function InboxDetails({
|
|
2
|
+
handleToggle,
|
|
3
|
+
toggleDrawer
|
|
4
|
+
}) {
|
|
5
|
+
return React__default.createElement("div", {
|
|
6
|
+
className: css(styleSheet.detailDrawerStyles)
|
|
7
|
+
}, React__default.createElement("div", {
|
|
8
|
+
className: "details"
|
|
9
|
+
}, React__default.createElement("h4", null, "Details"), React__default.createElement(Button, {
|
|
10
|
+
onClick: handleToggle,
|
|
11
|
+
as: "a",
|
|
12
|
+
className: "close-btn",
|
|
13
|
+
marginRight: '10px',
|
|
14
|
+
rightIcon: React__default.createElement(AiOutlineClose, {
|
|
15
|
+
color: "black"
|
|
16
|
+
})
|
|
17
|
+
})));
|
|
6
18
|
}export{InboxDetails as default};//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/InboxDetails/index.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/InboxDetails/index.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"oNAMwB,SAAA,YAAY,CAAC;;cAIpB;;AAED,EAAA,OAAAA,cAAA,CAAA,aAAA,CAAA,KAAO,EAAA;AAUvB,IAAC,SAAA,EAAA,GAAA,CAAA,UAAA,CAAA,kBAAA,CAAA;;;;;;;;;;;;"}
|
|
@@ -1,27 +1,27 @@
|
|
|
1
1
|
const styleSheet = {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
2
|
+
detailDrawerStyles: {
|
|
3
|
+
width: '100%',
|
|
4
|
+
'& .details': {
|
|
5
|
+
borderBottom: '1px solid #eaeaea',
|
|
6
|
+
height: '55px',
|
|
7
|
+
display: 'flex',
|
|
8
|
+
alignItems: 'center',
|
|
9
|
+
paddingLeft: '10px',
|
|
10
|
+
justifyContent: 'space-between',
|
|
11
|
+
'& h4': {
|
|
12
|
+
color: 'black',
|
|
13
|
+
fontSize: '1em',
|
|
14
|
+
fontWeight: 'bold'
|
|
15
|
+
},
|
|
16
|
+
'& .close-btn ': {
|
|
17
|
+
marginTop: '0',
|
|
18
|
+
'& svg': {
|
|
19
|
+
color: 'black'
|
|
20
|
+
}
|
|
21
|
+
},
|
|
22
|
+
'& .close-btn:hover ': {
|
|
23
|
+
background: '#eaeaea'
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
27
|
};export{styleSheet};//# sourceMappingURL=style.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sources":["../../../../src/components/InboxMessage/InboxDetails/style.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAa,MAAA,UAAU,GAAG;AACtB,
|
|
1
|
+
{"version":3,"file":"style.js","sources":["../../../../src/components/InboxMessage/InboxDetails/style.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAa,MAAA,UAAU,GAAG;AACtB,EAAA,kBAAA,EAAkB;AACd,IAAA,KAAA,EAAA,MAAa;AACb,IAAA,YAAA,EAAA;AACI,MAAA,YAAA,EAAA,mBAAiC;AACjC,MAAA,MAAA,EAAA,MAAQ;AACR,MAAA,OAAA,EAAA,MAAS;AACT,MAAA,UAAA,EAAA,QAAoB;AACpB,MAAA,WAAA,EAAA,MAAa;AACb,MAAA,cAAA,EAAA,eAA+B;AAC/B,MAAA,MAAA,EAAA;AACI,QAAA,KAAA,EAAA;AACA,QAAA,QAAA,EAAA,KAAA;AACA,QAAA,UAAA,EAAA,MAAU;AACb,OAAA;AACD,MAAA,eAAA,EAAA;AACI,QAAA,SAAA,EAAA,GAAA;AACA,QAAA,OAAA,EAAA;AACI,UAAA,KAAA,EAAA,OAAA;AACH,SAAA;AACJ,OAAA;AACD,MAAA,qBAAA,EAAA;AACI,QAAA,UAAA,EAAA,SAAqB;AACxB,OAAA;AACJ,KAAA;AACJ,GAAA;"}
|
|
@@ -1,28 +1,61 @@
|
|
|
1
|
-
import*as React from'react';import {Button,Avatar}from'@chakra-ui/react';import {css}from'@emotion/css';import {styleSheet}from'./styles.js';function InboxSidebar({
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import*as React from'react';import {Button,Avatar}from'@chakra-ui/react';import {css}from'@emotion/css';import {styleSheet}from'./styles.js';function InboxSidebar({
|
|
2
|
+
handleSelectMessgae,
|
|
3
|
+
user,
|
|
4
|
+
messageList,
|
|
5
|
+
userId,
|
|
6
|
+
users
|
|
7
|
+
}) {
|
|
8
|
+
const userList = users?.filter(item => {
|
|
9
|
+
return item?.id !== userId;
|
|
10
|
+
});
|
|
11
|
+
return React.createElement("div", {
|
|
12
|
+
className: css(styleSheet.inboxSibarStyles)
|
|
13
|
+
}, user?.length > 0 ? user?.map((item, index) => {
|
|
14
|
+
const lastMessage = messageList[messageList?.length - 1];
|
|
15
|
+
let memberId;
|
|
16
|
+
item?.members.find(ele => {
|
|
17
|
+
if (ele.user !== userId) {
|
|
18
|
+
memberId = ele.user;
|
|
19
|
+
}
|
|
4
20
|
});
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
21
|
+
const userMember = userList.find(element => {
|
|
22
|
+
return element.id === memberId;
|
|
23
|
+
});
|
|
24
|
+
return React.createElement(Button, {
|
|
25
|
+
as: "a",
|
|
26
|
+
border: "none",
|
|
27
|
+
bg: "none",
|
|
28
|
+
width: "100%",
|
|
29
|
+
borderRadius: "10px",
|
|
30
|
+
_hover: {
|
|
31
|
+
backgroundColor: 'rgb(221, 221, 221)'
|
|
32
|
+
},
|
|
33
|
+
className: "show-message",
|
|
34
|
+
paddingLeft: "10px",
|
|
35
|
+
onClick: () => handleSelectMessgae(item),
|
|
36
|
+
key: index
|
|
37
|
+
}, React.createElement("div", {
|
|
38
|
+
className: "inbox-contacts"
|
|
39
|
+
}, React.createElement(Avatar, {
|
|
40
|
+
size: "md",
|
|
41
|
+
backgroundColor: "grey",
|
|
42
|
+
borderRadius: "50%",
|
|
43
|
+
width: "50px"
|
|
44
|
+
}), React.createElement("div", {
|
|
45
|
+
className: "last-message"
|
|
46
|
+
}, React.createElement("h5", null, userMember?.username), React.createElement("p", null, lastMessage?.message))));
|
|
47
|
+
}) : React.createElement("div", {
|
|
48
|
+
className: "no-messages"
|
|
49
|
+
}, React.createElement("h4", null, "You have no unread messages"), React.createElement("p", null, "When you book a trip or experience, messages from your host will show up here."), React.createElement(Button, {
|
|
50
|
+
variant: "outline",
|
|
51
|
+
width: "110px",
|
|
52
|
+
height: "40px",
|
|
53
|
+
borderRadius: "7px",
|
|
54
|
+
bg: "none",
|
|
55
|
+
border: "1px solid rgb(34 34 34)",
|
|
56
|
+
color: "black",
|
|
57
|
+
fontWeight: "600"
|
|
58
|
+
}, "Explore")));
|
|
26
59
|
}
|
|
27
60
|
// {
|
|
28
61
|
// cnl.displayName.split(',').length > 1 ?
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/InboxSidebar/index.tsx"],"sourcesContent":[null],"names":[],"mappings":"6IAgBwB,SAAA,YAAY,CAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/InboxSidebar/index.tsx"],"sourcesContent":[null],"names":[],"mappings":"6IAgBwB,SAAA,YAAY,CAAC;qBAChB;AACb,EAAA,IAAA;AACJ,EAAA,WAAG;AACH,EAAA,MAAA;;AAKgB,CAAA,EAAA;QACA,gBAAc,EAAI,OAAO,IAAE,IAAA;AACvB,IAAA,OAAA,IAAA,EAAO,EAAA,KAAK;AACR,GAAA,CAAA,CAAA;AACH,EAAA,OAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACL,IAAA,SAAG,EAAA,GAAA,CAAA,UAAA,CAAA,gBAAA,CAAA;SACG,EAAA,MAAA,GAAA,CAAA,GAAU,IAAW,EAAA,GAAA,CAAA,CAAA,MAAM,KAAQ,KAAE;AACvC,IAAA,MAAA,WAAc,GAAA,uBAAiB,EAAA,MAAA,GAAA,CAAA,CAAA,CAAA;AACnC,IAAA,IAAA,QAAG,CAAA;QACH,EAAO,OACF,CAAA,IAAA,CAAA,GAAA,IAAA;aAYQ,CAAA,IAAA,KAAA,MAAA,EAAA;AACD,QAAA,QAAA,GAAA,GAAA,CAAA,IAAA,CAAA;;;oBAGI,GAAI,QAAA,CAAA,IAAA,CAAA,OAAA,IAAA;MAKtB,OAEF,OAAA,CAAA,EAAA,KAAA,QAAA,CAAA;;WAEyF,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AACrF,MAAA,EAAA,EAAA,GAAA;AAgBpB,MAAC,MAAA,EAAA,MAAA;AAED,MAAI,EAAA,EAAA,MAAA;AACJ,MAA8C,KAAA,EAAA,MAAA;AAC9C,MAAY,YAAA,EAAA,MAAA;AACZ,MAA6E,MAAA,EAAA;AAC7E,QAAyC,eAAA,EAAA,oBAAA;AACzC,OAA+C;AAC/C,MAAI,SAAA,EAAA,cAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,57 +1,57 @@
|
|
|
1
1
|
const styleSheet = {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
},
|
|
15
|
-
'& .username': {
|
|
16
|
-
color: 'black',
|
|
17
|
-
},
|
|
18
|
-
'& .inbox-contacts': {
|
|
19
|
-
display: 'flex',
|
|
20
|
-
marginTop: '10px',
|
|
21
|
-
paddingBottom: '15px',
|
|
22
|
-
width: '100%',
|
|
23
|
-
borderBottom: '1px solid #eaeaea',
|
|
24
|
-
paddingRight: '10px',
|
|
25
|
-
justifiedContent: 'space-between',
|
|
26
|
-
'& .last-message': {
|
|
27
|
-
marginLeft: '10px',
|
|
28
|
-
lineHeight: '3px',
|
|
29
|
-
},
|
|
30
|
-
},
|
|
31
|
-
'& .no-messages': {
|
|
32
|
-
textAlign: 'center',
|
|
33
|
-
margin: '0 auto',
|
|
34
|
-
padding: '10px',
|
|
35
|
-
'& h4': {
|
|
36
|
-
fontSize: '18px',
|
|
37
|
-
color: 'black',
|
|
38
|
-
},
|
|
39
|
-
'& p': {
|
|
40
|
-
color: 'rgb(113, 113, 113)',
|
|
41
|
-
fontSize: '16px',
|
|
42
|
-
},
|
|
43
|
-
'& .ant-btn': {
|
|
44
|
-
width: '110px',
|
|
45
|
-
height: '40px',
|
|
46
|
-
borderRadius: '7px',
|
|
47
|
-
border: '1px solid rgb(34 34 34)',
|
|
48
|
-
color: 'black',
|
|
49
|
-
fontWeight: '600',
|
|
50
|
-
'& :hover': {
|
|
51
|
-
color: 'black',
|
|
52
|
-
borderColor: 'black',
|
|
53
|
-
},
|
|
54
|
-
},
|
|
55
|
-
},
|
|
2
|
+
inboxSibarStyles: {
|
|
3
|
+
width: '100%',
|
|
4
|
+
marginRight: '20px',
|
|
5
|
+
cursor: 'pointer',
|
|
6
|
+
top: '0',
|
|
7
|
+
bottom: '0',
|
|
8
|
+
height: '100%',
|
|
9
|
+
overflow: 'auto',
|
|
10
|
+
padding: '10px',
|
|
11
|
+
'& .show-message': {
|
|
12
|
+
color: 'black',
|
|
13
|
+
textDecoration: 'none'
|
|
56
14
|
},
|
|
15
|
+
'& .username': {
|
|
16
|
+
color: 'black'
|
|
17
|
+
},
|
|
18
|
+
'& .inbox-contacts': {
|
|
19
|
+
display: 'flex',
|
|
20
|
+
marginTop: '10px',
|
|
21
|
+
paddingBottom: '15px',
|
|
22
|
+
width: '100%',
|
|
23
|
+
borderBottom: '1px solid #eaeaea',
|
|
24
|
+
paddingRight: '10px',
|
|
25
|
+
justifiedContent: 'space-between',
|
|
26
|
+
'& .last-message': {
|
|
27
|
+
marginLeft: '10px',
|
|
28
|
+
lineHeight: '3px'
|
|
29
|
+
}
|
|
30
|
+
},
|
|
31
|
+
'& .no-messages': {
|
|
32
|
+
textAlign: 'center',
|
|
33
|
+
margin: '0 auto',
|
|
34
|
+
padding: '10px',
|
|
35
|
+
'& h4': {
|
|
36
|
+
fontSize: '18px',
|
|
37
|
+
color: 'black'
|
|
38
|
+
},
|
|
39
|
+
'& p': {
|
|
40
|
+
color: 'rgb(113, 113, 113)',
|
|
41
|
+
fontSize: '16px'
|
|
42
|
+
},
|
|
43
|
+
'& .ant-btn': {
|
|
44
|
+
width: '110px',
|
|
45
|
+
height: '40px',
|
|
46
|
+
borderRadius: '7px',
|
|
47
|
+
border: '1px solid rgb(34 34 34)',
|
|
48
|
+
color: 'black',
|
|
49
|
+
fontWeight: '600',
|
|
50
|
+
'& :hover': {
|
|
51
|
+
color: 'black',
|
|
52
|
+
borderColor: 'black'
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
57
|
};export{styleSheet};//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sources":["../../../../src/components/InboxMessage/InboxSidebar/styles.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAa,MAAA,UAAU,GAAG;AACtB,
|
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../../src/components/InboxMessage/InboxSidebar/styles.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAa,MAAA,UAAU,GAAG;AACtB,EAAA,gBAAA,EAAgB;AACZ,IAAA,KAAA,EAAA,MAAa;AACb,IAAA,WAAA,EAAA,MAAmB;AACnB,IAAA,MAAA,EAAA,SAAiB;AACjB,IAAA,GAAA,EAAA;AACA,IAAA,MAAA,EAAA;AACA,IAAA,MAAA,EAAA,MAAc;AACd,IAAA,QAAA,EAAA,MAAgB;AAChB,IAAA,OAAA,EAAA,MAAe;AACf,IAAA,iBAAA,EAAA;AACI,MAAA,KAAA,EAAA,OAAc;AACd,MAAA,cAAA,EAAA,MAAgB;AACnB,KAAA;AACD,IAAA,aAAA,EAAA;AACI,MAAA,KAAA,EAAA,OAAc;AACjB,KAAA;AACD,IAAA,mBAAA,EAAA;AACI,MAAA,OAAA,EAAA,MAAS;AACT,MAAA,SAAA,EAAA,MAAW;AACX,MAAA,aAAA,EAAA,MAAe;AACf,MAAA,KAAA,EAAA,MAAO;AACP,MAAA,YAAA,EAAA,mBAAiC;AACjC,MAAA,YAAA,EAAA,MAAc;AACd,MAAA,gBAAA,EAAA,eAAiC;AACjC,MAAA,iBAAA,EAAA;AACI,QAAA,UAAA,EAAA,MAAU;AACV,QAAA,UAAA,EAAA,KAAA;AACH,OAAA;AACJ,KAAA;AACD,IAAA,gBAAA,EAAA;AACI,MAAA,SAAA,EAAA,QAAmB;AACnB,MAAA,MAAA,EAAA,QAAgB;AAChB,MAAA,OAAA,EAAA,MAAS;AACT,MAAA,MAAA,EAAA;AACI,QAAA,QAAA,EAAA,MAAQ;AACR,QAAA,KAAA,EAAA;AACH,OAAA;AACD,MAAA,KAAA,EAAA;AACI,QAAA,KAAA,EAAA,oBAA2B;AAC3B,QAAA,QAAA,EAAA,MAAQ;AACX,OAAA;AACD,MAAA,YAAA,EAAA;AACI,QAAA,KAAA,EAAA;AACA,QAAA,MAAA,EAAA,MAAM;AACN,QAAA,YAAA,EAAA,KAAA;AACA,QAAA,MAAA,EAAA,yBAAiC;AACjC,QAAA,KAAA,EAAA;AACA,QAAA,UAAA,EAAA,KAAA;AACA,QAAA,UAAA,EAAA;AACI,UAAA,KAAA,EAAA,OAAA;AACA,UAAA,WAAA,EAAA,OAAA;AACH,SAAA;AACJ,OAAA;AACJ,KAAA;AACJ,GAAA;"}
|
|
@@ -1,72 +1,151 @@
|
|
|
1
|
-
import React__default,{useState,useEffect,useRef}from'react';import {BiArchiveIn,BiImage}from'react-icons/bi';import {BsFillArrowUpCircleFill}from'react-icons/bs';import {css}from'@emotion/css';import {Tooltip,Button,InputGroup,Textarea,InputRightElement}from'@chakra-ui/react';import {useGetMessagesQuery,useSendMessagesMutation}from'@messenger-box/platform-client';import MsgList from'../MessagesList/index.js';import {styleSheet}from'./styles.js';function Messages({
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import React__default,{useState,useEffect,useRef}from'react';import {BiArchiveIn,BiImage}from'react-icons/bi/index.js';import {BsFillArrowUpCircleFill}from'react-icons/bs/index.js';import {css}from'@emotion/css';import {Tooltip,Button,InputGroup,Textarea,InputRightElement}from'@chakra-ui/react';import {useGetMessagesQuery,useSendMessagesMutation}from'@messenger-box/platform-client';import MsgList from'../MessagesList/index.js';import {styleSheet}from'./styles.js';function Messages({
|
|
2
|
+
id,
|
|
3
|
+
user,
|
|
4
|
+
userId,
|
|
5
|
+
currentUser
|
|
6
|
+
}) {
|
|
7
|
+
const [message, setMessage] = useState('');
|
|
8
|
+
const [messageList, setMessageList] = useState([]);
|
|
9
|
+
const [height, setHeight] = useState('40px');
|
|
10
|
+
const {
|
|
11
|
+
data,
|
|
12
|
+
loading,
|
|
13
|
+
error,
|
|
14
|
+
refetch
|
|
15
|
+
} = useGetMessagesQuery({
|
|
16
|
+
variables: {
|
|
17
|
+
channelId: id
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
useEffect(() => {
|
|
21
|
+
if (!loading) {
|
|
22
|
+
setMessageList(data.messages.data);
|
|
23
|
+
}
|
|
24
|
+
}, [loading, id, data?.messages?.data, messageList]);
|
|
25
|
+
const [sendMsg, {}] = useSendMessagesMutation({
|
|
26
|
+
context: {}
|
|
27
|
+
});
|
|
28
|
+
const messagesEndRef = useRef(null);
|
|
29
|
+
const handleEnterBtn = () => {
|
|
30
|
+
if (message) {
|
|
31
|
+
sendMsg({
|
|
6
32
|
variables: {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
useEffect(() => {
|
|
11
|
-
if (!loading) {
|
|
12
|
-
setMessageList(data.messages.data);
|
|
33
|
+
channelId: id,
|
|
34
|
+
content: message,
|
|
35
|
+
files: []
|
|
13
36
|
}
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
37
|
+
}).then(() => {
|
|
38
|
+
refetch().then(value => {
|
|
39
|
+
setMessageList([...value.data.messages.data]);
|
|
40
|
+
});
|
|
41
|
+
});
|
|
42
|
+
setMessage('');
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
const item = user?.find(element => {
|
|
46
|
+
return element.id !== userId;
|
|
47
|
+
});
|
|
48
|
+
// console.log(textarea)
|
|
49
|
+
const handleTextareaHeight = e => {
|
|
50
|
+
if (e.key === 'Enter' && message !== '') {
|
|
51
|
+
setHeight(40 + message.split('\n').length * 10 + 'px');
|
|
52
|
+
} else {
|
|
53
|
+
setHeight('40px');
|
|
54
|
+
}
|
|
55
|
+
};
|
|
56
|
+
return React__default.createElement("div", {
|
|
57
|
+
className: css(styleSheet.messageListStyles)
|
|
58
|
+
}, React__default.createElement("div", {
|
|
59
|
+
className: "message-container"
|
|
60
|
+
}, React__default.createElement("div", {
|
|
61
|
+
className: "message-username"
|
|
62
|
+
}, React__default.createElement("h2", null, item?.username), React__default.createElement("div", null, React__default.createElement(Tooltip, {
|
|
63
|
+
label: "Archive",
|
|
64
|
+
placement: "bottom-end",
|
|
65
|
+
backgroundColor: "black",
|
|
66
|
+
// bg="white"
|
|
67
|
+
display: "flex",
|
|
68
|
+
alignItems: "center",
|
|
69
|
+
width: "60px",
|
|
70
|
+
borderRadius: "10px",
|
|
71
|
+
fontSize: "15px",
|
|
72
|
+
height: "40px",
|
|
73
|
+
justifyContent: "center",
|
|
74
|
+
marginTop: "5px",
|
|
75
|
+
color: "white",
|
|
76
|
+
boxShadow: "0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23)",
|
|
77
|
+
hasArrow: true
|
|
78
|
+
}, React__default.createElement(Button, {
|
|
79
|
+
border: "none",
|
|
80
|
+
bg: "none",
|
|
81
|
+
width: "30px",
|
|
82
|
+
height: "30px",
|
|
83
|
+
onClick: handleEnterBtn,
|
|
84
|
+
borderRadius: "50%",
|
|
85
|
+
_hover: {
|
|
86
|
+
backgroundColor: 'rgb(221, 221, 221)'
|
|
87
|
+
}
|
|
88
|
+
}, React__default.createElement(BiArchiveIn, null))))), React__default.createElement("div", {
|
|
89
|
+
className: "message-row"
|
|
90
|
+
}, React__default.createElement(MsgList, {
|
|
91
|
+
id: id,
|
|
92
|
+
messageList: messageList,
|
|
93
|
+
user: user,
|
|
94
|
+
currentUser: currentUser
|
|
95
|
+
}), React__default.createElement("div", {
|
|
96
|
+
ref: messagesEndRef
|
|
97
|
+
}), React__default.createElement("div", {
|
|
98
|
+
className: "message-input"
|
|
99
|
+
}, React__default.createElement(Tooltip, {
|
|
100
|
+
label: "Image",
|
|
101
|
+
placement: "top",
|
|
102
|
+
// bg="white"
|
|
103
|
+
display: "flex",
|
|
104
|
+
alignItems: "center",
|
|
105
|
+
width: "60px",
|
|
106
|
+
borderRadius: "10px",
|
|
107
|
+
fontSize: "15px",
|
|
108
|
+
height: "40px",
|
|
109
|
+
justifyContent: "center",
|
|
110
|
+
marginTop: "5px",
|
|
111
|
+
color: "black",
|
|
112
|
+
boxShadow: "0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23)",
|
|
113
|
+
hasArrow: true
|
|
114
|
+
}, React__default.createElement(Button, {
|
|
115
|
+
border: "none",
|
|
116
|
+
borderRadius: "50%",
|
|
117
|
+
bg: "none",
|
|
118
|
+
marginRight: "5px",
|
|
119
|
+
height: "40px",
|
|
120
|
+
width: "40px",
|
|
121
|
+
_hover: {
|
|
122
|
+
backgroundColor: 'rgb(221, 221, 221)'
|
|
123
|
+
}
|
|
124
|
+
}, React__default.createElement(BiImage, {
|
|
125
|
+
color: "#464646",
|
|
126
|
+
style: {
|
|
127
|
+
fontSize: '25px'
|
|
128
|
+
}
|
|
129
|
+
}))), React__default.createElement(InputGroup, {
|
|
130
|
+
size: "md"
|
|
131
|
+
}, React__default.createElement(Textarea, {
|
|
132
|
+
placeholder: "Type your message",
|
|
133
|
+
value: message,
|
|
134
|
+
height: height,
|
|
135
|
+
onKeyUp: handleTextareaHeight,
|
|
136
|
+
// height={enter ? message.split('\n').length * 10 + 'px' : '40px'}
|
|
137
|
+
onChange: e => setMessage(e.target.value)
|
|
138
|
+
}), React__default.createElement(InputRightElement, null, React__default.createElement(Button, {
|
|
139
|
+
border: "none",
|
|
140
|
+
bg: "none",
|
|
141
|
+
onClick: handleEnterBtn,
|
|
142
|
+
position: "relative",
|
|
143
|
+
right: "53px",
|
|
144
|
+
top: "6px"
|
|
145
|
+
}, message !== '' ? React__default.createElement(BsFillArrowUpCircleFill, {
|
|
146
|
+
color: "rgb(34, 34, 34)",
|
|
147
|
+
style: {
|
|
148
|
+
fontSize: '25px'
|
|
149
|
+
}
|
|
150
|
+
}) : '')))))));
|
|
72
151
|
}export{Messages as default};//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/Messages/index.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/Messages/index.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"odAUwB,SAAA,QAAQ,CAAC;IAC7B;MACM;QACA;aACM;AACR,CAAA,EAAA;AACI,EAAA,MAAA,CAAA,OAAA,EAAA,UAAa,CAAA,GAAA,QAAA,CAAA,EAAA,CAAA,CAAA;AAChB,EAAA,MAAA,CAAA,WAAA,EAAA,cAAA,CAAA,GAAA,QAAA,CAAA,EAAA,CAAA,CAAA;AACJ,EAAA,MAAE,CAAA,MAAA,EAAA,SAAA,CAAA,GAAA,QAAA,CAAA,MAAA,CAAA,CAAA;QACM;QACL;AACI,IAAA,OAAA;AACH,IAAA,KAAA;AACL,IAAA,OAAW;AACX,GAAA,GAAA,mBAAoB,CAAG;AACnB,IAAA,SAAA,EAAO;AACV,MAAC,SAAC,EAAA,EAAA;AACH,KAAA;IACA,CAAM;WACY,CAAA,MAAA;AAClB,IAAA,IAAE,CAAA,OAAA,EAAA;MACI,cAAA,CAAA,IAAiB,CAAA,QAAK,CAAA,IAAA,CAAA,CAAA;AACxB,KAAA;AACI,GAAA,EAAA,CAAA,OAAA,EAAA,EAAA,EAAO,IAAC,EAAA,QAAA,EAAA,IAAA,EAAA,WAAA,CAAA,CAAA,CAAA;AACJ,EAAA,MAAA,CAAA,OAAA,EAAA,EAAA,CAAA,GAAA,uBAAW,CAAA;AACP,IAAA,OAAA,EAAA,EAAA;AACA,GAAA,CAAA,CAAA;AACA,EAAA,MAAA,cAAA,GAAK,MAAI,CAAA,IAAA,CAAA,CAAA;AAMjB,EAAA,MAAA,cAAG,GAAA,MAAA;eACO,EAAA;AACb,MAAA,OAAA,CAAA;AACL,QAAE,SAAA,EAAA;UACI,SAAW,EAAA,EAAE;AACf,UAAA,OAAc,EAAA,OAAG;AACrB,UAAG,KAAA,EAAA,EAAA;SACqB;AACxB,OAAA,CAAA,CAAA,IAA0B,CAAA,MAAA;QACtB,OAAS,EAAA,CAAA,IAAK,UAAW;AACrB,UAAA,cAAY,CAAA,CAAA,GAAU,KAAA,CAAC,KAAK,aAAa,CAAG,CAAA,CAAA;AAC/C,SAAA,CAAA,CAAA;AAAM,OAAA,CAAA,CAAA;gBACM,CAAA,EAAA,CAAA,CAAA;AACZ,KAAA;AACL,GAAA,CAAA;QACO,IACH;WACS,OAAA,CAAA,EAAA,KAAA,MAAA,CAAA;;;AAGG,EAAA,MAAA,oBAAA,GAAA,CAAA,IAAA;AACI,IAAA,IAAA,CAAA,CAAA,GAAA,KAAA,OAAA,IAAA,OAAA,KAAQ,EAAA,EAAA;4BAIS,CAAA,KAAA,CAAA,IAAA,CAAA,CAAA,MAAA,GAAA,EAAA,GAAA,IAAA,CAAA,CAAA;AACb,KAAA,MAAA;AAYA,MAAA,SAAA,CAAA,MAAA,CAAA,CAAA;AASI,KAAA;;AAMZ,EAAA,OAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAC;kBACI,CAAA,UAAA,CAAA,iBAAA,CAAG;iCACH,CAAA,KAAA,EAAA;kCACA;iCAGG,CAAa,KAAA,EAAA;AACb,IAAA,SAAA,EAAA,kBAAQ;AAYR,GAAA,EAAAA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAA,EAAA,IAAA,EAAA,QAAO,CAAA,EACHA,cAAM,CAAA,aACN,CAAA,KAAA,EAAA,IAAa,EAAAA,cACb,CAAE,aACS,CAAA,OAAA,EAAC;AAKZ,IAAA,KAAA,EAAA,SAAA;AAGR,IAAA,SAAA,EAAA,YAAA;AACI,IAAA,eAAA,EAAA,OAAA;;AAMI,IAAA,OAAA,EAAA,MAAA;AAEJ,IAAA,UAAA,EAAA,QAAA;AACI,IAAA,KAAA,EAAA,MAAA;AAqBhC,IAAC,YAAA,EAAA,MAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|