Hide password reset form for SASL auth mechanisms where it doesn't make sense

src/headless/shared/connection/index.js

@@ -255,7 +255,6 @@ export class Connection extends Strophe.Connection {
     /**
      * Used to keep track of why we got disconnected, so that we can
      * decide on what the next appropriate action is (in onDisconnected)
-     * @method Connection.setDisconnectionCause
      * @param {Number|'logout'} [cause] - The status number as received from Strophe.
      * @param {String} [reason] - An optional user-facing message as to why
      *  there was a disconnection.
@@ -454,7 +453,6 @@ export class Connection extends Strophe.Connection {
 
 /**
  * The MockConnection class is used during testing, to mock an XMPP connection.
- * @class
  */
 export class MockConnection extends Connection {
 
@@ -496,6 +494,11 @@ export class MockConnection extends Connection {
         }
     }
 
+    // @ts-ignore
+    get _sasl_mechanism () {
+        return new Strophe.SASLSHA256();
+    }
+
     _processRequest () { // eslint-disable-line class-methods-use-this
         // Don't attempt to send out stanzas
     }

src/headless/types/shared/connection/index.d.ts

@@ -57,7 +57,6 @@ export class Connection extends Connection_base {
     /**
      * Used to keep track of why we got disconnected, so that we can
      * decide on what the next appropriate action is (in onDisconnected)
-     * @method Connection.setDisconnectionCause
      * @param {Number|'logout'} [cause] - The status number as received from Strophe.
      * @param {String} [reason] - An optional user-facing message as to why
      *  there was a disconnection.

src/plugins/profile/templates/profile_modal.js

@@ -2,6 +2,7 @@ import "shared/components/image-picker.js";
 import { __ } from "i18n";
 import { _converse } from "@converse/headless";
 import { html } from "lit";
+import { shouldShowPasswordResetForm } from "../utils";
 
 /**
  * @param {import('../modals/profile').default} el
@@ -37,7 +38,11 @@ export default (el) => {
     const i18n_profile = __("Profile");
     const ii18n_reset_password = __("Reset Password");
 
-    const navigation_tabs = [
+    // Initialize navigation_tabs as a Map
+    const navigation_tabs = new Map();
+
+    navigation_tabs.set(
+        "profile",
         html`<li role="presentation" class="nav-item">
             <a
                 class="nav-link ${el.tab === "profile" ? "active" : ""}"
@@ -50,27 +55,31 @@ export default (el) => {
                 data-toggle="tab"
                 >${i18n_profile}</a
             >
-        </li>`,
-    ];
-
-    navigation_tabs.push(
-        html`<li role="presentation" class="nav-item">
-            <a
-                class="nav-link ${el.tab === "passwordreset" ? "active" : ""}"
-                id="passwordreset-tab"
-                href="#passwordreset-tabpanel"
-                aria-controls="passwordreset-tabpanel"
-                role="tab"
-                @click="${(ev) => el.switchTab(ev)}"
-                data-name="passwordreset"
-                data-toggle="tab"
-                >${ii18n_reset_password}</a
-            >
         </li>`
     );
 
+    if (shouldShowPasswordResetForm()) {
+        navigation_tabs.set(
+            "passwordreset",
+            html`<li role="presentation" class="nav-item">
+                <a
+                    class="nav-link ${el.tab === "passwordreset" ? "active" : ""}"
+                    id="passwordreset-tab"
+                    href="#passwordreset-tabpanel"
+                    aria-controls="passwordreset-tabpanel"
+                    role="tab"
+                    @click="${(ev) => el.switchTab(ev)}"
+                    data-name="passwordreset"
+                    data-toggle="tab"
+                    >${ii18n_reset_password}</a
+                >
+            </li>`
+        );
+    }
+
     if (_converse.pluggable.plugins["converse-omemo"]?.enabled(_converse)) {
-        navigation_tabs.push(
+        navigation_tabs.set(
+            "omemo",
             html`<li role="presentation" class="nav-item">
                 <a
                     class="nav-link ${el.tab === "omemo" ? "active" : ""}"
@@ -88,7 +97,13 @@ export default (el) => {
     }
 
     return html`
-        <ul class="nav nav-pills justify-content-center">${navigation_tabs}</ul>
+        ${
+            navigation_tabs.size
+                ? html`<ul class="nav nav-pills justify-content-center">
+                      ${Array.from(navigation_tabs.values())}
+                  </ul>`
+                : ""
+        }
         <div class="tab-content">
             <div class="tab-pane ${el.tab === "profile" ? "active" : ""}" id="profile-tabpanel" role="tabpanel" aria-labelledby="profile-tab">
                 <form class="converse-form converse-form--modal" action="#" @submit=${(ev) => el.onFormSubmitted(ev)}>
@@ -130,12 +145,21 @@ export default (el) => {
                     </div>
                 </form>
             </div>
-
-            <div class="tab-pane ${el.tab === "passwordreset" ? "active" : ""}" id="passwordreset-tabpanel" role="tabpanel" aria-labelledby="passwordreset-tab">
-                ${el.tab === "passwordreset" ? html`<converse-change-password-form></converse-change-password-form>` : ""}
-            </div>
-
-            ${_converse.pluggable.plugins["converse-omemo"]?.enabled(_converse) ? tplOmemoPage(el) : ""}
+            ${
+                navigation_tabs.get("passwordreset")
+                    ? html` <div
+                          class="tab-pane ${el.tab === "passwordreset" ? "active" : ""}"
+                          id="passwordreset-tabpanel"
+                          role="tabpanel"
+                          aria-labelledby="passwordreset-tab"
+                      >
+                          ${el.tab === "passwordreset"
+                              ? html`<converse-change-password-form></converse-change-password-form>`
+                              : ""}
+                      </div>`
+                    : ""
+            }
+            ${navigation_tabs.get("omemo") ? tplOmemoPage(el) : ""}
         </div>
     </div>`;
 };

src/plugins/profile/utils.js

@@ -1,21 +1,39 @@
-import { __ } from 'i18n';
-import { _converse } from '@converse/headless';
+import { __ } from "i18n";
+import { _converse } from "@converse/headless";
 
 /**
  * @param {string} stat
  */
-export function getPrettyStatus (stat) {
-    if (stat === 'chat') {
-        return __('online');
-    } else if (stat === 'dnd') {
-        return __('busy');
-    } else if (stat === 'xa') {
-        return __('away for long');
-    } else if (stat === 'away') {
-        return __('away');
-    } else if (stat === 'offline') {
-        return __('offline');
+export function getPrettyStatus(stat) {
+    if (stat === "chat") {
+        return __("online");
+    } else if (stat === "dnd") {
+        return __("busy");
+    } else if (stat === "xa") {
+        return __("away for long");
+    } else if (stat === "away") {
+        return __("away");
+    } else if (stat === "offline") {
+        return __("offline");
     } else {
-        return __(stat) || __('online');
+        return __(stat) || __("online");
     }
 }
+
+/**
+ * For certain auth mechanisms, it doesn't make sense to show the password
+ * form.
+ */
+export function shouldShowPasswordResetForm() {
+    const conn = _converse.api.connection.get();
+    const mechanism = conn._sasl_mechanism;
+    if (
+        mechanism.mechname === "EXTERNAL" ||
+        mechanism.mechname === "ANONYMOUS" ||
+        mechanism.mechname === "X-OAUTH2" ||
+        mechanism.mechname === "OAUTHBEARER"
+    ) {
+        return false;
+    }
+    return true;
+}

src/types/plugins/profile/utils.d.ts

@@ -2,4 +2,9 @@
  * @param {string} stat
  */
 export function getPrettyStatus(stat: string): any;
+/**
+ * For certain auth mechanisms, it doesn't make sense to show the password
+ * form.
+ */
+export function shouldShowPasswordResetForm(): boolean;
 //# sourceMappingURL=utils.d.ts.map