From 306b9fdd71073f30f1d2d442adac3e8fda0b990c Mon Sep 17 00:00:00 2001
From: JC Brand <jc@opkode.com>
Date: Mon, 17 Aug 2020 08:53:08 +0200
Subject: [PATCH] Updates #2193

Also remove top-level i18n declarations in components
---
 src/components/adhoc-commands.js | 107 ++++++++++++++++---------------
 src/components/message.js        |  10 +--
 src/components/toolbar.js        |  14 ++--
 src/converse-muc-views.js        |   2 +-
 4 files changed, 67 insertions(+), 66 deletions(-)

diff --git a/src/components/adhoc-commands.js b/src/components/adhoc-commands.js
index b6b1daaf8..a416b0314 100644
--- a/src/components/adhoc-commands.js
+++ b/src/components/adhoc-commands.js
@@ -10,34 +10,28 @@ import { unsafeHTML } from 'lit-html/directives/unsafe-html.js';
 const { Strophe, $iq } = converse.env;
 const u = converse.env.utils;
 
-const i18n_hide = __('Hide');
-const i18n_choose_service = __('On which entity do you want to run commands?');
-const i18n_choose_service_instructions = __(
-    'Certain XMPP services and entities allow privileged users to execute ad-hoc commands on them.');
-const i18n_commands_found = __('Commands found');
-const i18n_fetch_commands = __('List available commands');
-const i18n_jid_placeholder = __('XMPP Address');
-const i18n_no_commands_found = __('No commands found');
-const i18n_run = __('Execute');
 
+const tpl_command_form = (o, command) => {
+    const i18n_hide = __('Hide');
+    const i18n_run = __('Execute');
+    return html`
+        <form @submit=${o.runCommand}>
+            ${ command.alert ? html`<div class="alert alert-${command.alert_type}" role="alert">${command.alert}</div>` : '' }
+            <fieldset class="form-group">
+                <input type="hidden" name="command_node" value="${command.node}"/>
+                <input type="hidden" name="command_jid" value="${command.jid}"/>
 
-const tpl_command_form = (o, command) => html`
-    <form @submit=${o.runCommand}>
-        ${ command.alert ? html`<div class="alert alert-${command.alert_type}" role="alert">${command.alert}</div>` : '' }
-        <fieldset class="form-group">
-            <input type="hidden" name="command_node" value="${command.node}"/>
-            <input type="hidden" name="command_jid" value="${command.jid}"/>
-
-            <p class="form-help">${command.instructions}</p>
-            <!-- Fields are generated internally, with xForm2webForm -->
-            ${ command.fields.map(field =>  unsafeHTML(field)) }
-        </fieldset>
-        <fieldset>
-            <input type="submit" class="btn btn-primary" value="${i18n_run}">
-            <input type="button" class="btn btn-secondary button-cancel" value="${i18n_hide}" @click=${o.hideCommandForm}>
-        </fieldset>
-    </form>
-`;
+                <p class="form-help">${command.instructions}</p>
+                <!-- Fields are generated internally, with xForm2webForm -->
+                ${ command.fields.map(field =>  unsafeHTML(field)) }
+            </fieldset>
+            <fieldset>
+                <input type="submit" class="btn btn-primary" value="${i18n_run}">
+                <input type="button" class="btn btn-secondary button-cancel" value="${i18n_hide}" @click=${o.hideCommandForm}>
+            </fieldset>
+        </form>
+    `;
+}
 
 
 const tpl_command = (o, command) => html`
@@ -62,33 +56,42 @@ async function getAutoCompleteList () {
     return jids;
 }
 
-const tpl_adhoc = (o) => html`
-    ${ o.alert ? html`<div class="alert alert-${o.alert_type}" role="alert">${o.alert}</div>` : '' }
-    <form class="converse-form" @submit=${o.fetchCommands}>
-        <fieldset class="form-group">
-            <label>
-                ${i18n_choose_service}
-                <p class="form-help">${i18n_choose_service_instructions}</p>
-                <converse-autocomplete
-                    .getAutoCompleteList="${getAutoCompleteList}"
-                    placeholder="${i18n_jid_placeholder}"
-                    name="jid"/>
-            </label>
-        </fieldset>
-        <fieldset class="form-group">
-            <input type="submit" class="btn btn-primary" value="${i18n_fetch_commands}">
-        </fieldset>
-        ${ o.view === 'list-commands' ? html`
-        <fieldset class="form-group">
-            <ul class="list-group">
-                <li class="list-group-item active">${ o.commands.length ? i18n_commands_found : i18n_no_commands_found }:</li>
-                ${ o.commands.map(cmd => tpl_command(o, cmd)) }
-            </ul>
-        </fieldset>`
-        : '' }
+const tpl_adhoc = (o) => {
+    const i18n_choose_service = __('On which entity do you want to run commands?');
+    const i18n_choose_service_instructions = __(
+        'Certain XMPP services and entities allow privileged users to execute ad-hoc commands on them.');
+    const i18n_commands_found = __('Commands found');
+    const i18n_fetch_commands = __('List available commands');
+    const i18n_jid_placeholder = __('XMPP Address');
+    const i18n_no_commands_found = __('No commands found');
+    return html`
+        ${ o.alert ? html`<div class="alert alert-${o.alert_type}" role="alert">${o.alert}</div>` : '' }
+        <form class="converse-form" @submit=${o.fetchCommands}>
+            <fieldset class="form-group">
+                <label>
+                    ${i18n_choose_service}
+                    <p class="form-help">${i18n_choose_service_instructions}</p>
+                    <converse-autocomplete
+                        .getAutoCompleteList="${getAutoCompleteList}"
+                        placeholder="${i18n_jid_placeholder}"
+                        name="jid"/>
+                </label>
+            </fieldset>
+            <fieldset class="form-group">
+                <input type="submit" class="btn btn-primary" value="${i18n_fetch_commands}">
+            </fieldset>
+            ${ o.view === 'list-commands' ? html`
+            <fieldset class="form-group">
+                <ul class="list-group">
+                    <li class="list-group-item active">${ o.commands.length ? i18n_commands_found : i18n_no_commands_found }:</li>
+                    ${ o.commands.map(cmd => tpl_command(o, cmd)) }
+                </ul>
+            </fieldset>`
+            : '' }
 
-    </form>
-`;
+        </form>
+    `;
+}
 
 
 async function fetchCommandForm (command) {
diff --git a/src/components/message.js b/src/components/message.js
index 5b8868359..2b45abd1a 100644
--- a/src/components/message.js
+++ b/src/components/message.js
@@ -16,11 +16,6 @@ import { renderAvatar } from './../templates/directives/avatar';
 const { Strophe } = converse.env;
 const u = converse.env.utils;
 
-const i18n_edited = __('This message has been edited');
-const i18n_show = __('Show more');
-const i18n_show_less = __('Show less');
-const i18n_uploading = __('Uploading file:');
-
 
 export default class Message extends CustomElement {
 
@@ -112,6 +107,7 @@ export default class Message extends CustomElement {
     }
 
     renderFileProgress () {
+        const i18n_uploading = __('Uploading file:');
         const filename = this.model.file.name;
         const size = filesize(this.model.file.size);
         return html`
@@ -214,7 +210,11 @@ export default class Message extends CustomElement {
     }
 
     renderMessageText () {
+        const i18n_edited = __('This message has been edited');
+        const i18n_show = __('Show more');
         const is_groupchat_message = (this.message_type === 'groupchat');
+        const i18n_show_less = __('Show less');
+
         const tpl_spoiler_hint = html`
             <div class="chat-msg__spoiler-hint">
                 <span class="spoiler-hint">${this.spoiler_hint}</span>
diff --git a/src/components/toolbar.js b/src/components/toolbar.js
index 4108bcc0c..e9254be34 100644
--- a/src/components/toolbar.js
+++ b/src/components/toolbar.js
@@ -7,13 +7,6 @@ import { until } from 'lit-html/directives/until.js';
 
 const Strophe = converse.env.Strophe
 
-const i18n_chars_remaining = __('Message characters remaining');
-const i18n_choose_file =  __('Choose a file to send')
-const i18n_hide_occupants = __('Hide occupants');
-const i18n_send_message = __('Send the message');
-const i18n_show_occupants = __('Show occupants');
-const i18n_start_call = __('Start a call');
-
 
 export class ChatToolbar extends CustomElement {
 
@@ -35,6 +28,7 @@ export class ChatToolbar extends CustomElement {
     }
 
     render () {
+        const i18n_send_message = __('Send the message');
         return html`
             ${ this.show_toolbar ? html`<span class="toolbar-buttons">${until(this.getButtons(), '')}</span>` : '' }
             ${ this.show_send_button ? html`<button type="submit" class="btn send-button fa fa-paper-plane" title="${ i18n_send_message }"></button>` : '' }
@@ -49,12 +43,14 @@ export class ChatToolbar extends CustomElement {
         }
 
         if (this.show_call_button) {
+            const i18n_start_call = __('Start a call');
             buttons.push(html`
                 <button class="toggle-call" @click=${this.toggleCall} title="${i18n_start_call}">
                     <converse-icon class="fa fa-phone" path-prefix="/dist" size="1em"></converse-icon>
                 </button>`
             );
         }
+        const i18n_chars_remaining = __('Message characters remaining');
         const message_limit = api.settings.get('message_limit');
         if (message_limit) {
             buttons.push(html`<span class="right message-limit" title="${i18n_chars_remaining}">${this.message_limit}</span>`);
@@ -68,6 +64,8 @@ export class ChatToolbar extends CustomElement {
         buttons.push(html`${until(http_upload_promise.then(is_supported => this.getHTTPUploadButton(is_supported)),'')}`);
 
         if (this.show_occupants_toggle) {
+            const i18n_hide_occupants = __('Hide participants');
+            const i18n_show_occupants = __('Show participants');
             buttons.push(html`
                 <button class="toggle_occupants right"
                         title="${this.hidden_occupants ? i18n_show_occupants : i18n_hide_occupants}"
@@ -85,9 +83,9 @@ export class ChatToolbar extends CustomElement {
         return _converse.api.hook('getToolbarButtons', this, buttons);
     }
 
-
     getHTTPUploadButton (is_supported) {
         if (is_supported) {
+            const i18n_choose_file =  __('Choose a file to send')
             return html`
                 <button title="${i18n_choose_file}" @click=${this.toggleFileUpload}>
                     <converse-icon class="fa fa-paperclip"
diff --git a/src/converse-muc-views.js b/src/converse-muc-views.js
index 27f23d9bd..3f868c261 100644
--- a/src/converse-muc-views.js
+++ b/src/converse-muc-views.js
@@ -313,7 +313,7 @@ converse.plugins.add('converse-muc-views', {
                         } else if (state === 'op') {
                             return `${result}${__("%1$s are now moderators", actors[0])}\n`;
                         } else if (state === 'deop') {
-                            return `${result}${__("%1$s are no longer moderator", actors[0])}\n`;
+                            return `${result}${__("%1$s are no longer moderators", actors[0])}\n`;
                         } else if (state === 'voice') {
                             return `${result}${__("%1$s have been given voices", actors[0])}\n`;
                         } else if (state === 'mute') {