From 4c494a5ff24cf42e0350ad77590654fdf1c816fd Mon Sep 17 00:00:00 2001 From: Jonathan Rainville Date: Fri, 23 Nov 2018 12:43:05 -0500 Subject: [PATCH 1/4] fix windows flow-typed --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 4cd0ec7..320d13e 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "build-renderer": "cross-env NODE_ENV=production webpack --config ./configs/webpack.config.renderer.prod.babel.js --colors", "dev": "cross-env START_HOT=1 node -r @babel/register ./internals/scripts/CheckPortInUse.js && cross-env START_HOT=1 yarn start-renderer-dev", "flow": "flow", - "flow-typed": "rimraf flow-typed/npm && flow-typed install --overwrite || true", + "flow-typed": "cross-env rimraf flow-typed/npm && flow-typed install --overwrite || true", "lint": "cross-env NODE_ENV=development eslint --cache --format=pretty .", "lint-fix": "yarn --silent lint --fix; exit 0", "lint-styles": "stylelint --ignore-path .eslintignore '**/*.*(css|scss)' --syntax scss", From 7f8ff2b0e339b76aed1cce6d0906a40cc009115e Mon Sep 17 00:00:00 2001 From: Iuri Matias Date: Sun, 11 Nov 2018 12:27:54 -0500 Subject: [PATCH 2/4] add fix for the chat form --- app/components/ChatBox.js | 10 +++++----- app/components/ChatRoom.js | 8 ++++---- app/components/Home.js | 21 +++++++++++++++++++-- 3 files changed, 28 insertions(+), 11 deletions(-) diff --git a/app/components/ChatBox.js b/app/components/ChatBox.js index fce68d7..dee9993 100644 --- a/app/components/ChatBox.js +++ b/app/components/ChatBox.js @@ -28,7 +28,7 @@ function isSpotifyLink(text) { // https://gist.github.com/takien/4077195# function getYoutubeId(url) { - var ID = ''; + let ID = ''; url = url.replace(/(>|<)/gi,'').split(/(vi\/|v=|\/v\/|youtu\.be\/|\/embed\/)/); if(url[2] !== undefined) { ID = url[2].split(/[^0-9a-z_\-]/i); @@ -45,12 +45,12 @@ const MessageRender = ({ message }) => ( message[2] === "`" && SyntaxLookup[message.slice(0,2)] ? {message.slice(3)} : {message} -) +); class ChatBox extends PureComponent { state = { imgUrl: null - } + }; componentDidMount() { const { message } = this.props; @@ -66,7 +66,7 @@ class ChatBox extends PureComponent { const imgUrl = URL.createObjectURL(blob); const image = `data:image/png;base64,${content.toString('base64')}`; this.setState({ imgUrl }); - } + }; render() { const { username, message, pubkey } = this.props; @@ -101,7 +101,7 @@ class ChatBox extends PureComponent { /> } - {!!imgUrl && ipfs-image} + {!!imgUrl && ipfs} ) }; diff --git a/app/components/ChatRoom.js b/app/components/ChatRoom.js index 4475b94..824a535 100644 --- a/app/components/ChatRoom.js +++ b/app/components/ChatRoom.js @@ -32,7 +32,7 @@ class WhoIsTyping extends PureComponent { const userList = this.whoIsTyping(); return (
- {!userList.length ? "" : userList.join(',' ) + " is typing"} + {!userList.length ? "" : `${userList.join(',')} is typing`}
) } @@ -56,11 +56,11 @@ const keyDownHandler = (e, typingEvent, setValue, value) => { form.dispatchEvent(new Event("submit")); } typingEvent(e) -} +}; const AutoScrollList = autoscroll(List); const formStyle = { display: 'flex', justifyContent: 'center', alignItems: 'center', flexBasis: '10%' }; -const listStyle = { overflow: 'scroll', flexBasis: '76%' }; +const listStyle = { overflowY: 'scroll', flexBasis: '76%', position: 'absolute', top: '72px', left: 0, right: 0, bottom: '56px' }; const ChatRoomForm = createRef(); const ChatRoom = ({ messages, sendMessage, currentChannel, usersTyping, typingEvent, channelUsers, allUsers, ipfs }) => (
@@ -106,7 +106,7 @@ const ChatRoom = ({ messages, sendMessage, currentChannel, usersTyping, typingEv handleSubmit, setFieldValue }) => ( -
+
{ componentDidMount() { this.ipfs = new IPFS(); + + setInterval(() => { + const { currentChannel, users } = this.state; + status.sendJsonMessage(currentChannel, {type: "ping"}); + const currentTime = (new Date().getTime()); + for (let pubkey in users) { + const user = users[pubkey]; + if (currentTime - user.lastSeen > 10*1000) { + user.online = false; + this.setState(prevState => ({ + users: { + ...prevState.users, + [pubkey]: user + } + })) + } + } + }, 5 * 1000); } componentWillUnmount() { @@ -57,7 +74,7 @@ export default class Home extends PureComponent { this.keyringController.exportAccount(account) .then(key => { status.connect(URL, `0x${key}`) }) .then(() => { this.onConnect() }) - } + }; onConnect = () => { const { currentChannel } = this.state; From e9fb8464d46cc60ebcd351fa3d287d4804301805 Mon Sep 17 00:00:00 2001 From: Jonathan Rainville Date: Fri, 23 Nov 2018 14:44:41 -0500 Subject: [PATCH 3/4] add account list at the right --- app/components/ChatRoom.js | 172 +++++++++++++++++++++---------------- 1 file changed, 98 insertions(+), 74 deletions(-) diff --git a/app/components/ChatRoom.js b/app/components/ChatRoom.js index 824a535..fc43517 100644 --- a/app/components/ChatRoom.js +++ b/app/components/ChatRoom.js @@ -3,14 +3,21 @@ import React, { Fragment, PureComponent, createRef } from 'react'; import { Formik } from 'formik'; import autoscroll from 'autoscroll-react'; import List from '@material-ui/core/List'; +import ListItem from '@material-ui/core/ListItem'; +import ListItemAvatar from '@material-ui/core/ListItemAvatar'; +import Avatar from '@material-ui/core/Avatar'; +import ListItemText from '@material-ui/core/ListItemText'; import Divider from '@material-ui/core/Divider'; import Grid from '@material-ui/core/Grid'; import TextField from '@material-ui/core/TextField'; import Dropzone from 'react-dropzone'; +import Jazzicon, { jsNumberForAddress } from 'react-jazzicon'; + import ChatBox from './ChatBox'; import ChatHeader from './ChatHeader'; import { uploadFileAndSend } from '../utils/ipfs'; + class WhoIsTyping extends PureComponent { whoIsTyping() { @@ -45,8 +52,8 @@ function onDrop(acceptedFiles, rejectedFiles, ipfs, sendMessage) { const keyDownHandler = (e, typingEvent, setValue, value) => { if(e.shiftKey && e.keyCode === 13) { - e.preventDefault() - const cursor = e.target.selectionStart + e.preventDefault(); + const cursor = e.target.selectionStart; const newValue = `${value.slice(0, cursor)}\n${value.slice(cursor)}`; setValue('chatInput', newValue); } @@ -60,81 +67,98 @@ const keyDownHandler = (e, typingEvent, setValue, value) => { const AutoScrollList = autoscroll(List); const formStyle = { display: 'flex', justifyContent: 'center', alignItems: 'center', flexBasis: '10%' }; -const listStyle = { overflowY: 'scroll', flexBasis: '76%', position: 'absolute', top: '72px', left: 0, right: 0, bottom: '56px' }; +const listStyle = { overflowY: 'auto', flexBasis: '76%', position: 'absolute', top: '72px', left: 0, right: 0, bottom: '67px' }; const ChatRoomForm = createRef(); const ChatRoom = ({ messages, sendMessage, currentChannel, usersTyping, typingEvent, channelUsers, allUsers, ipfs }) => ( -
- { onDrop(a,r,ipfs,sendMessage) } } - disableClick - style={{ position: 'relative', height: '100%' }} - activeStyle={{ backgroundColor: 'grey', outline: '5px dashed lightgrey', alignSelf: 'center', outlineOffset: '-10px' }}> - - - - - {messages[currentChannel] && messages[currentChannel].map((message) => ( - - -
  • - -
    • -     - ))} -     - { - const { chatInput } = values; - sendMessage(chatInput); - resetForm(); - setSubmitting(false); - }} + + + { onDrop(a,r,ipfs,sendMessage) } } + disableClick + style={{ position: 'relative', height: '100%' }} + activeStyle={{ backgroundColor: 'grey', outline: '5px dashed lightgrey', alignSelf: 'center', outlineOffset: '-10px' }}> + - {({ - values, - errors, - touched, - handleChange, - handleBlur, - handleSubmit, - setFieldValue - }) => ( -
    - - keyDownHandler(e, typingEvent, setFieldValue, values.chatInput)} - onBlur={handleBlur} - value={values.chatInput || ''} - /> - {errors.chatInput && touched.chatInput && errors.chatInput} - - -
    - )} -     -     -     -
    + + + + {messages[currentChannel] && messages[currentChannel].map((message) => ( + + +
  • + +
    • +     + ))} +     + { + const { chatInput } = values; + sendMessage(chatInput); + resetForm(); + setSubmitting(false); + }} + > + {({ + values, + errors, + touched, + handleChange, + handleBlur, + handleSubmit, + setFieldValue + }) => ( +
    +
    + keyDownHandler(e, typingEvent, setFieldValue, values.chatInput)} + onBlur={handleBlur} + value={values.chatInput || ''} + /> + {errors.chatInput && touched.chatInput && errors.chatInput} + + +
    + )} +     + + + + + + {Object.keys(channelUsers).map(user => ( + + + + + + + + + + ))} + + + ); export default ChatRoom; From 13550eff0853c8620c1cbbdb0951048ab88e88f1 Mon Sep 17 00:00:00 2001 From: Jonathan Rainville Date: Fri, 23 Nov 2018 14:57:16 -0500 Subject: [PATCH 4/4] fix double ping --- app/components/ChatRoom.js | 1 - app/components/Home.js | 18 ------------------ 2 files changed, 19 deletions(-) diff --git a/app/components/ChatRoom.js b/app/components/ChatRoom.js index fc43517..ddd7251 100644 --- a/app/components/ChatRoom.js +++ b/app/components/ChatRoom.js @@ -17,7 +17,6 @@ import ChatBox from './ChatBox'; import ChatHeader from './ChatHeader'; import { uploadFileAndSend } from '../utils/ipfs'; - class WhoIsTyping extends PureComponent { whoIsTyping() { diff --git a/app/components/Home.js b/app/components/Home.js index 9b15d92..d32b1d0 100644 --- a/app/components/Home.js +++ b/app/components/Home.js @@ -39,24 +39,6 @@ export default class Home extends PureComponent { componentDidMount() { this.ipfs = new IPFS(); - - setInterval(() => { - const { currentChannel, users } = this.state; - status.sendJsonMessage(currentChannel, {type: "ping"}); - const currentTime = (new Date().getTime()); - for (let pubkey in users) { - const user = users[pubkey]; - if (currentTime - user.lastSeen > 10*1000) { - user.online = false; - this.setState(prevState => ({ - users: { - ...prevState.users, - [pubkey]: user - } - })) - } - } - }, 5 * 1000); } componentWillUnmount() {