diff --git a/.gitignore b/.gitignore
index 3c3629e..eb79dd5 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,2 @@
node_modules
+.idea
diff --git a/client/src/components/ChatBox/ChatBox.js b/client/src/components/ChatBox/ChatBox.js
index fac42f8..dccb6d7 100644
--- a/client/src/components/ChatBox/ChatBox.js
+++ b/client/src/components/ChatBox/ChatBox.js
@@ -12,24 +12,25 @@ const ChatBox = ({ user }) => {
const sendMessage = e => {
e.preventDefault()
const message = e.target.elements.message
+ const date = new Date()
- socket.emit('chat:message', message.value, user.username)
+ socket.emit('chat:message', message.value, user.username, `${date.getHours()}:${(`0${date.getMinutes()}`).slice(-2)}`)
message.value = ''
}
const ChatContent = () =>
- {messages.map((obj, i) => {
- const date = new Date()
+ {messages.map((client, i) => {
+
return (
- {obj.username}
- {`${date.getHours()}:${date.getMinutes()}`}
+ {client.username}
+ {client.date}
- {obj.message}
+ {client.message}
)
@@ -52,8 +53,8 @@ const ChatBox = ({ user }) => {
}
React.useEffect(() => {
- socket.on('chat:message', (message, username) => {
- setMessages(messages => ([...messages, { message, username }]))
+ socket.on('chat:message', (message, username, date) => {
+ setMessages(messages => ([...messages, { message, username, date }]))
chatContentElement.current.scrollTop = chatContentElement.current.scrollHeight
inputMessageElement.current.focus()
})
diff --git a/client/src/components/EnterChat/EnterChat.js b/client/src/components/EnterChat/EnterChat.js
index 7650043..e8e83dc 100644
--- a/client/src/components/EnterChat/EnterChat.js
+++ b/client/src/components/EnterChat/EnterChat.js
@@ -15,12 +15,17 @@ const EnterChat = ({ setUser }) => {
return
}
+ if (username.match(/\d/)) {
+ setAuthError({ status: true, message: '*Numbers are not allowed!' })
+ return
+ }
+
if (username.length >= maxUserameLength) {
setAuthError({ status: true, message: `*Max username length: ${maxUserameLength}` })
return
}
- setUser({ username: username, isLoggedIn: true })
+ setUser({ username: username[0].toUpperCase() + username.slice(1), isLoggedIn: true })
setAuthError({ status: false, message: '' })
}
diff --git a/package.json b/package.json
index 2fec09c..13fa5ea 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,9 @@
"type": "git",
"url": "git+https://github.com/sergeyyarkov/react-chat-app.git"
},
+ "dependencies": {
+ "concurrently": "^5.3.0"
+ },
"keywords": [],
"author": "",
"license": "ISC",
diff --git a/server/index.js b/server/index.js
index bb5a006..b016825 100644
--- a/server/index.js
+++ b/server/index.js
@@ -9,8 +9,8 @@ server.get('/', (req, res) => {
})
io.on('connection', (socket) => {
- socket.on('chat:message', (message, username) => {
- io.emit('chat:message', message, username)
+ socket.on('chat:message', (message, username, date) => {
+ io.emit('chat:message', message, username, date)
})
})