diff options
author | 2018-06-21 14:59:56 +0300 | |
---|---|---|
committer | 2023-01-13 10:37:53 +0300 | |
commit | bc2e876c592d5b3c117108baf5a5a58905510eae (patch) | |
tree | 29cf37494d6bd3f79cd7819ca58f97875142b923 /vnext/src/components/Contacts.js | |
parent | 586d67c8e43970cc8c6e936f9eda48df5128efa8 (diff) |
Add PM components
Diffstat (limited to 'vnext/src/components/Contacts.js')
-rw-r--r-- | vnext/src/components/Contacts.js | 69 |
1 files changed, 69 insertions, 0 deletions
diff --git a/vnext/src/components/Contacts.js b/vnext/src/components/Contacts.js new file mode 100644 index 00000000..300e60eb --- /dev/null +++ b/vnext/src/components/Contacts.js @@ -0,0 +1,69 @@ +import React from 'react'; +import { Link } from 'react-router-dom'; + + +import Contact from './Contact.js'; + +export default class Contacts extends React.Component { + constructor(props) { + super(props); + this.state = { + pms: [] + }; + } + componentWillMount() { + this.refreshChats(); + } + + refreshChats() { + fetch(`https://api.juick.com/groups_pms?hash=${this.props.visitor.hash}`) + .then(response => response.json()) + .then(jsonResponse => { + this.setState({ + isLoading: false, + pms: jsonResponse.pms + }); + }); + } + render() { + const { pms } = this.state; + const user = this.props.visitor; + return ( + <div style={wrapperStyle} className="msg-cont"> + <ul style={chatListStyle} ref="chats"> + { + pms && pms.map((chat) => + <li key={chat.uname} style={chatTitleStyle}> + <Contact key={chat.uname} user={chat} /> + </li> + ) + } + </ul> + </div> + ); + } +} + +const wrapperStyle = { + display: 'flex', + backgroundColor: '#fff' +} + +const chatListStyle = { + boxSizing: 'border-box', + padding: '0 20px', + overflowY: 'scroll', + display: 'flex', + alignItems: 'center', + flexDirection: 'column', + width: '100%' +} + +const chatTitleStyle = { + width: '100%', + padding: '3px 6px', + textAlign: 'left', + background: '#fff', + color: '#222', + borderBottom: '1px solid #eee' +}
\ No newline at end of file |