Update.

src/snek/static/chat-input.js

@@ -4,6 +4,7 @@ import { app } from "./app.js";
 import { NjetComponent, eventBus } from "./njet.js";
 import { FileUploadGrid } from "./file-upload-grid.js";
 import { loggerFactory } from "./logger.js";
+import "./toolbar-menu.js";
 
 const log = loggerFactory.getLogger("ChatInput");
 
@@ -381,10 +382,7 @@ textToLeetAdvanced(text) {
     this.appendChild(this.textarea);
 
     this.sttButton = document.createElement("stt-button");
-    this.appendChild(this.sttButton);
-
     this.ttsButton = document.createElement("tts-button");
-    this.appendChild(this.ttsButton);
 
     this.uploadButton = document.createElement("upload-button");
     this.uploadButton.setAttribute("channel", this.channelUid);
@@ -400,10 +398,15 @@ textToLeetAdvanced(text) {
     });
     this.subscribe("file-uploading", (e) => {
       this.fileUploadGrid.style.display = "block";
-      this.uploadButton.style.display = "none";
+      this.toolbarMenu.style.display = "none";
       this.textarea.style.display = "none";
-    })
-    this.appendChild(this.uploadButton);
+    });
+
+    this.toolbarMenu = document.createElement("toolbar-menu");
+    this.toolbarMenu.addButton(this.sttButton, 'stt');
+    this.toolbarMenu.addButton(this.ttsButton, 'tts');
+    this.toolbarMenu.addButton(this.uploadButton, 'upload');
+    this.appendChild(this.toolbarMenu);
 
     this.textarea.addEventListener("blur", () => {
       this.updateFromInput(this.value, true).then(
@@ -413,7 +416,7 @@ textToLeetAdvanced(text) {
 
     this.subscribe("file-uploads-done", (data)=>{
       this.textarea.style.display = "block";
-      this.uploadButton.style.display = "block";
+      this.toolbarMenu.style.display = "inline-block";
       this.fileUploadGrid.style.display = "none";
       let msg =data.reduce((message, file) => {
         return `${message}[${file.filename || file.name || file.remoteFile}](/channel/attachment/${file.remoteFile})`;