Don't render 'add contact' button for contacts with subscription of `'none'`

They are already saved in the roster, there's just no presence subscription.

src/headless/plugins/roster/utils.js

@@ -219,3 +219,13 @@ export function rejectPresenceSubscription(jid, message) {
     }
     api.send(pres);
 }
+
+/**
+ * @param {import('./contact.js').default} contact
+ * @return {boolean}
+ */
+export function isUnsavedContact(contact) {
+    const bare_jid = _converse.session.get('bare_jid');
+    const is_self = bare_jid !== contact.get('jid');
+    return !is_self && !contact.get('subscription');
+}

src/headless/types/plugins/roster/utils.d.ts

@@ -28,5 +28,10 @@ export function onRosterContactsFetched(): void;
  * @param {String} [message] - An optional message to the user
  */
 export function rejectPresenceSubscription(jid: string, message?: string): void;
+/**
+ * @param {import('./contact.js').default} contact
+ * @return {boolean}
+ */
+export function isUnsavedContact(contact: import("./contact.js").default): boolean;
 export type RosterContacts = import("./contacts").default;
 //# sourceMappingURL=utils.d.ts.map

src/plugins/rosterview/contactview.js

@@ -9,7 +9,7 @@ import { blockContact, removeContact } from './utils.js';
 
 const { Strophe } = converse.env;
 
-export default class RosterContact extends ObservableElement {
+export default class RosterContactView extends ObservableElement {
     /**
      * @typedef {import('shared/components/types').ObservableProperty} ObservableProperty
      */
@@ -36,13 +36,14 @@ export default class RosterContact extends ObservableElement {
     }
 
     render() {
-        if (this.model.get('requesting') === true) {
-            return tplRequestingContact(this);
-        } else if (this.model.get('subscription') === 'none') {
-            return tplUnsavedContact(this);
-        } else {
-            return tplRosterItem(this);
+        if (this.model instanceof _converse.exports.RosterContact) {
+            if (this.model.get('requesting') === true) {
+                return tplRequestingContact(this);
+            } else if (!this.model.get('subscription')) {
+                return tplUnsavedContact(this);
+            }
         }
+        return tplRosterItem(this);
     }
 
     /**
@@ -129,4 +130,4 @@ export default class RosterContact extends ObservableElement {
     }
 }
 
-api.elements.define('converse-roster-contact', RosterContact);
+api.elements.define('converse-roster-contact', RosterContactView);

src/plugins/rosterview/templates/unsaved_contact.js

@@ -12,7 +12,7 @@ export default (el) => {
     const display_name = el.model.getDisplayName();
     const jid = el.model.get('jid');
 
-    const i18n_add_contact = __('Click to add %1$s to your roster', display_name);
+    const i18n_add_contact = __('Click to add %1$s as a contact', display_name);
     const i18n_chat = __('Click to chat with %1$s (XMPP address: %2$s)', display_name, jid);
     return html`
         <a

src/types/plugins/rosterview/contactview.d.ts

@@ -1,4 +1,4 @@
-export default class RosterContact extends ObservableElement {
+export default class RosterContactView extends ObservableElement {
     static get properties(): {
         model: {
             type: ObjectConstructor;