quicksave

src/converse-muc-views.js

@@ -23,7 +23,7 @@ import tpl_chatroom_disconnect from "templates/chatroom_disconnect.html";
 import tpl_muc_config_form from "templates/muc_config_form.js";
 import tpl_chatroom_head from "templates/chatroom_head.js";
 import tpl_muc_invite_modal from "templates/muc_invite_modal.js";
-import tpl_chatroom_nickname_form from "templates/chatroom_nickname_form.html";
+import tpl_muc_nickname_form from "templates/muc_nickname_form.js";
 import tpl_muc_password_form from "templates/muc_password_form.js";
 import tpl_muc_sidebar from "templates/muc_sidebar.js";
 import tpl_info from "templates/info.html";
@@ -1688,11 +1688,12 @@ converse.plugins.add('converse-muc-views', {
                     __('Choose a nickname to enter') :
                     __('Please choose your nickname');
 
-                const html = tpl_chatroom_nickname_form(Object.assign({
+                const template = tpl_muc_nickname_form(Object.assign({
                     heading,
                     'label_nickname': __('Nickname'),
                     'label_join': __('Enter groupchat'),
                 }, this.model.toJSON()));
+                render(template, this.el.querySelector('.chatroom-form-container'));
 
                 if (_converse.muc_show_logs_before_join) {
                     const container = this.el.querySelector('.muc-bottom-panel');

src/templates/chatarea.html

@@ -4,5 +4,16 @@
             <div class="empty-history-feedback"><span>{{{o.__('No message history available.')}}}</span></div>
         {[ } ]}
     </div>
-    <div class="bottom-panel"></div>
+    <div class="bottom-panel">
+        {[ if (o.entered) { ]}
+            {[ if (o.can_edit) { ]}
+                <div class="emoji-picker__container dropup"></div>
+                <div class="message-form-container">
+            {[ } else { ]}
+                <div class="muc-bottom-panel">{{{o.__("You're not allowed to send messages in this room")}}}</div>
+            {[ } ]}
+        {[ } else { ]}
+            <div class="muc-bottom-panel"></div>
+        {[ } ]}
+    </div>
 </div>

src/templates/chatroom_bottom_panel.html

@@ -1,10 +0,0 @@
-{[ if (o.entered) { ]}
-    {[ if (o.can_edit) { ]}
-        <div class="emoji-picker__container dropup"></div>
-        <div class="message-form-container">
-    {[ } else { ]}
-        <div class="muc-bottom-panel">{{{o.__("You're not allowed to send messages in this room")}}}</div>
-    {[ } ]}
-{[ } else { ]}
-    <div class="muc-bottom-panel"></div>
-{[ } ]}

src/templates/chatroom_nickname_form.html → src/templates/muc_nickname_form.js

@@ -1,12 +1,15 @@
-<div class="chatroom-form-container muc-nickname-form">
+import { html } from "lit-html";
+
+
+export default (o) => html`
     <form class="converse-form chatroom-form converse-centered-form">
         <fieldset class="form-group">
-            <label>{{{o.heading}}}</label>
-            <input type="text" required="required" name="nick" value="{{{o.nickname}}}"
-                   class="form-control {{o.error_class}}" placeholder="{{{o.label_nickname}}}"/>
+            <label>${o.heading}</label>
+            <input type="text" required="required" name="nick" value="${o.nickname}"
+                   class="form-control placeholder="${o.label_nickname}"/>
         </fieldset>
         <fieldset class="form-group">
-            <input type="submit" class="btn btn-primary" name="join" value="{{{o.label_join}}}"/>
+            <input type="submit" class="btn btn-primary" name="join" value="${o.label_join}"/>
         </fieldset>
     </form>
-</div>
+`;