dave/ocrcc-chatbox
1
0
Fork 0
forked from Github/ocrcc-chatbox
Code Issues Pull Requests Projects Releases Wiki Activity

show placeholder msg while sending

Browse Source
This commit is contained in:
Sharon Kennedy 2020-04-23 10:25:24 -04:00
parent 3fd72429e3
commit 2917756e7a
2 changed files with 16 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/_chat.scss
View File

@ -119,6 +119,7 @@
align-items: center; align-items: center;
margin-bottom: 0.2rem; margin-bottom: 0.2rem;
justify-content: flex-end; justify-content: flex-end;
flex: 0 0 auto;
&-title { &-title {
display: flex; display: flex;

33
src/components/chatbox.jsx
View File

@ -242,6 +242,7 @@ class ChatBox extends React.Component {
initializeUnencryptedChat = async () => { initializeUnencryptedChat = async () => {
if (this.state.client) { if (this.state.client) {
this.state.client.leave(this.state.roomId)
this.state.client.stopClient() this.state.client.stopClient()
this.state.client.clearStores() this.state.client.clearStores()
this.state.localStorage.clear() this.state.localStorage.clear()
@ -275,8 +276,8 @@ class ChatBox extends React.Component {
try { try {
this.setMatrixListeners(client) this.setMatrixListeners(client)
client.setDisplayName(this.props.anonymousDisplayName) client.setDisplayName(this.props.anonymousDisplayName)
await client.startClient()
await this.createRoom(client) await this.createRoom(client)
await client.startClient()
this.displayBotMessage({ body: UNENCRYPTION_NOTICE }) this.displayBotMessage({ body: UNENCRYPTION_NOTICE })
} catch(err) { } catch(err) {
console.log("error", err) console.log("error", err)
@ -286,7 +287,7 @@ class ChatBox extends React.Component {
} }
handleInitError = (err) => { handleInitError = (err) => {
console.log("Error", err) console.log("error", err)
this.displayBotMessage({ body: this.props.chatUnavailableMessage }) this.displayBotMessage({ body: this.props.chatUnavailableMessage })
this.setState({ ready: true }) this.setState({ ready: true })
} }
@ -353,19 +354,16 @@ class ChatBox extends React.Component {
}) })
} }
sendMessage = (message) => { sendMessage = async (message) => {
console.log("SEND MESSAGE!", message) if (this.state.client && this.state.roomId) {
if (!this.state.client) { try {
return null await this.state.client.sendTextMessage(this.state.roomId, message)
} } catch(err) {
switch (err["name"]) {
this.state.client.sendTextMessage(this.state.roomId, message)
.catch((err) => {
switch (err["name"]) {
case "UnknownDeviceError": case "UnknownDeviceError":
Object.keys(err.devices).forEach((userId) => { Object.keys(err.devices).forEach((userId) => {
Object.keys(err.devices[userId]).map((deviceId) => { Object.keys(err.devices[userId]).map(async (deviceId) => {
this.state.client.setDeviceKnown(userId, deviceId, true); await this.state.client.setDeviceKnown(userId, deviceId, true);
}); });
}); });
this.sendMessage(message) this.sendMessage(message)
@ -374,7 +372,8 @@ class ChatBox extends React.Component {
this.displayBotMessage({ body: "Your message was not sent." }) this.displayBotMessage({ body: "Your message was not sent." })
console.log("Error sending message", err); console.log("Error sending message", err);
} }
}) }
}
} }
displayFakeMessage = (content, sender, messageId=uuid()) => { displayFakeMessage = (content, sender, messageId=uuid()) => {
@ -422,11 +421,8 @@ class ChatBox extends React.Component {
return; return;
} }
console.log("this.state.messagesInFlight", this.state.messagesInFlight)
const messagesInFlight = [...this.state.messagesInFlight] const messagesInFlight = [...this.state.messagesInFlight]
console.log("message", message)
const placeholderMessageIndex = messagesInFlight.findIndex(msg => msg === message.content.body) const placeholderMessageIndex = messagesInFlight.findIndex(msg => msg === message.content.body)
console.log("placeholderMessageIndex", placeholderMessageIndex)
if (placeholderMessageIndex > -1) { if (placeholderMessageIndex > -1) {
messagesInFlight.splice(placeholderMessageIndex, 1) messagesInFlight.splice(placeholderMessageIndex, 1)
this.setState({ messagesInFlight }) this.setState({ messagesInFlight })
@ -486,7 +482,6 @@ class ChatBox extends React.Component {
if (eventType === "m.room.member" && content.membership === "join" && sender !== this.props.botId && sender !== this.state.userId) { if (eventType === "m.room.member" && content.membership === "join" && sender !== this.props.botId && sender !== this.state.userId) {
this.verifyAllRoomDevices(client, room) this.verifyAllRoomDevices(client, room)
console.log("FACILITATOR JOINED!", sender)
this.setState({ facilitatorId: sender, ready: true }) this.setState({ facilitatorId: sender, ready: true })
window.clearTimeout(this.state.timeoutId) window.clearTimeout(this.state.timeoutId)
} }
@ -574,6 +569,8 @@ class ChatBox extends React.Component {
const message = this.state.inputValue const message = this.state.inputValue
if (!Boolean(message)) return null; if (!Boolean(message)) return null;
if (this.state.isCryptoEnabled && !(this.state.client.isRoomEncrypted(this.state.roomId) && this.state.client.isCryptoEnabled())) return null;
if (this.state.client && this.state.roomId) { if (this.state.client && this.state.roomId) {
const messagesInFlight = [...this.state.messagesInFlight] const messagesInFlight = [...this.state.messagesInFlight]
messagesInFlight.push(message) messagesInFlight.push(message)