Display persistant command input on server buffer

This commit changes the composer to not be read-only on the server
buffer, which tells the user that they can send commands from that view.

On the server buffer, the placeholder is changed to
"Type a command (see /help)", which indicates to the user that this buffer
only accepts commands, and gives them a hint for how to learn what
commands are available.

Implements: https://todo.sr.ht/~emersion/gamja/38
This commit is contained in:
Noelle Leigh 2021-12-20 15:09:10 -05:00 committed by Simon Ser
parent b11f58b975
commit 0b59cf92b9
2 changed files with 13 additions and 5 deletions

View file

@ -1759,13 +1759,15 @@ export default class App extends Component {
} }
let composerReadOnly = false; let composerReadOnly = false;
if (activeBuffer && activeBuffer.type === BufferType.SERVER) {
composerReadOnly = true;
}
if (activeServer && activeServer.status !== ServerStatus.REGISTERED) { if (activeServer && activeServer.status !== ServerStatus.REGISTERED) {
composerReadOnly = true; composerReadOnly = true;
} }
let commandOnly = false
if (activeBuffer && activeBuffer.type === BufferType.SERVER) {
commandOnly = true
}
return html` return html`
<section <section
id="buffer-list" id="buffer-list"
@ -1813,6 +1815,7 @@ export default class App extends Component {
readOnly=${composerReadOnly} readOnly=${composerReadOnly}
onSubmit=${this.handleComposerSubmit} onSubmit=${this.handleComposerSubmit}
autocomplete=${this.autocomplete} autocomplete=${this.autocomplete}
commandOnly=${commandOnly}
/> />
${dialog} ${dialog}
${error} ${error}

View file

@ -143,7 +143,7 @@ export default class Composer extends Component {
return; return;
} }
if (this.props.readOnly && event.key !== "/") { if (this.props.readOnly || (this.props.commandOnly && event.key !== "/")) {
return; return;
} }
@ -201,6 +201,11 @@ export default class Composer extends Component {
className = "read-only"; className = "read-only";
} }
let placeholder = "Type a message";
if (this.props.commandOnly) {
placeholder = "Type a command (see /help)";
}
return html` return html`
<form <form
id="composer" id="composer"
@ -214,7 +219,7 @@ export default class Composer extends Component {
ref=${this.textInput} ref=${this.textInput}
value=${this.state.text} value=${this.state.text}
autocomplete="off" autocomplete="off"
placeholder="Type a message" placeholder=${placeholder}
enterkeyhint="send" enterkeyhint="send"
onKeyDown=${this.handleInputKeyDown} onKeyDown=${this.handleInputKeyDown}
/> />