[Signup fields III] Profile form

app/controllers/carto/api/user_presenter.rb

@@ -58,6 +58,8 @@ def to_poro
 
         if fetch_profile
           poro[:industry] = @user.industry
+          poro[:company_employees] = @user.company_employees
+          poro[:use_case] = @user.use_case
           poro[:company]  = @user.company
           poro[:phone]    = @user.phone
           poro[:job_role] = @user.job_role
@@ -124,6 +126,8 @@ def data(options = {})
           table_count: @user.table_count,
           viewer: @user.viewer?,
           industry: @user.industry,
+          company_employees: @user.company_employees,
+          use_case: @user.use_case,
           company: @user.company,
           phone: @user.phone,
           job_role: @user.job_role,

app/controllers/carto/api/users_controller.rb

@@ -14,10 +14,10 @@ class UsersController < ::Api::ApplicationController
       include AvatarHelper
       include Carto::ControllerHelper
 
-      UPDATE_ME_FIELDS = [
-        :name, :last_name, :website, :description, :location, :twitter_username,
-        :disqus_shortname, :available_for_hire, :company, :industry, :phone, :job_role
-      ].freeze
+      UPDATE_ME_FIELDS = %i(
+        name last_name website description location twitter_username disqus_shortname available_for_hire company
+        industry phone job_role company_employees use_case
+      ).freeze
 
       PASSWORD_DOES_NOT_MATCH_MESSAGE = 'Password does not match'.freeze
 

app/models/user/user_decorator.rb

@@ -131,6 +131,8 @@ def data(options = {})
         available_for_hire: available_for_hire,
         location: location,
         industry: industry,
+        company_employees: company_employees,
+        use_case: use_case,
         company: company,
         phone: phone,
         job_role: job_role

lib/assets/javascripts/dashboard/views/profile/profile-form/profile-form-view.js

@@ -20,12 +20,22 @@ const REQUIRED_OPTS = [
   'onError'
 ];
 
+// These lists must match the options of the correspondant Hubspot enumeration properties. They can be retrieved from:
+// https://api.hubapi.com/properties/v1/contacts/properties/named/industry?hapikey=KEY
 const INDUSTRIES = [
-  'Academic and Education', 'Architecture and Engineering', 'Banking and Finance',
-  'Business Intelligence and Analytics', 'Utilities and Communications', 'GIS and Mapping',
-  'Government', 'Health', 'Marketing and Advertising', 'Media, Entertainment and Publishing',
-  'Natural Resources', 'Non-Profits', 'Real Estate', 'Software and Technology',
-  'Transportation and Logistics'
+  'Apparel & Fashion', 'Banking & Financial Services', 'Business Services', 'Consulting Services',
+  'Consumer & Retail', 'Education & Research', 'Energy & Mining', 'Government', 'Health & Medical', 'Insurance',
+  'Manufacturing', 'Marketing & Advertising', 'Natural Resources & Environment', 'Non-Profit', 'Other', 'Real Estate',
+  'Software & Technology', 'Transportation & Logistics', 'Utilities & Communications'
+];
+
+const COMPANY_EMPLOYEES_RANGES = ['1-5','5-25','25-50','50-100','100-500','500-1000','1000+'];
+
+const USE_CASES = [
+  'Data Monetization', 'Fraud Detection', 'Geomarketing', 'Indoor Mapping', 'Investment Analysis',
+  'Logistics & Supply Chain Managment', 'Logistics Optimization', 'Mobility Planning',
+  'Network Deployment & Optimization', 'Other - My use case is not listed', 'Risk Analysis', 'Site Planning',
+  'Smart Cities & IOT', 'Territory Management'
 ];
 
 module.exports = CoreView.extend({
@@ -67,6 +77,8 @@ module.exports = CoreView.extend({
           company: this._userModel.get('company'),
           job_role: this._userModel.get('job_role'),
           industry: this._userModel.get('industry'),
+          company_employees: this._userModel.get('company_employees'),
+          use_case: this._userModel.get('use_case'),
           phone: this._userModel.get('phone'),
           website: this._userModel.get('website'),
           location: this._userModel.get('location'),
@@ -81,7 +93,9 @@ module.exports = CoreView.extend({
         organizationName: this._userModel.organization ? this._userModel.organization.get('name') : '',
         orgDisplayEmail: this._getOrgAdminEmail(),
         canChangeEmail: this._userModel.get('can_change_email'),
-        industries: INDUSTRIES
+        industries: INDUSTRIES,
+        company_employees_ranges: COMPANY_EMPLOYEES_RANGES,
+        use_cases: USE_CASES
       }));
 
       this._initViews();
@@ -126,6 +140,8 @@ module.exports = CoreView.extend({
       phone: this._userModel.get('phone') || '',
       job_role: this._userModel.get('job_role') || '',
       industry: this._userModel.get('industry') || '',
+      company_employees: this._userModel.get('company_employees') || '',
+      use_case: this._userModel.get('use_case') || '',
       website: this._userModel.get('website') || '',
       twitter_username: this._userModel.get('twitter_username') || '',
       disqus_shortname: this._userModel.get('disqus_shortname') || '',
@@ -145,6 +161,8 @@ module.exports = CoreView.extend({
       phone: utils.escapeHTML(this.$('#user_phone').val()),
       job_role: utils.escapeHTML(this.$('#user_job_role').val()),
       industry: utils.escapeHTML(this.$('#user_industry').val()),
+      company_employees: utils.escapeHTML(this.$('#user_company_employees').val()),
+      use_case: utils.escapeHTML(this.$('#user_use_case').val()),
       website: utils.escapeHTML(this.$('#user_website').val()),
       twitter_username: utils.escapeHTML(this.$('#user_twitter_username').val()),
       disqus_shortname: utils.escapeHTML(this.$('#user_disqus_shortname').val()),

lib/assets/javascripts/dashboard/views/profile/profile-form/profile-form.tpl

@@ -92,7 +92,6 @@
     </div>
   </div>
 
-
   <div class="FormAccount-row">
     <div class="FormAccount-rowLabel">
       <label class="CDB-Text CDB-Size-medium is-semibold u-mainTextColor"><%= _t('profile.views.form.industry') %></label>
@@ -112,6 +111,44 @@
     </div>
   </div>
 
+  <div class="FormAccount-row">
+    <div class="FormAccount-rowLabel">
+      <label class="CDB-Text CDB-Size-medium is-semibold u-mainTextColor"><%= _t('profile.views.form.company_employees') %></label>
+    </div>
+    <div class="FormAccount-rowData">
+      <select class="CDB-SelectFake CDB-Text FormAccount-input FormAccount-input--med is-cursor" id="user_company_employees" name="user[company_employees]">
+        <option value="">Select one</option>
+
+        <% company_employees_ranges.forEach(function (range) { %>
+          <option<% if (range === user.company_employees) { %> selected<% } %>><%= range %></option>
+        <% }); %>
+
+        <% if (!_.contains(company_employees_ranges, user.company_employees) && !_.isEmpty(user.company_employees)) { %>
+          <option selected><%= user.company_employees %></option>
+        <% } %>
+      </select>
+    </div>
+  </div>
+
+  <div class="FormAccount-row">
+    <div class="FormAccount-rowLabel">
+      <label class="CDB-Text CDB-Size-medium is-semibold u-mainTextColor"><%= _t('profile.views.form.use_case') %></label>
+    </div>
+    <div class="FormAccount-rowData">
+      <select class="CDB-SelectFake CDB-Text FormAccount-input FormAccount-input--med is-cursor" id="user_use_case" name="user[use_case]">
+        <option value="">Select one</option>
+
+        <% use_cases.forEach(function (use_case) { %>
+          <option<% if (use_case === user.use_case) { %> selected<% } %>><%= use_case %></option>
+        <% }); %>
+
+        <% if (!_.contains(use_cases, user.use_case) && !_.isEmpty(user.use_case)) { %>
+          <option selected><%= user.use_case %></option>
+        <% } %>
+      </select>
+    </div>
+  </div>
+
   <div class="FormAccount-row">
     <div class="FormAccount-rowLabel">
       <label class="CDB-Text CDB-Size-medium is-semibold u-mainTextColor"><%= _t('profile.views.form.phone') %></label>

lib/assets/javascripts/locale/en.json

@@ -99,6 +99,8 @@
         "company_name": "Company Name",
         "role": "Your Role",
         "industry": "Industry",
+        "company_employees": "Number of employees",
+        "use_case": "Use case",
         "phone": "Phone Number",
         "user_type": "User type",
         "viewer": "VIEWER",