clear qualifier on subscription type change

Author: Oaphi

app/assets/javascripts/subscriptions.js

@@ -1,6 +1,18 @@
 document.addEventListener('DOMContentLoaded', () => {
+  const clearQualifier = () => {
+    const qualifierField = document.querySelector('.js-subscription-qualifier-field');
+
+    if (qualifierField instanceof HTMLInputElement) {
+      qualifierField.value = '';
+    }
+  };
+
   document.querySelectorAll('.js-subscription-type-select, .js-subscription-frequency-select').forEach((el) => {
-    $(el).select2();
+    $(el).select2().on('change', ($event) => {
+      if ($event.target.matches('.js-subscription-type-select')) {
+        clearQualifier();
+      }
+    });
   });
 
   $('.js-enable-subscription').on('change', async (evt) => {

app/views/subscriptions/new.html.erb

@@ -21,7 +21,9 @@
     <%= f.label :qualifier, class: "form-element" %>
     <div class="form-caption">Should be an id for user subscriptions or name for tag & category subscriptions.
       Leave the field blank otherwise.</div>
-    <%= f.text_field :qualifier, class: 'form-element', value: @subscription.qualifier %>
+    <%= f.text_field :qualifier,
+                     class: 'form-element js-subscription-qualifier-field',
+                     value: @subscription.qualifier %>
   </div>
 
   <div class="form-group">