Handle invalid mods better

js/languages/en_US.json

@@ -402,7 +402,7 @@
     "PERCENTAGE": "%{percentage}%*",
     "FIXED_PLUS_PERCENTAGE": "%{amount} (+%{percentage}%)*",
     "failed": "The information for this moderator failed to load.",
-    "invalid": "This user is not currently a moderator.",
+    "invalid": "This user is not currently a valid moderator.",
     "noCoinSupport": "This moderator does not accept any of the coins your wallet supports.",
     "noPreferredSupport": "This moderator does not accept any of your preferred coins. They can only moderate transactions in the following currencies: %{coins}.",
     "languages": "%{lang}, and %{smart_count} other language. |||| %{lang}, and %{smart_count} other languages."
@@ -2055,7 +2055,8 @@
     "descriptionLength": "Descriptions must be no more than 300 characters",
     "noTerms": "Please provide your terms of service.",
     "termsLength": "Terms of service must be no more than 10,000 characters",
-    "noLanguages": "Please list at least one language you can communicate in."
+    "noLanguages": "Please list at least one language you can communicate in.",
+    "invalidData": "The value for %{field} is invalid or missing."
   },
   "feeModelErrors": {
     "noFeeType": "Please set a valid fee type",
@@ -5740,4 +5741,4 @@
     "zu": "Zulu",
     "zu-ZA": "Zulu (South Africa)"
   }
-}
+}

js/templates/components/moderators/card.html

@@ -3,7 +3,8 @@
    const loaded = !!ob.name;
    /* Disable the card if it is invalid and the controls should be shown, and it is not selected. This allow the user to de-select invalid cards.
       The view should prevent the invalid card from being selected again, disabling it is redundant but important visually. */
-   const isDisabled = (!ob.valid && !ob.controlsOnInvalid ) || (!ob.valid && ob.controlsOnInvalid && ob.selectedState !== 'selected') || !loaded ? 'disabled' : '';
+   const isOKMod = ob.valid && ob.isMod;
+   const isDisabled = (!isOKMod && !ob.controlsOnInvalid ) || (!isOKMod && ob.controlsOnInvalid && ob.selectedState !== 'selected') || !loaded ? 'disabled' : '';
    const style = ob.verified ? 'verified clrBrAlert2 clrBAlert2Grad' : '';
 %>
 
@@ -29,7 +30,7 @@
           <span class="clrT2"><%= ob.handle ? `@${ob.handle}` : '' %></span>
         </div>
         <div class="row">
-          <% if (ob.valid) { %>
+          <% if (isOKMod) { %>
             <div class="rowTn clamp2"><%=ob.moderatorInfo.description %></div>
             <% if (ob.modLanguages && ob.modLanguages.length) { %>
               <div class="txSm rowTn">
@@ -62,6 +63,15 @@
           <% } %>
           <% } else { %>
             <span class="clrTErr"><%= ob.polyT('moderatorCard.invalid') %></span>
+          <%
+            if (ob.modelErrors) {
+              const translatedErrs = [];
+              Object.keys(ob.modelErrors).forEach(field => {
+                translatedErrs.push(ob.polyT('moderatorModelErrors.invalidData', { field }));
+              });
+              print(ob.formErrorTmpl({ errors: translatedErrs }));
+            }
+          %>
           <% } %>
         </div>
       <% } else { %>
@@ -72,9 +82,9 @@
       <% } %>
     </div>
     <div class="flexNoShrink">
-      <% if (ob.valid || ob.controlsOnInvalid) { %>
+      <% if (isOKMod || ob.controlsOnInvalid) { %>
         <div class="flexCol gutterV">
-          <% if (ob.valid) { %>
+          <% if (isOKMod) { %>
             <button class="btn clrP clrBr clrSh2 selectBtn js-viewBtn">
               <%= ob.polyT('moderatorCard.view') %>
             </button>

js/views/components/moderators/Card.js

@@ -7,6 +7,7 @@ import VerifiedMod, { getModeratorOptions } from '../VerifiedMod';
 import { handleLinks } from '../../../utils/dom';
 import { launchModeratorDetailsModal } from '../../../utils/modalManager';
 import { anySupportedByWallet } from '../../../data/walletCurrencies';
+import { isFiatCur } from '../../../data/currencies';
 import { getLangByCode } from '../../../data/languages';
 
 export default class extends BaseVw {
@@ -44,6 +45,10 @@ export default class extends BaseVw {
     const modInfo = this.model.get('moderatorInfo');
     this.modCurs = modInfo && modInfo.get('acceptedCurrencies') || [];
 
+    const fee = modInfo && modInfo.get('fee');
+    const fixedFee = fee && fee.get('fixedFee');
+    this.fixedFeeCur = fixedFee && fixedFee.get('currencyCode');
+
     this.modLanguages = [];
     if (this.model.isModerator) {
       this.modLanguages = this.model.get('moderatorInfo')
@@ -86,7 +91,10 @@ export default class extends BaseVw {
   }
 
   get hasValidCurrency() {
-    return anySupportedByWallet(this.modCurs);
+    const isFeeFiat = this.fixedFeeCur && isFiatCur(this.fixedFeeCur);
+    const isFeeCrypto = this.fixedFeeCur && anySupportedByWallet([this.fixedFeeCur]);
+    const validFeeCur = isFeeFiat || isFeeCrypto;
+    return validFeeCur && anySupportedByWallet(this.modCurs);
   }
 
   get hasPreferredCur() {
@@ -125,8 +133,10 @@ export default class extends BaseVw {
 
     loadTemplate('components/moderators/card.html', (t) => {
       this.$el.html(t({
+        valid: !!this.model.isValid(),
+        modelErrors: this.model.validationError,
         displayCurrency: app.settings.get('localCurrency'),
-        valid: this.model.isModerator,
+        isMod: this.model.isModerator,
         hasValidCurrency: this.hasValidCurrency,
         radioStyle: this.options.radioStyle,
         controlsOnInvalid: this.options.controlsOnInvalid,

js/views/components/moderators/Moderators.js

@@ -146,15 +146,15 @@ export default class extends baseVw {
   processMod(data) {
     // Don't add profiles that are not moderators unless showInvalid is true. The ID list may have
     // peerIDs that are out of date, and are no longer moderators.
-    const validMod = data.moderator && data.moderatorInfo;
+    const isAMod = data.moderator && data.moderatorInfo;
     // If the moderator has an invalid currency, remove them from the list.
     // With multi-wallet, this should be a very rare occurrence.
     const modCurs = data.moderatorInfo && data.moderatorInfo.acceptedCurrencies || [];
-    const validCur = anySupportedByWallet(modCurs);
+    const hasSupportedCur = anySupportedByWallet(modCurs);
+    const newMod = new Moderator(data, { parse: true });
 
-    if ((!!validMod && validCur || this.options.showInvalid)) {
-      const newMod = new Moderator(data, { parse: true });
-      if (newMod.isValid()) this.moderatorsCol.add(newMod);
+    if ((!!isAMod && hasSupportedCur && newMod.isValid() || this.options.showInvalid)) {
+      this.moderatorsCol.add(newMod);
       this.removeNotFetched(data.peerID);
     } else {
       // remove the invalid moderator from the notFetched list