display only error or typing indicator at one time
This commit is contained in:
parent
e35f1e4a8d
commit
bb5463881c
@ -285,7 +285,7 @@ class MessageForm extends PureComponent {
|
||||
className={styles.input}
|
||||
id="message-input"
|
||||
innerRef={(ref) => { this.textarea = ref; return this.textarea; }}
|
||||
placeholder={error || intl.formatMessage(messages.inputPlaceholder, { 0: chatName })}
|
||||
placeholder={intl.formatMessage(messages.inputPlaceholder, { 0: chatName })}
|
||||
aria-controls={chatAreaId}
|
||||
aria-label={intl.formatMessage(messages.inputLabel, { 0: chatTitle })}
|
||||
aria-invalid={hasErrors ? 'true' : 'false'}
|
||||
@ -311,10 +311,10 @@ class MessageForm extends PureComponent {
|
||||
onClick={() => {}}
|
||||
/>
|
||||
</div>
|
||||
<div className={styles.info}>
|
||||
<div className={error ? styles.error : styles.info}>
|
||||
<span>
|
||||
<span>{renderIsTypingString()}</span>
|
||||
{renderIsTypingString() ? <span className={styles.connectingAnimation} /> : null}
|
||||
<span>{error || renderIsTypingString()}</span>
|
||||
{!error && renderIsTypingString() ? <span className={styles.connectingAnimation} /> : null}
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
|
@ -100,6 +100,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.error,
|
||||
.info {
|
||||
font-size: calc(var(--font-size-base) * .75);
|
||||
color: var(--color-gray-dark);
|
||||
@ -115,6 +116,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
.error {
|
||||
color: var(--color-danger);
|
||||
}
|
||||
|
||||
.connectingAnimation {
|
||||
margin: auto;
|
||||
|
Loading…
Reference in New Issue
Block a user