FIX: Improve UX for second factor enforcement. (#7207)

app/assets/javascripts/discourse/controllers/preferences/second-factor.js.es6

@@ -39,24 +39,9 @@ export default Ember.Controller.extend({
     return findAll().length > 0;
   },
 
-  @computed(
+  @computed("currentUser")
-    "siteSettings.enforce_second_factor",
+  showEnforcedNotice(user) {
-    "currentUser",
+    return user && user.get("enforcedSecondFactor");
-    "currentUser.second_factor_enabled",
-    "currentUser.staff"
-  )
-  showEnforcedNotice(
-    enforce_second_factor,
-    user,
-    second_factor_enabled,
-    staff
-  ) {
-    return (
-      user &&
-      !second_factor_enabled &&
-      (enforce_second_factor === "all" ||
-        (enforce_second_factor === "staff" && staff))
-    );
   },
 
   toggleSecondFactor(enable) {

app/assets/javascripts/discourse/models/user.js.es6

@@ -746,6 +746,15 @@ const User = RestModel.extend({
     } else {
       $.removeCookie("text_size", { path: "/", expires: 1 });
     }
+  },
+
+  @computed("second_factor_enabled", "staff")
+  enforcedSecondFactor(secondFactorEnabled, staff) {
+    const enforce = Discourse.SiteSettings.enforce_second_factor;
+    return (
+      !secondFactorEnabled &&
+      (enforce === "all" || (enforce === "staff" && staff))
+    );
   }
 });
 

app/assets/javascripts/discourse/templates/preferences-second-factor.hbs

@@ -38,7 +38,9 @@
               disabled=loading
               label=disableButtonText}}
 
+          {{#unless showEnforcedNotice}}
             {{cancel-link route="preferences.account" args= model.username}}
+          {{/unless}}
         </div>
       </div>
     {{else}}
@@ -86,7 +88,9 @@
                 disabled=loading
                 label=enableButtonText}}
 
+            {{#unless showEnforcedNotice}}
               {{cancel-link route="preferences.account" args= model.username}}
+            {{/unless}}
           </div>
         </div>
       {{else}}
@@ -122,7 +126,9 @@
 
             {{resetPasswordProgress}}
 
+            {{#unless showEnforcedNotice}}
               {{cancel-link route="preferences.account" args= model.username}}
+            {{/unless}}
           </div>
         </div>
       {{/if}}

app/assets/javascripts/discourse/widgets/header.js.es6

@@ -67,7 +67,10 @@ createWidget("header-notifications", {
 
     const unreadPMs = user.get("unread_private_messages");
     if (!!unreadPMs) {
-      if (!user.get("read_first_notification")) {
+      if (
+        !user.get("read_first_notification") &&
+        !user.get("enforcedSecondFactor")
+      ) {
         contents.push(h("span.ring"));
         if (!attrs.active && attrs.ringBackdrop) {
           contents.push(h("span.ring-backdrop-spotlight"));

app/serializers/current_user_serializer.rb

@@ -43,7 +43,8 @@ class CurrentUserSerializer < BasicUserSerializer
              :external_id,
              :top_category_ids,
              :hide_profile_and_presence,
-             :groups
+             :groups,
+             :second_factor_enabled
 
   def groups
     object.visible_groups.pluck(:id, :name).map { |id, name| { id: id, name: name.downcase } }
@@ -219,4 +220,8 @@ class CurrentUserSerializer < BasicUserSerializer
   def include_external_id?
     SiteSetting.enable_sso
   end
+
+  def second_factor_enabled
+    object.totp_enabled?
+  end
 end