Add support for user_fields

assets/javascripts/discourse/components/wizard-custom-input.js.es6

@@ -1,19 +1,36 @@
+import { default as computed, on, observes } from 'ember-addons/ember-computed-decorators';
+import { getOwner } from 'discourse-common/lib/get-owner';
+
+const fieldNotPresent = (f) => { return f == null || f === undefined };
+
 export default Ember.Component.extend({
+  classNames: 'custom-input',
   noneKey: 'admin.wizard.select_field',
   noneValue: 'admin.wizard.none',
   inputKey: 'admin.wizard.key',
   inputValue: 'admin.wizard.value',
+  customDisabled: Ember.computed.alias('input.user_field'),
 
-  actions: {
-    add() {
-      if (!this.get('inputs')) {
-        this.set('inputs', Ember.A());
-      }
-      this.get('inputs').pushObject(Ember.Object.create());
-    },
+  @computed('input.value_custom', 'input.user_field')
+  valueDisabled(custom, user) {
+    return Boolean(custom || user);
+  },
 
-    remove(input) {
-      this.get('inputs').removeObject(input);
+  @on('init')
+  setupUserFields() {
+    const allowUserField = this.get('allowUserField');
+    if (allowUserField) {
+      const store = getOwner(this).lookup('store:main');
+      store.findAll('user-field').then((result) => {
+        if (result && result.content && result.content.length) {
+          this.set('userFields', result.content.map((f) => {
+            return {
+              id: `user_field_${f.id}`,
+              name: f.name
+            }
+          }));
+        }
+      });
     }
   }
 });

assets/javascripts/discourse/components/wizard-custom-inputs.js.es6

@@ -0,0 +1,14 @@
+export default Ember.Component.extend({
+  actions: {
+    add() {
+      if (!this.get('inputs')) {
+        this.set('inputs', Ember.A());
+      }
+      this.get('inputs').pushObject(Ember.Object.create());
+    },
+
+    remove(input) {
+      this.get('inputs').removeObject(input);
+    }
+  }
+});

assets/javascripts/discourse/templates/components/wizard-custom-action.hbs

@@ -104,11 +104,11 @@
 
   <div class="setting full">
     <label>{{i18n 'admin.wizard.action.add_fields' type='Topic'}}</label>
-    {{wizard-custom-input inputs=action.add_fields
-                          valueContent=availableFields
-                          inputKey='admin.wizard.action.topic_attr'
-                          noneValue='admin.wizard.select_field'
-                          optionalCustom=true}}
+    {{wizard-custom-inputs inputs=action.add_fields
+                           valueContent=availableFields
+                           inputKey='admin.wizard.action.topic_attr'
+                           noneValue='admin.wizard.select_field'
+                           allowCustomField=true}}
   </div>
 {{/if}}
 
@@ -167,20 +167,20 @@
 
   <div class="setting full">
     <label>{{i18n "admin.wizard.action.add_fields" type='Message'}}</label>
-    {{wizard-custom-input inputs=action.add_fields
-                          keyContent=availableFields
-                          inputValue='admin.wizard.action.topic_attr'}}
+    {{wizard-custom-inputs inputs=action.add_fields
+                           keyContent=availableFields
+                           valuePlaceholder='admin.wizard.action.topic_attr'}}
   </div>
 {{/if}}
 
 {{#if updateProfile}}
   <div class="setting full">
     <label>{{i18n "admin.wizard.action.add_fields" type='Profile'}}</label>
-    {{wizard-custom-input inputs=action.profile_updates
-                          valueContent=profileFields
-                          keyContent=availableFields
-                          noneValue='admin.wizard.action.update_profile.profile_field'
-                          optionalCustom=true
-                          inputValue='admin.wizard.action.update_profile.custom_field'}}      
+    {{wizard-custom-inputs inputs=action.profile_updates
+                           valueContent=profileFields
+                           keyContent=availableFields
+                           noneValue='admin.wizard.action.update_profile.profile_field'
+                           allowCustomField=true
+                           allowUserField=true}}
   </div>
 {{/if}}

assets/javascripts/discourse/templates/components/wizard-custom-field.hbs

@@ -96,14 +96,14 @@
       <div class="wizard-header small">
         {{i18n 'admin.wizard.field.choices_preset.filter'}}
       </div>
-      {{wizard-custom-input inputs=field.choices_filters}}
+      {{wizard-custom-inputs inputs=field.choices_filters}}
     {{/if}}
 
     {{#if choicesCustom}}
       <div class="wizard-header small">
         {{i18n 'admin.wizard.field.choices_custom'}}
       </div>
-      {{wizard-custom-input inputs=field.choices}}
+      {{wizard-custom-inputs inputs=field.choices}}
     {{/if}}
 
     <div class="wizard-header small">

assets/javascripts/discourse/templates/components/wizard-custom-input.hbs

@@ -1,25 +1,44 @@
-{{#each inputs as |in|}}
-  <div class='custom-input'>
-    {{#if keyContent}}
-      {{combo-box value=in.key content=keyContent nameProperty="label" none=noneKey}}
-    {{else}}
-      {{input type="text" value=in.key placeholder=(i18n inputKey)}}
-    {{/if}}
-    {{#if valueContent}}
-      {{combo-box value=in.value
-                  content=valueContent
-                  nameProperty="label"
-                  none=noneValue
-                  isDisabled=(if in.value_custom true false)}}
-      {{#if optionalCustom}}
-        {{input type="text" value=in.value_custom placeholder=(i18n inputValue)}}
-      {{/if}}
-    {{else}}
-      {{input type="text" value=in.value placeholder=(i18n inputValue)}}
-    {{/if}}
-    {{d-button action='remove' actionParam=in icon='times'}}
-  </div>
-{{/each}}
-<div class="add-custom-input">
-  {{d-button action='add' label='admin.wizard.add' icon='plus'}}
+<div class="key">
+  {{#if keyContent}}
+    {{combo-box value=input.key content=keyContent nameProperty="label" none=noneKey}}
+  {{else}}
+    {{input type="text" value=input.key placeholder=(i18n inputKey)}}
+  {{/if}}
 </div>
+
+{{d-icon 'arrow-right'}}
+
+<div class="value">
+  {{#if valueContent}}
+    {{combo-box value=input.value
+                content=valueContent
+                nameProperty="label"
+                none=noneValue
+                isDisabled=valueDisabled}}
+  {{else}}
+    {{input type="text" value=input.value placeholder=(i18n valuePlaceholder)}}
+  {{/if}}
+
+  {{#if allowCustomField}}
+    <div class="text-divider">
+      <span>{{i18n 'admin.wizard.or'}}</span>
+    </div>
+
+    {{input type="text"
+            value=input.value_custom
+            placeholder=(i18n 'admin.wizard.custom_field_placeholder')
+            disabled=customDisabled}}
+  {{/if}}
+
+  {{#if allowUserField}}
+    <div class="text-divider">
+      <span>{{i18n 'admin.wizard.or'}}</span>
+    </div>
+
+    {{combo-box value=input.user_field
+                content=userFields
+                none='admin.wizard.user_field_placeholder'}}
+  {{/if}}
+</div>
+
+{{d-button action=remove actionParam=input icon='times' class='remove'}}

assets/javascripts/discourse/templates/components/wizard-custom-inputs.hbs

@@ -0,0 +1,13 @@
+{{#each inputs as |input|}}
+  {{wizard-custom-input input=input
+                        valueContent=valueContent
+                        keyContent=keyContent
+                        noneValue=noneValue
+                        valuePlaceholder=valuePlaceholder
+                        allowCustomField=allowCustomField
+                        allowUserField=allowUserField
+                        remove=(action 'remove')}}
+{{/each}}
+<div class="add-custom-input">
+  {{d-button action='add' label='admin.wizard.add' icon='plus'}}
+</div>

assets/javascripts/wizard/initializers/custom.js.es6

@@ -66,13 +66,7 @@ export default {
       bannerImage: function() {
         const src = this.get('step.banner');
         if (!src) return;
-
-        const localPaths = ['uploads', 'plugins', 'images'];
-        if (localPaths.indexOf(src.split('/')[1]) > -1) {
-          return getUrl(src);
-        } else {
-          return getUrl(`/images/wizard/${src}`);
-        };
+        return getUrl(src);
       }.property('step.banner'),
 
       handleMessage: function() {
@@ -114,7 +108,13 @@ export default {
       save() {
         const wizardId = this.get('wizardId');
         const fields = {};
-        this.get('fields').forEach(f => fields[f.id] = f.value);
+
+        this.get('fields').forEach(f => {
+          if (f.type !== 'text-only') {
+            fields[f.id] = f.value;
+          }
+        });
+
         return ajax({
           url: `/w/${wizardId}/steps/${this.get('id')}`,
           type: 'PUT',

assets/stylesheets/wizard_custom_admin.scss

@@ -44,7 +44,7 @@
     width: 49%;
 
     .setting-label {
-      width: 90px;
+      width: 20%;
     }
 
     .setting-value {
@@ -77,6 +77,10 @@
     &.full {
       width: 100%;
 
+      .setting-label {
+        width: 10%;
+      }
+
       .setting-value {
         width: initial;
         overflow: hidden;
@@ -164,15 +168,26 @@
 }
 
 .custom-input {
+  display: flex;
   margin: 5px 0;
 
-  > * {
-    margin-bottom: 0 !important;
-    margin-right: 5px;
+  .d-icon {
+    margin: 0 auto;
+    text-align: center;
+  }
+
+  input[disabled] {
+    background-color: $primary-low;
+    border-color: #ddd;
   }
 
-  .select-box-kit {
-    width: 150px !important;
+  .select-kit {
+    width: 232px !important;
+  }
+
+  .remove {
+    margin: 0 auto;
+    align-self: flex-start;
   }
 }
 
@@ -249,3 +264,36 @@
 .post-builder-editor {
   min-height: 220px;
 }
+
+.text-divider {
+  display: block;
+  text-align: center;
+  overflow: hidden;
+  white-space: nowrap;
+  margin: 5px 0;
+
+  > span {
+    position: relative;
+    display: inline-block;
+  }
+
+  > span:before,
+  > span:after {
+    content: "";
+    position: absolute;
+    top: 50%;
+    width: 9999px;
+    height: 1px;
+    background: $tertiary;
+  }
+
+  > span:before {
+    right: 100%;
+    margin-right: 15px;
+  }
+
+  > span:after {
+    left: 100%;
+    margin-left: 15px;
+  }
+}

config/locales/client.en.yml

@@ -2,6 +2,7 @@ en:
   js:
     wizard:
       complete_custom: "Welcome to %{site_name}! Get started with <a href='%{wizard_url}' data-auto-route='true'>the %{wizard_name} wizard</a> ✨"
+
   admin_js:
     admin:
       wizard:
@@ -42,11 +43,14 @@ en:
         add: "Add"
         url: "Url"
         key: "Key"
+        or: "Or"
         value: "Value"
         id: "Id"
         id_placeholder: "Underscored. Cannot be changed."
         key_placeholder: "Translation key"
         custom_text_placeholder: "Overrides translation"
+        custom_field_placeholder: "Custom Field"
+        user_field_placeholder: "User Field"
         type: "Type"
         none: "Make a selection"
         select_field: "Select Field"
@@ -107,7 +111,6 @@ en:
           update_profile:
             label: "Update Profile"
             profile_field: "Profile Field"
-            custom_field: "User Custom Field"
           post_builder:
             checkbox: "Post Builder"
             label: "Builder"
@@ -130,7 +133,10 @@ en:
         desc: "e.g. 42 Wallaby Way"
       postalcode:
         title: "Postal Code (Zip)"
-        desc: "e.g. 2548"
+        desc: "e.g. 2090"
+      neighbourhood:
+        title: "Neighbourhood"
+        desc: "e.g. Cremorne Point"
       city:
         title: "City, Town or Village"
         desc: "e.g. Sydney"
@@ -148,6 +154,7 @@ en:
         no_results: "No results. Please double check the spelling."
         show_map: "Show Map"
       validation:
+        neighbourhood: "Please enter a neighbourhood."
         city: "Please enter a city, town or village."
         countrycode: "Please select a country."
         geo_location: "Search and select a result."

lib/builder.rb

@@ -96,14 +96,13 @@ class CustomWizard::Builder
               PluginStore.remove("#{@wizard.id}_submissions", @wizard.user.id)
             end
 
-            if @wizard.after_time && final_step
+            if final_step && @wizard.id === @wizard.user.custom_fields['redirect_to_wizard']
               @wizard.user.custom_fields.delete('redirect_to_wizard');
               @wizard.user.save_custom_fields(true)
             end
 
             if updater.errors.empty?
-              user_redirect = user.custom_fields['redirect_to_wizard']
-              redirect_to = user_redirect ? "/w/#{user_redirect}" : data['redirect_to']
+              redirect_to = data['redirect_to']
               updater.result = { redirect_to: redirect_to } if redirect_to
             end
           end
@@ -155,9 +154,10 @@ class CustomWizard::Builder
   def prefill_profile_field(update)
     attribute = update['value']
     custom_field = update['value_custom']
+    user_field = update['user_field']
 
-    if custom_field
-      UserCustomField.where(user_id: @wizard.user.id, name: custom_field).pluck(:value)
+    if user_field || custom_field
+      UserCustomField.where(user_id: @wizard.user.id, name: user_field || custom_field).pluck(:value)
     elsif UserProfile.column_names.include? attribute
       UserProfile.find_by(user_id: @wizard.user.id).send(attribute)
     elsif User.column_names.include? attribute
@@ -336,10 +336,11 @@ class CustomWizard::Builder
     action['profile_updates'].each do |pu|
       value = pu['value']
       custom_field = pu['value_custom']
+      user_field = pu['user_field']
       key = pu['key']
 
-      if custom_field
-        custom_fields[custom_field] = data[key]
+      if user_field || custom_field
+        custom_fields[user_field || custom_field] = data[key]
       else
         attributes[value.to_sym] = data[key]
       end