status-im
/
status-js-desktop
mirror of https://github.com/status-im/status-js-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix online/offline display; sort users by online state + username

This commit is contained in:
Iuri Matias 2018-11-23 18:49:35 -05:00
parent 639da85799
commit 5c92e7bf2e
2 changed files with 21 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
app/components/ChatRoom.js
View File

@ -21,8 +21,6 @@ import { uploadFileAndSend } from '../utils/ipfs';
import 'emoji-mart/css/emoji-mart.css'; import 'emoji-mart/css/emoji-mart.css';
class WhoIsTyping extends PureComponent { class WhoIsTyping extends PureComponent {
whoIsTyping() { whoIsTyping() {
@ -96,6 +94,19 @@ class ChatRoom extends Component {
render() { render() {
const { messages, sendMessage, currentChannel, usersTyping, typingEvent, channelUsers, allUsers, ipfs } = this.props; const { messages, sendMessage, currentChannel, usersTyping, typingEvent, channelUsers, allUsers, ipfs } = this.props;
const sortedUsers = Object.keys(channelUsers).sort((x,y) => {
let currentTime = (new Date().getTime());
let x_is_online = ((currentTime - allUsers[x].lastSeen) > 10*1000) ? 1 : -1;
let y_is_online = ((currentTime - allUsers[y].lastSeen) > 10*1000) ? 1 : -1;
let diff = x_is_online - y_is_online;
if (diff != 0) { return diff }
if (x.username < y.username) { return -1 }
if (x.username > y.username) { return 1 }
return 0;
})
const {showEmojis} = this.state; const {showEmojis} = this.state;
return ( return (
<Grid container style={{ height: '100vh' }}> <Grid container style={{ height: '100vh' }}>
@ -184,15 +195,15 @@ class ChatRoom extends Component {
</Grid> </Grid>
<Grid xs={4} item style={{ overflow: 'auto' }}> <Grid xs={4} item style={{ overflow: 'auto' }}>
<List> <List>
{Object.keys(channelUsers).map(user => ( {sortedUsers.map(user => (
<ListItem button key={user}> <ListItem button key={user}>
<span className="dot" style={{ <span className="dot" style={{
'height': '10px', 'height': '10px',
'width': '11px', 'width': '11px',
'background-color': (allUsers[user].online ? 'lightgreen' : 'lightgrey'), 'background-color': (((new Date().getTime()) - allUsers[user].lastSeen) > 10*1000 ? 'lightgrey' : 'lightgreen'),
'border-radius': '50%', 'border-radius': '50%',
'margin-right': '10px' 'margin-right': '10px'
}}/> }}/>
<ListItemAvatar> <ListItemAvatar>
<Avatar> <Avatar>
<Jazzicon diameter={40} seed={jsNumberForAddress(user)}/> <Jazzicon diameter={40} seed={jsNumberForAddress(user)}/>

2
app/components/Home.js
View File

@ -14,8 +14,6 @@ import { getKeyData, createVault, restoreVault, wipeVault } from '../utils/keyMa
import { FullScreenLoader } from './Loaders'; import { FullScreenLoader } from './Loaders';
import { openBrowserWindow, addWindowEventListeners } from '../utils/windows'; import { openBrowserWindow, addWindowEventListeners } from '../utils/windows';
const typingNotificationsTimestamp = {}; const typingNotificationsTimestamp = {};
const DEFAULT_CHANNEL = "mytest"; const DEFAULT_CHANNEL = "mytest";