FEATURE: User fields required for existing users - Part 2 (#27172)

We want to allow admins to make new required fields apply to existing users. In order for this to work we need to have a way to make those users fill up the fields on their next page load. This is very similar to how adding a 2FA requirement post-fact works. Users will be redirected to a page where they can fill up the remaining required fields, and until they do that they won't be able to do anything else.

app/assets/javascripts/admin/addon/components/admin-user-field-item.hbs

@@ -34,17 +34,36 @@
       <label class="optional">
         <RadioButton
           @value="optional"
-          @name="optional"
+          @name="requirement"
           @selection={{this.buffered.requirement}}
+          @onChange={{action "changeRequirementType"}}
         />
         <span>{{i18n "admin.user_fields.requirement.optional.title"}}</span>
       </label>
 
+      <label class="for_all_users">
+        <RadioButton
+          @value="for_all_users"
+          @name="requirement"
+          @selection={{this.buffered.requirement}}
+          @onChange={{action "changeRequirementType"}}
+        />
+        <div class="label-text">
+          <span>{{i18n
+              "admin.user_fields.requirement.for_all_users.title"
+            }}</span>
+          <div class="description">{{i18n
+              "admin.user_fields.requirement.for_all_users.description"
+            }}</div>
+        </div>
+      </label>
+
       <label class="on_signup">
         <RadioButton
           @value="on_signup"
-          @name="on_signup"
+          @name="requirement"
           @selection={{this.buffered.requirement}}
+          @onChange={{action "changeRequirementType"}}
         />
         <div class="label-text">
           <span>{{i18n "admin.user_fields.requirement.on_signup.title"}}</span>
@@ -57,7 +76,11 @@
 
     <AdminFormRow @label="admin.user_fields.preferences">
       <label>
-        <Input @type="checkbox" @checked={{this.buffered.editable}} />
+        <Input
+          @type="checkbox"
+          @checked={{this.buffered.editable}}
+          disabled={{this.editableDisabled}}
+        />
         <span>{{i18n "admin.user_fields.editable.title"}}</span>
       </label>
 

app/assets/javascripts/admin/addon/components/admin-user-field-item.js

@@ -3,6 +3,7 @@ import { action } from "@ember/object";
 import { schedule } from "@ember/runloop";
 import { service } from "@ember/service";
 import { isEmpty } from "@ember/utils";
+import { Promise } from "rsvp";
 import { popupAjaxError } from "discourse/lib/ajax-error";
 import { i18n, propertyEqual } from "discourse/lib/computed";
 import { bufferedProperty } from "discourse/mixins/buffered-content";
@@ -12,6 +13,7 @@ import UserField from "admin/models/user-field";
 
 export default Component.extend(bufferedProperty("userField"), {
   adminCustomUserFields: service(),
+  dialog: service(),
 
   tagName: "",
   isEditing: false,
@@ -64,8 +66,29 @@ export default Component.extend(bufferedProperty("userField"), {
     return ret.join(", ");
   },
 
+  @discourseComputed("buffered.requirement")
+  editableDisabled(requirement) {
+    return requirement === "for_all_users";
+  },
+
   @action
-  save() {
+  changeRequirementType(requirement) {
+    this.buffered.set("requirement", requirement);
+    this.buffered.set("editable", requirement === "for_all_users");
+  },
+
+  async _confirmChanges() {
+    return new Promise((resolve) => {
+      this.dialog.yesNoConfirm({
+        message: I18n.t("admin.user_fields.requirement.confirmation"),
+        didCancel: () => resolve(false),
+        didConfirm: () => resolve(true),
+      });
+    });
+  },
+
+  @action
+  async save() {
     const attrs = this.buffered.getProperties(
       "name",
       "description",
@@ -79,6 +102,16 @@ export default Component.extend(bufferedProperty("userField"), {
       ...this.adminCustomUserFields.additionalProperties
     );
 
+    let confirm = true;
+
+    if (attrs.requirement === "for_all_users") {
+      confirm = await this._confirmChanges();
+    }
+
+    if (!confirm) {
+      return;
+    }
+
     return this.userField
       .save(attrs)
       .then(() => {