feat: force placeholder text when not connected

but preserve the state until the connection is back

Signed-off-by: Akos Kitta <[email protected]>

Author: Akos Kitta

Diff for: arduino-ide-extension/src/browser/serial/monitor/serial-monitor-send-input.tsx

@@ -112,15 +112,16 @@ export class SerialMonitorSendInput extends React.Component<
   override render(): React.ReactNode {
     const inputClassName = this.inputClassName;
     const placeholder = this.placeholder;
+    const readOnly = Boolean(inputClassName);
     return (
       <input
         ref={this.setRef}
         type="text"
         className={`theia-input ${inputClassName}`}
-        readOnly={Boolean(inputClassName)}
+        readOnly={readOnly}
         placeholder={placeholder}
         title={placeholder}
-        value={this.state.text}
+        value={readOnly ? '' : this.state.text} // always show the placeholder if cannot edit the <input>
         onChange={this.onChange}
         onKeyDown={this.onKeyDown}
       />