mirror of
https://github.com/nomadic-labs/safesupport-chatbox
synced 2025-12-16 15:33:23 +00:00
Compare commits
5 Commits
v1.1.3
...
dependabot
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
c9f4b27242 | ||
|
|
569a8e76c2 | ||
|
|
b76eebcacb | ||
|
|
c592253707 | ||
|
|
ebb06b3377 |
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "safesupport-chatbox",
|
"name": "safesupport-chatbox",
|
||||||
"version": "1.1.3",
|
"version": "1.1.5",
|
||||||
"description": "A secure and private embeddable chatbox that connects to Riot",
|
"description": "A secure and private embeddable chatbox that connects to Riot",
|
||||||
"main": "dist/chatbox.js",
|
"main": "dist/chatbox.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
|||||||
@@ -99,6 +99,7 @@
|
|||||||
width: 400px;
|
width: 400px;
|
||||||
max-width: calc(100vw - 10px);
|
max-width: calc(100vw - 10px);
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
|
margin: 0;
|
||||||
animation-duration: 0.2s;
|
animation-duration: 0.2s;
|
||||||
animation-fill-mode: forwards;
|
animation-fill-mode: forwards;
|
||||||
|
|
||||||
|
|||||||
@@ -68,7 +68,6 @@
|
|||||||
.message {
|
.message {
|
||||||
&.from-bot {
|
&.from-bot {
|
||||||
color: transparentize($light-text-color, 0.3);
|
color: transparentize($light-text-color, 0.3);
|
||||||
font-size: 0.9rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&.from-me {
|
&.from-me {
|
||||||
|
|||||||
@@ -599,103 +599,105 @@ class ChatBox extends React.Component {
|
|||||||
const inputLabel = 'Send a message...'
|
const inputLabel = 'Send a message...'
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="docked-widget" role="complementary">
|
<div id="safesupport">
|
||||||
<Transition in={opened} timeout={250} onExited={this.handleWidgetExit} onEntered={this.handleWidgetEnter}>
|
<div className="docked-widget" role="complementary">
|
||||||
{(status) => {
|
<Transition in={opened} timeout={250} onExited={this.handleWidgetExit} onEntered={this.handleWidgetEnter}>
|
||||||
return (
|
{(status) => {
|
||||||
<div className={`widget widget-${status}`} aria-hidden={!opened}>
|
return (
|
||||||
<div id="safesupport-chatbox" aria-haspopup="dialog">
|
<div className={`widget widget-${status}`} aria-hidden={!opened}>
|
||||||
<Header handleToggleOpen={this.handleToggleOpen} opened={opened} handleExitChat={this.handleExitChat} />
|
<div id="safesupport-chatbox" aria-haspopup="dialog">
|
||||||
|
<Header handleToggleOpen={this.handleToggleOpen} opened={opened} handleExitChat={this.handleExitChat} />
|
||||||
|
|
||||||
<div className="message-window" ref={this.messageWindow}>
|
<div className="message-window" ref={this.messageWindow}>
|
||||||
<div className="messages">
|
<div className="messages">
|
||||||
<div className={`message from-bot`}>
|
<div className={`message from-bot`}>
|
||||||
<div className="text">{ this.props.introMessage }</div>
|
<div className="text">{ this.props.introMessage }</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className={`message from-bot`}>
|
|
||||||
<div className="text">Please read the full <a href={this.props.termsUrl} ref={this.termsUrl} target='_blank' rel='noopener noreferrer'>terms and conditions</a>. By using this chat, you agree to these terms.</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className={`message from-bot`}>
|
|
||||||
<div className="text">{ this.props.agreementMessage }</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className={`message from-bot`}>
|
|
||||||
<div className="text buttons">
|
|
||||||
{`👉`}
|
|
||||||
<button className="btn" id="accept" onClick={this.handleAcceptTerms}>YES</button>
|
|
||||||
<button className="btn" id="reject" onClick={this.handleRejectTerms}>NO</button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
{
|
<div className={`message from-bot`}>
|
||||||
messages.map((message, index) => {
|
<div className="text">Please read the full <a href={this.props.termsUrl} ref={this.termsUrl} target='_blank' rel='noopener noreferrer'>terms and conditions</a>. By using this chat, you agree to these terms.</div>
|
||||||
return(
|
</div>
|
||||||
<Message key={message.id} message={message} userId={userId} botId={this.props.botId} client={this.state.client} />
|
|
||||||
)
|
<div className={`message from-bot`}>
|
||||||
})
|
<div className="text">{ this.props.agreementMessage }</div>
|
||||||
}
|
|
||||||
|
|
||||||
{
|
|
||||||
messagesInFlight.map((message, index) => {
|
|
||||||
return(
|
|
||||||
<Message key={`message-inflight-${index}`} message={{ content: { body: message }}} placeholder={true} />
|
|
||||||
)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
{ typingStatus &&
|
|
||||||
<div className="notices">
|
|
||||||
<div role="status">{typingStatus}</div>
|
|
||||||
</div>
|
</div>
|
||||||
}
|
|
||||||
|
|
||||||
{ Boolean(Object.keys(decryptionErrors).length) &&
|
|
||||||
<div className={`message from-bot`}>
|
<div className={`message from-bot`}>
|
||||||
<div className="text buttons">
|
<div className="text buttons">
|
||||||
{`Restart chat without encryption?`}
|
{`👉`}
|
||||||
<button className="btn" id="accept" onClick={this.initializeUnencryptedChat}>RESTART</button>
|
<button className="btn" id="accept" onClick={this.handleAcceptTerms}>YES</button>
|
||||||
|
<button className="btn" id="reject" onClick={this.handleRejectTerms}>NO</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
}
|
|
||||||
|
|
||||||
{ !ready && <div className={`loader`}>loading...</div> }
|
{
|
||||||
|
messages.map((message, index) => {
|
||||||
|
return(
|
||||||
|
<Message key={message.id} message={message} userId={userId} botId={this.props.botId} client={this.state.client} />
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
{
|
||||||
|
messagesInFlight.map((message, index) => {
|
||||||
|
return(
|
||||||
|
<Message key={`message-inflight-${index}`} message={{ content: { body: message }}} placeholder={true} />
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
{ typingStatus &&
|
||||||
|
<div className="notices">
|
||||||
|
<div role="status">{typingStatus}</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
|
||||||
|
{ Boolean(Object.keys(decryptionErrors).length) &&
|
||||||
|
<div className={`message from-bot`}>
|
||||||
|
<div className="text buttons">
|
||||||
|
{`Restart chat without encryption?`}
|
||||||
|
<button className="btn" id="accept" onClick={this.initializeUnencryptedChat}>RESTART</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
|
||||||
|
{ !ready && <div className={`loader`}>loading...</div> }
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="input-window">
|
||||||
|
<form onSubmit={this.handleSubmit}>
|
||||||
|
<div className="message-input-container">
|
||||||
|
<input
|
||||||
|
id="message-input"
|
||||||
|
type="text"
|
||||||
|
onChange={this.handleInputChange}
|
||||||
|
value={inputValue}
|
||||||
|
aria-label={inputLabel}
|
||||||
|
placeholder={inputLabel}
|
||||||
|
autoFocus={true}
|
||||||
|
ref={this.chatboxInput}
|
||||||
|
/>
|
||||||
|
{
|
||||||
|
(status === "entered") && !isMobile &&
|
||||||
|
<EmojiSelector
|
||||||
|
onEmojiClick={this.onEmojiClick}
|
||||||
|
emojiSelectorOpen={emojiSelectorOpen}
|
||||||
|
toggleEmojiSelector={this.toggleEmojiSelector}
|
||||||
|
closeEmojiSelector={this.closeEmojiSelector}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
<input type="submit" value="Send" id="submit" onClick={this.handleSubmit} />
|
||||||
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="input-window">
|
|
||||||
<form onSubmit={this.handleSubmit}>
|
|
||||||
<div className="message-input-container">
|
|
||||||
<input
|
|
||||||
id="message-input"
|
|
||||||
type="text"
|
|
||||||
onChange={this.handleInputChange}
|
|
||||||
value={inputValue}
|
|
||||||
aria-label={inputLabel}
|
|
||||||
placeholder={inputLabel}
|
|
||||||
autoFocus={true}
|
|
||||||
ref={this.chatboxInput}
|
|
||||||
/>
|
|
||||||
{
|
|
||||||
(status === "entered") && !isMobile &&
|
|
||||||
<EmojiSelector
|
|
||||||
onEmojiClick={this.onEmojiClick}
|
|
||||||
emojiSelectorOpen={emojiSelectorOpen}
|
|
||||||
toggleEmojiSelector={this.toggleEmojiSelector}
|
|
||||||
closeEmojiSelector={this.closeEmojiSelector}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
<input type="submit" value="Send" id="submit" onClick={this.handleSubmit} />
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
)}
|
||||||
)}
|
}
|
||||||
}
|
</Transition>
|
||||||
</Transition>
|
{showDock && !roomId && <Dock handleToggleOpen={this.handleToggleOpen} />}
|
||||||
{showDock && !roomId && <Dock handleToggleOpen={this.handleToggleOpen} />}
|
{showDock && roomId && <Header handleToggleOpen={this.handleToggleOpen} opened={opened} handleExitChat={this.handleExitChat} />}
|
||||||
{showDock && roomId && <Header handleToggleOpen={this.handleToggleOpen} opened={opened} handleExitChat={this.handleExitChat} />}
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,4 +1,6 @@
|
|||||||
@import "variables";
|
#safesupport {
|
||||||
@import "loader";
|
@import "variables";
|
||||||
@import "chat";
|
@import "loader";
|
||||||
@import "dark_mode";
|
@import "chat";
|
||||||
|
@import "dark_mode";
|
||||||
|
}
|
||||||
34
yarn.lock
34
yarn.lock
@@ -2445,10 +2445,10 @@ bluebird@^3.5.5:
|
|||||||
resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.7.2.tgz#9f229c15be272454ffa973ace0dbee79a1b0c36f"
|
resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.7.2.tgz#9f229c15be272454ffa973ace0dbee79a1b0c36f"
|
||||||
integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==
|
integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==
|
||||||
|
|
||||||
bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.4.0:
|
bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.11.9:
|
||||||
version "4.11.8"
|
version "4.12.0"
|
||||||
resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.8.tgz#2cde09eb5ee341f484746bb0309b3253b1b1442f"
|
resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.12.0.tgz#775b3f278efbb9718eec7361f483fb36fbbfea88"
|
||||||
integrity sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA==
|
integrity sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==
|
||||||
|
|
||||||
body-parser@1.19.0:
|
body-parser@1.19.0:
|
||||||
version "1.19.0"
|
version "1.19.0"
|
||||||
@@ -2514,7 +2514,7 @@ braces@^3.0.1:
|
|||||||
dependencies:
|
dependencies:
|
||||||
fill-range "^7.0.1"
|
fill-range "^7.0.1"
|
||||||
|
|
||||||
brorand@^1.0.1:
|
brorand@^1.0.1, brorand@^1.1.0:
|
||||||
version "1.1.0"
|
version "1.1.0"
|
||||||
resolved "https://registry.yarnpkg.com/brorand/-/brorand-1.1.0.tgz#12c25efe40a45e3c323eb8675a0a0ce57b22371f"
|
resolved "https://registry.yarnpkg.com/brorand/-/brorand-1.1.0.tgz#12c25efe40a45e3c323eb8675a0a0ce57b22371f"
|
||||||
integrity sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8=
|
integrity sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8=
|
||||||
@@ -3732,17 +3732,17 @@ electron-to-chromium@^1.3.390:
|
|||||||
integrity sha512-/hsgeVdReDsyTBE0aU9FRdh1wnNPrX3xlz3t61F+CJPOT+Umfi9DXHsCX85TEgWZQqlow0Rw44/4/jbU2Sqgkg==
|
integrity sha512-/hsgeVdReDsyTBE0aU9FRdh1wnNPrX3xlz3t61F+CJPOT+Umfi9DXHsCX85TEgWZQqlow0Rw44/4/jbU2Sqgkg==
|
||||||
|
|
||||||
elliptic@^6.0.0:
|
elliptic@^6.0.0:
|
||||||
version "6.5.2"
|
version "6.5.4"
|
||||||
resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.2.tgz#05c5678d7173c049d8ca433552224a495d0e3762"
|
resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.4.tgz#da37cebd31e79a1367e941b592ed1fbebd58abbb"
|
||||||
integrity sha512-f4x70okzZbIQl/NSRLkI/+tteV/9WqL98zx+SQ69KbXxmVrmjwsNUPn/gYJJ0sHvEak24cZgHIPegRePAtA/xw==
|
integrity sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==
|
||||||
dependencies:
|
dependencies:
|
||||||
bn.js "^4.4.0"
|
bn.js "^4.11.9"
|
||||||
brorand "^1.0.1"
|
brorand "^1.1.0"
|
||||||
hash.js "^1.0.0"
|
hash.js "^1.0.0"
|
||||||
hmac-drbg "^1.0.0"
|
hmac-drbg "^1.0.1"
|
||||||
inherits "^2.0.1"
|
inherits "^2.0.4"
|
||||||
minimalistic-assert "^1.0.0"
|
minimalistic-assert "^1.0.1"
|
||||||
minimalistic-crypto-utils "^1.0.0"
|
minimalistic-crypto-utils "^1.0.1"
|
||||||
|
|
||||||
email-addresses@^3.0.1:
|
email-addresses@^3.0.1:
|
||||||
version "3.1.0"
|
version "3.1.0"
|
||||||
@@ -5051,7 +5051,7 @@ hash.js@^1.0.0, hash.js@^1.0.3:
|
|||||||
inherits "^2.0.3"
|
inherits "^2.0.3"
|
||||||
minimalistic-assert "^1.0.1"
|
minimalistic-assert "^1.0.1"
|
||||||
|
|
||||||
hmac-drbg@^1.0.0:
|
hmac-drbg@^1.0.1:
|
||||||
version "1.0.1"
|
version "1.0.1"
|
||||||
resolved "https://registry.yarnpkg.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1"
|
resolved "https://registry.yarnpkg.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1"
|
||||||
integrity sha1-0nRXAQJabHdabFRXk+1QL8DGSaE=
|
integrity sha1-0nRXAQJabHdabFRXk+1QL8DGSaE=
|
||||||
@@ -5334,7 +5334,7 @@ inflight@^1.0.4:
|
|||||||
once "^1.3.0"
|
once "^1.3.0"
|
||||||
wrappy "1"
|
wrappy "1"
|
||||||
|
|
||||||
inherits@2, inherits@2.0.4, inherits@^2.0.1, inherits@^2.0.3, inherits@~2.0.0, inherits@~2.0.1, inherits@~2.0.3:
|
inherits@2, inherits@2.0.4, inherits@^2.0.1, inherits@^2.0.3, inherits@^2.0.4, inherits@~2.0.0, inherits@~2.0.1, inherits@~2.0.3:
|
||||||
version "2.0.4"
|
version "2.0.4"
|
||||||
resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
|
resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
|
||||||
integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
|
integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
|
||||||
@@ -6872,7 +6872,7 @@ minimalistic-assert@^1.0.0, minimalistic-assert@^1.0.1:
|
|||||||
resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7"
|
resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7"
|
||||||
integrity sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==
|
integrity sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==
|
||||||
|
|
||||||
minimalistic-crypto-utils@^1.0.0, minimalistic-crypto-utils@^1.0.1:
|
minimalistic-crypto-utils@^1.0.1:
|
||||||
version "1.0.1"
|
version "1.0.1"
|
||||||
resolved "https://registry.yarnpkg.com/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz#f6c00c1c0b082246e5c4d99dfb8c7c083b2b582a"
|
resolved "https://registry.yarnpkg.com/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz#f6c00c1c0b082246e5c4d99dfb8c7c083b2b582a"
|
||||||
integrity sha1-9sAMHAsIIkblxNmd+4x8CDsrWCo=
|
integrity sha1-9sAMHAsIIkblxNmd+4x8CDsrWCo=
|
||||||
|
|||||||
Reference in New Issue
Block a user