Fix disabled state of the composer
This commit is contained in:
parent
3cafed478c
commit
fedb5b9f63
3 changed files with 11 additions and 4 deletions
res/css/views/rooms
src/components/views/rooms
|
@ -68,8 +68,8 @@ limitations under the License.
|
|||
}
|
||||
|
||||
&.mx_BasicMessageComposer_input_disabled {
|
||||
// Ignore all user input to avoid accidentally triggering the composer
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -140,7 +140,12 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
|
|||
}
|
||||
|
||||
public componentDidUpdate(prevProps: IProps) {
|
||||
if (this.props.placeholder !== prevProps.placeholder && this.props.placeholder) {
|
||||
// We need to re-check the placeholder when the enabled state changes because it causes the
|
||||
// placeholder element to remount, which gets rid of the `::before` class. Re-evaluating the
|
||||
// placeholder means we get a proper `::before` with the placeholder.
|
||||
const enabledChange = this.props.disabled !== prevProps.disabled;
|
||||
const placeholderChanged = this.props.placeholder !== prevProps.placeholder;
|
||||
if (this.props.placeholder && (placeholderChanged || enabledChange)) {
|
||||
const {isEmpty} = this.props.model;
|
||||
if (isEmpty) {
|
||||
this.showPlaceholder();
|
||||
|
@ -670,8 +675,6 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
|
|||
});
|
||||
const classes = classNames("mx_BasicMessageComposer_input", {
|
||||
"mx_BasicMessageComposer_input_shouldShowPillAvatar": this.state.showPillAvatar,
|
||||
|
||||
// TODO: @@ TravisR: This doesn't work properly. The composer resets in a strange way.
|
||||
"mx_BasicMessageComposer_input_disabled": this.props.disabled,
|
||||
});
|
||||
|
||||
|
|
|
@ -477,6 +477,10 @@ export default class SendMessageComposer extends React.Component {
|
|||
}
|
||||
|
||||
onAction = (payload) => {
|
||||
// don't let the user into the composer if it is disabled - all of these branches lead
|
||||
// to the cursor being in the composer
|
||||
if (this.props.disabled) return;
|
||||
|
||||
switch (payload.action) {
|
||||
case 'reply_to_event':
|
||||
case Action.FocusComposer:
|
||||
|
|
Loading…
Reference in a new issue