Allow special characters in auto_accounts by adding data-alias

apps/dashboard/app/javascript/dynamic_forms.js

@@ -28,6 +28,8 @@ const setValueLookup = {};
 const hideLookup = {};
 const labelLookup = {};
 
+const aliasLookup = {};
+
 // the regular expression for mountain casing
 const mcRex = /[-_]([a-z])|([_-][0-9])|([\/])/g;
 
@@ -130,8 +132,10 @@ function makeChangeHandlers(prefix){
           // the variable 'opt' is just a data structure, not a jQuery result. 
           // it has no attr, data, show or hide methods so we have to query
           // for it again
-          let data = $(`${optionSearch}[value='${opt.value}']`).data();
-          let keys = Object.keys(data);
+          let data = $(`${optionSearch}`).filter(function() {
+            return (this.value === opt.value);
+          }).data();
+          let keys = Object.keys(data).sort();
           if(keys.length !== 0) {
             keys.forEach((key) => {
               if(key.startsWith('optionFor')) {
@@ -148,7 +152,8 @@ function makeChangeHandlers(prefix){
                 addHideHandler(element['id'], opt.value, key, data[key]);
               } else if(key.startsWith('label')) {
                 addLabelHandler(element['id'], opt.value, key, data[key]);
-              }
+              } else if(key.startsWith('alias'))
+                cacheAliases(element['id']);
             });
           }
       });
@@ -167,7 +172,6 @@ function makeChangeHandlers(prefix){
       }
     }
   });
-
   initializing = false;
 };
 
@@ -728,6 +732,24 @@ function idFromToken(str) {
   }
 }
 
+function cacheAliases(elementId) {
+  // This should only run once on each select with an alias defined
+  if (!Object.keys(aliasLookup).includes(elementId)) {
+    aliasLookup[elementId] = {};
+    const options = [...document.querySelectorAll(`#${elementId} option`)];
+    options.forEach(option => {
+      const data = option.dataset;
+      Object.keys(data).forEach(key => {
+        if (key.startsWith('alias')){
+          const alias = key.replace(/^alias/, '');
+          const value = data[key]
+          aliasLookup[elementId][value] = alias;
+        }
+      })
+    })
+  }
+}
+
 /**
  * Extract the option for out of an option for directive.
  *
@@ -780,22 +802,33 @@ function sharedToggleOptionsFor(_event, elementId, contextStr) {
 
       // it's some other directive type, so just keep going and/or not real
       if(!key.startsWith(contextStr) || optionForId === undefined) {
-        continue;
+        continue
       }
+      const value = document.getElementById(optionForId).value;
+      let optionForValue = mountainCaseWords(value);
 
-      let optionForValue = mountainCaseWords(document.getElementById(optionForId).value);
+      let optionForAlias = '';
+      if ((elementId in aliasLookup) && (value in aliasLookup[elementId])) {
+        optionForAlias = aliasLookup[elementId][value]
+      }
       // handle special case where the very first token here is a number.
       // browsers expect a prefix of hyphens as if it's the next token.
       if (optionForValue.match(/^\d/)) {
         optionForValue = `-${optionForValue}`;
       }
-
       if (contextStr == 'optionFor') {
-        hide = option.dataset[`optionFor${optionFor}${optionForValue}`] === 'false';
+        let key = `optionFor${optionFor}${optionForValue}`
+        if (!(key in option.dataset)) {
+          key = `optionFor${optionFor}${optionForAlias}`
+        }
+        hide = option.dataset[key] === 'false';
       } else if (contextStr == 'exclusiveOptionFor') {
-        hide = !(option.dataset[`exclusiveOptionFor${optionFor}${optionForValue}`] === 'true')
+        let key = `exclusiveOptionFor${optionFor}${optionForValue}`
+        if (!(key in option.dataset)){
+          key = `exclusiveOptionFor${optionFor}${optionForAlias}`
+        }
+        hide = !(option.dataset[key] === 'true')
       }
-
       if (hide) {
         break;
       }
@@ -856,7 +889,6 @@ function sharedToggleOptionsFor(_event, elementId, contextStr) {
 
 // get attributes based on widget id
 function getWidgetInfo(id){
-  console.log(id)
   const type = getWidgetType(id)
   const label = $(`label[for="${id}"]`);
   const labelText = label.length ? label.text().trim() : null;

apps/dashboard/app/lib/account_cache.rb

@@ -113,12 +113,9 @@ def dynamic_qos
 
         available_accounts = account_tuples.map { |tuple| tuple[0] }.uniq
         unavailable_accounts = account_names.reject { |c| available_accounts.include?(c) }
+        account_data = disabled_account_data(unavailable_accounts)
 
-        unavailable_accounts.each do |account|
-          data["data-option-for-auto-accounts-#{account}"] = false
-        end
-
-        [qos, qos, data]
+        [qos, qos, data.merge(account_data)]
       end
     end
   end
@@ -155,9 +152,10 @@ def queues_per_cluster
   end
 
   def queue_account_data(queue)
-    account_names.map do |account|
-      ["data-option-for-auto-accounts-#{account}", false] unless account_allowed?(queue, account)
-    end.compact.to_h
+    unavailable_accounts = account_names.reject do |account| 
+      account_allowed?(queue, account)
+    end
+    disabled_account_data(unavailable_accounts)
   end
 
   def account_allowed?(queue, account_name)
@@ -169,4 +167,21 @@ def account_allowed?(queue, account_name)
       queue.allow_accounts.any? { |account| account == account_name }
     end
   end
+
+  def disabled_account_data(disabled_accounts)
+    counter = 0
+    disabled_accounts.map do |account|
+      counter += 1
+      # check if account contains anything other than digits and lowercase letters
+      if !!(account =~ /\A[a-z0-9]+\z/)
+        [["data-option-for-auto-accounts-#{account}", false]] 
+      else
+        acct_alias = "account#{counter}"
+        [
+          ["data-alias-#{acct_alias}", account],
+          ["data-option-for-auto-accounts-#{acct_alias}", false]
+        ]
+      end
+    end.flatten(1).compact.to_h
+  end
 end

apps/dashboard/app/views/launchers/editable_form_fields/_editable_select.html.erb

@@ -13,14 +13,16 @@
     <%= render(partial: 'launchers/editable_form_fields/edit_fixed_field',  locals: { form: form, attrib: attrib, fixed: fixed }) %>
 
     <ol class="list-group text-center col-md-4 mb-3">
+      <%- counter = 0 -%>
       <%- attrib.select_choices(hide_excludable: false).each do |select_data| %>
         <%- 
+          counter += 1
           choice = parse_select_data(select_data)
           disabled = attrib.exclude_select_choices.include?(choice)
           last_option = attrib.exclude_select_choices.length + 1 == attrib.select_choices(hide_excludable: false).length
           li_classes = disabled ? 'list-group-item list-group-item-danger text-strike' : 'list-group-item'
-          add_id = "#{field_id}_add_#{choice}"
-          remove_id = "#{field_id}_remove_#{choice}"
+          add_id = "#{field_id}_add_option#{counter}"
+          remove_id = "#{field_id}_remove_option#{counter}"
         -%>
 
         <li class="<%= li_classes %>">

apps/dashboard/test/fixtures/cmd_output/sacctmgr_show_accts.txt

@@ -20,3 +20,6 @@ pzs0714|oakley||oakley-default
 pde0006|oakley||oakley-default
 pas2051|oakley||oakley-default
 pas1871|oakley||oakley-default
+p_s1.71|oakley||oakley-default
+p-s1.71|oakley||oakley-default
+p.s1.71|oakley||oakley-default