feat: OPTIC-1242: Ask new OSS installs how they found about us (#6655)

Co-authored-by: yyassi-heartex <yyassi-heartex@users.noreply.github.com>
Co-authored-by: bmartel <brandonmartel@gmail.com>

label_studio/core/static/css/login.css

@@ -181,7 +181,8 @@ html, body {
   font-size: .875rem;
 }
 .login_page_new_ui form input,
-.login_page_new_ui form button {
+.login_page_new_ui form button,
+.login_page_new_ui form select {
   width: 100%;
   font-family: 'Hellix', sans-serif;
 }

label_studio/users/forms.py

@@ -17,6 +17,16 @@
 PASS_LENGTH_ERR = 'Please enter a password 8-12 characters in length'
 INVALID_USER_ERROR = "The email and password you entered don't match."
 
+FOUND_US_ELABORATE = 'Other'
+FOUND_US_OPTIONS = (
+    ('Gi', 'Github'),
+    ('Em', 'Email or newsletter'),
+    ('Se', 'Search engine'),
+    ('Fr', 'Friend or coworker'),
+    ('Ad', 'Ad'),
+    ('Ot', FOUND_US_ELABORATE),
+)
+
 logger = logging.getLogger(__name__)
 
 
@@ -57,6 +67,8 @@ class UserSignupForm(forms.Form):
         widget=forms.TextInput(attrs={'type': 'password'}),
     )
     allow_newsletters = forms.BooleanField(required=False)
+    how_find_us = forms.CharField(required=False)
+    elaborate = forms.CharField(required=False)
 
     def clean_password(self):
         password = self.cleaned_data['password']
@@ -85,8 +97,14 @@ def save(self):
         password = cleaned['password']
         email = cleaned['email'].lower()
         allow_newsletters = None
+        how_find_us = None
         if 'allow_newsletters' in cleaned:
             allow_newsletters = cleaned['allow_newsletters']
+        if 'how_find_us' in cleaned:
+            how_find_us = cleaned['how_find_us']
+        if 'elaborate' in cleaned and how_find_us == FOUND_US_ELABORATE:
+            cleaned['elaborate']
+
         user = User.objects.create_user(email, password, allow_newsletters=allow_newsletters)
         return user
 

label_studio/users/functions.py

@@ -74,7 +74,11 @@ def save_user(request, next_page, user_form):
         'allow_newsletters': user.allow_newsletters,
         'update-notifications': 1,
         'new-user': 1,
+        'how_find_us': user_form.cleaned_data.get('how_find_us', ''),
     }
+    if user_form.cleaned_data.get('how_find_us', '') == 'Other':
+        request.advanced_json['elaborate'] = user_form.cleaned_data.get('elaborate', '')
+
     redirect_url = next_page if next_page else reverse('projects:project-index')
     login(request, user, backend='django.contrib.auth.backends.ModelBackend')
     return redirect(redirect_url)

label_studio/users/templates/users/new-ui/user_signup.html

@@ -11,7 +11,7 @@ <h2>Sign Up</h2>
     {% csrf_token %}
       <div class="input-wrapper">
         <label>Email Address</label>
-        <input type="text" class="lsf-input-ls" name="email" id="email" value="{{ form.data.email }}">
+        <input type="text" class="lsf-input-ls" name="email" id="email" value="{{ user_form.data.email }}">
         {% if user_form.errors.email %}
           <ul class="field_errors">
             {% for error in user_form.errors.email %}
@@ -31,10 +31,24 @@ <h2>Sign Up</h2>
           </ul>
         {% endif %}
       </div>
+      <div class="input-wrapper">
+        <label>How did you hear about Label Studio?</label>
+        <select class="lsf-select-ls" name="how_find_us" id="how_find_us">
+          <option disabled value="" {% if not form.data.how_find_us %}selected{% endif %}>Select an option</option>
+          {% for choice in found_us_options %}
+            <option value="{{ choice.1 }}" {% if choice.1 == user_form.data.how_find_us %}selected{% endif %}>{{ choice.1 }}</option>
+          {% endfor %}
+        </select>
+      </div>
+      <div class="input-wrapper" id="elaborateContainer" {% if user_form.data.how_find_us != elaborate %}style="display:none;"{% endif %}> 
+        <label>Please elaborate</label>
+        <input class="lsf-input-ls" name="elaborate" id="elaborate" {% if user_form.data.how_find_us == elaborate %}value="{{ user_form.data.elaborate }}"{% endif %}>
+        </select>
+      </div>
       <div class="form-group">
-        <input name="allow_newsletters" id="allow_newsletters" type="hidden" value="true">
+        <input name="allow_newsletters" id="allow_newsletters" type="hidden" value="{% if user_form.data.allow_newsletters == 'false' %}false{% else %}true{% endif %}">
         <input name="allow_newsletters_visual" id="allow_newsletters_visual" class="lsf-checkbox-ls"
-                type="checkbox" style="width: auto" checked="true"
+                type="checkbox" style="width: auto" {% if user_form.data.allow_newsletters == 'false' %}{% else %}checked="checked{% endif %}"
                 onchange="document.getElementById('allow_newsletters').value=document.getElementById('allow_newsletters_visual').checked">
         <label for="allow_newsletters_visual" style="display: inline-block; cursor: pointer;">
           Get the latest news from Heidi
@@ -57,5 +71,10 @@ <h2>Sign Up</h2>
     <p class="">Already have an account?</p>
     <a href="{{ settings.HOSTNAME }}/user/login">Log in</a>
   </div>
-
+  <script>
+    document.querySelector("#how_find_us").addEventListener('change', function(e) {
+      const isOther = e.target.value == '{{ elaborate }}';
+      document.querySelector("#elaborateContainer").style.display = isOther ? 'block' : 'none';
+    });
+  </script>
 {% endblock %}

label_studio/users/views.py

@@ -75,6 +75,8 @@ def user_signup(request):
                 'organization_form': organization_form,
                 'next': next_page,
                 'token': token,
+                'found_us_options': forms.FOUND_US_OPTIONS,
+                'elaborate': forms.FOUND_US_ELABORATE,
             },
         )