Get value sorter type by fact itself when datatable_init

puppetboard/static/custom-natural/natural.js

@@ -0,0 +1,42 @@
+/**
+* Created by Allan Jardine on Feb 17, 2023.
+* Updated @ Feb 22, 2024
+* Modified for the Puppetboard by ArthurWuTW.
+*/
+
+/**
+ * Data can often be a complicated mix of numbers and letters (file names
+ * are a common example) and sorting them in a natural manner is quite a
+ * difficult problem.
+ *
+ * Fortunately the Javascript `localeCompare` method is now widely supported
+ * and provides a natural sorting method we can use with DataTables.
+ *
+ *  @name Natural sorting
+ *  @summary Sort data with a mix of numbers and letters _naturally_.
+ *
+ *  @example
+ *   // Natural sorting
+ *   new DataTable('#myTable',
+ *       columnDefs: [
+ *           { type: 'natural', target: 0 }
+ *       ]
+ *   } );
+ *
+ */
+
+
+jQuery.extend(jQuery.fn.dataTableExt.oSort,{
+
+    "natural-asc" : function (a, b) {
+        return a.localeCompare(b, navigator.languages[0] || navigator.language, {
+            numeric: true,
+            ignorePunctuation: true,
+        });
+    },
+
+    "natural-desc" : function (a, b) {
+        return (a.localeCompare(b, navigator.languages[0] || navigator.language, { numeric: true, ignorePunctuation: true }) *
+                -1);
+    }
+});

puppetboard/templates/_facts_sorter.html

@@ -0,0 +1,12 @@
+{% macro get_facts_sorter_type(fact) -%}
+
+  {% set sorter_map = {
+    'kernelrelease': 'natural',
+    'uptime': 'natural-time-delta'
+  } %}
+
+  {% set sorter = sorter_map.get(fact, None) %}
+  {% if sorter != None %}
+    "type": "{{ sorter }}",
+  {% endif %}
+{%- endmacro %}

puppetboard/templates/_macros.html

@@ -1,3 +1,4 @@
+{% import '_facts_sorter.html' as facts_sorter %}
 {% macro status_counts(caller, status, node_name, events, current_env, unreported_time=False, report_hash=False) -%}
   <a class="ui {{status}} label status" href="{{url_for('report', env=current_env, node_name=node_name, report_id=report_hash)}}">{{ status|upper }}</a>
   {% if status == 'unreported' %}
@@ -47,7 +48,7 @@
   {% endif %}
 {%- endmacro %}
 
-{% macro datatable_init(table_html_id, ajax_url, data, default_length, length_selector, extra_options=None, natural_time_delta_sort=False) -%}
+{% macro datatable_init(table_html_id, ajax_url, data, default_length, length_selector, extra_options=None, fact=None) -%}
 
   // Init datatable
   $.fn.dataTable.ext.errMode = 'throw';
@@ -114,9 +115,7 @@
 
         return `<a title="${data[1]}" href="${url}">${to_show}</a>`
       },
-      {% if natural_time_delta_sort %}
-      "type": "natural-time-delta",
-      {% endif %}
+      {{ facts_sorter.get_facts_sorter_type(fact) }}
     },
     {% else -%}
     {

puppetboard/templates/fact.html

@@ -2,6 +2,7 @@
 {% import '_macros.html' as macros %}
 {% block head %}
     <script src="{{ url_for('static', filename='custom-natural-time-delta/natural-time-delta.js') }}"></script>
+    <script src="{{ url_for('static', filename='custom-natural/natural.js') }}"></script>
 {% endblock head %}
 
 {% block onload_script %}
@@ -10,7 +11,7 @@
   'serverSide': false,
 {% endmacro %}
 
-{{ macros.datatable_init(table_html_id="facts_table", ajax_url=url_for('fact_ajax', env=current_env, fact=fact, value=value), data=None, default_length=config.NORMAL_TABLE_COUNT, length_selector=config.TABLE_COUNT_SELECTOR, extra_options=extra_options, natural_time_delta_sort=natural_time_delta_sort) }}
+{{ macros.datatable_init(table_html_id="facts_table", ajax_url=url_for('fact_ajax', env=current_env, fact=fact, value=value), data=None, default_length=config.NORMAL_TABLE_COUNT, length_selector=config.TABLE_COUNT_SELECTOR, extra_options=extra_options, fact=fact) }}
 
 {% if render_graph %}
 table.on('xhr', function(e, settings, json){

puppetboard/views/facts.py

@@ -216,16 +216,12 @@ def fact(env, fact, value):
             value_json = value_object
         else:
             value_json = dumps(value_object)
-    natural_time_delta_sort = False
-    if fact in ["uptime"]:
-        natural_time_delta_sort = True
     return render_template(
         'fact.html',
         fact=fact,
         value=value,
         value_json=value_json,
         render_graph=render_graph,
         envs=envs,
-        current_env=env,
-        natural_time_delta_sort=natural_time_delta_sort
+        current_env=env
     )