FEATURE: New "Dropdown" user field type

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

@@ -10,6 +10,10 @@ export default Ember.Component.extend(bufferedProperty('userField'), {
     return I18n.t('admin.user_fields.description');
   }.property(),
 
+  bufferedFieldType: function() {
+    return UserField.fieldTypeById(this.get('buffered.field_type'));
+  }.property('buffered.field_type'),
+
   _focusOnEdit: function() {
     if (this.get('editing')) {
       Ember.run.scheduleOnce('afterRender', this, '_focusName');
@@ -42,7 +46,14 @@ export default Ember.Component.extend(bufferedProperty('userField'), {
   actions: {
     save() {
       const self = this;
-      const attrs = this.get('buffered').getProperties('name', 'description', 'field_type', 'editable', 'required', 'show_on_profile');
+      const buffered = this.get('buffered');
+      const attrs = buffered.getProperties('name',
+                                           'description',
+                                           'field_type',
+                                           'editable',
+                                           'required',
+                                           'show_on_profile',
+                                           'options');
 
       this.get('userField').save(attrs).then(function(res) {
         self.set('userField.id', res.user_field.id);

app/assets/javascripts/admin/components/value-list.js.es6

@@ -3,11 +3,19 @@ export default Ember.Component.extend({
 
   _setupCollection: function() {
     const values = this.get('values');
-    this.set('collection', (values && values.length) ? values.split("\n") : []);
+    if (this.get('inputType') === "array") {
+      this.set('collection', values || []);
+    } else {
+      this.set('collection', (values && values.length) ? values.split("\n") : []);
+    }
   }.on('init').observes('values'),
 
   _collectionChanged: function() {
-    this.set('values', this.get('collection').join("\n"));
+    if (this.get('inputType') === "array") {
+      this.set('values', this.get('collection'));
+    } else {
+      this.set('values', this.get('collection').join("\n"));
+    }
   }.observes('collection.@each'),
 
   inputInvalid: Ember.computed.empty('newValue'),

app/assets/javascripts/admin/models/user-field.js.es6

@@ -1,8 +1,9 @@
-var UserField = Ember.Object.extend({
-  destroy: function() {
-    var self = this;
+const UserField = Ember.Object.extend({
+
+  destroy() {
+    const self = this;
     return new Ember.RSVP.Promise(function(resolve) {
-      var id = self.get('id');
+      const id = self.get('id');
       if (id) {
         return Discourse.ajax("/admin/customize/user_fields/" + id, { type: 'DELETE' }).then(function() {
           resolve();
@@ -12,8 +13,8 @@ var UserField = Ember.Object.extend({
     });
   },
 
-  save: function(attrs) {
-    var id = this.get('id');
+  save(attrs) {
+    const id = this.get('id');
     if (!id) {
       return Discourse.ajax("/admin/customize/user_fields", {
         type: "POST",
@@ -28,8 +29,12 @@ var UserField = Ember.Object.extend({
   }
 });
 
+const UserFieldType = Ember.Object.extend({
+  name: Discourse.computed.i18n('id', 'admin.user_fields.field_types.%@')
+});
+
 UserField.reopenClass({
-  findAll: function() {
+  findAll() {
     return Discourse.ajax("/admin/customize/user_fields").then(function(result) {
       return result.user_fields.map(function(uf) {
         return UserField.create(uf);
@@ -37,18 +42,19 @@ UserField.reopenClass({
     });
   },
 
-  fieldTypes: function() {
+  fieldTypes() {
     if (!this._fieldTypes) {
       this._fieldTypes = [
-        Ember.Object.create({id: 'text', name: I18n.t('admin.user_fields.field_types.text') }),
-        Ember.Object.create({id: 'confirm', name: I18n.t('admin.user_fields.field_types.confirm') })
+        UserFieldType.create({ id: 'text' }),
+        UserFieldType.create({ id: 'confirm' }),
+        UserFieldType.create({ id: 'dropdown', hasOptions: true })
       ];
     }
 
     return this._fieldTypes;
   },
 
-  fieldTypeById: function(id) {
+  fieldTypeById(id) {
     return this.fieldTypes().findBy('id', id);
   }
 });

app/assets/javascripts/admin/templates/components/admin-form-row.hbs

@@ -1,11 +1,11 @@
-<div class='form-element-desc'>
+<div class='form-element label-area'>
   {{#if label}}
     <label>{{i18n label}}</label>
   {{else}}
     &nbsp;
   {{/if}}
 </div>
-<div class='form-element'>
+<div class='form-element input-area'>
   {{#if wrapLabel}}
     <label>{{yield}}</label>
   {{else}}

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

@@ -11,6 +11,12 @@
     {{input value=buffered.description class="user-field-desc"}}
   {{/admin-form-row}}
 
+  {{#if bufferedFieldType.hasOptions}}
+    {{#admin-form-row label="admin.user_fields.options"}}
+      {{value-list values=buffered.options inputType="array"}}
+    {{/admin-form-row}}
+  {{/if}}
+
   {{#admin-form-row wrapLabel="true"}}
     {{input type="checkbox" checked=buffered.editable}} {{i18n 'admin.user_fields.editable.title'}}
   {{/admin-form-row}}