The solution that you prposed didn't work for me. Here is my JS script that I am using : (I post it here too for people who may have the same problem) require.config({
paths: {
theme_utils: '../app/test-mitre/theme_utils',
jquery_local: '../app/test-mitre/lib/js/jquery-3.6.0.min'
}
});
require([
'underscore',
'jquery_local',
'splunkjs/mvc',
'splunkjs/mvc/tableview',
'theme_utils',
'splunkjs/mvc/simplexml/ready!'
], function(_, jquery, mvc, TableView, themeUtils) {
jQuery.noConflict(); // remove jquery conflicts for splunk js sdk
var $ = jQuery; // take dollar sign as a local variable
// Row Coloring Example with custom, client-side range interpretation
var isDarkTheme = themeUtils.getCurrentTheme && themeUtils.getCurrentTheme() === 'dark';
var CustomRangeRenderer = TableView.BaseCellRenderer.extend({
canRender: function(cell) {
return _(["Reconnaissance", "Resource Development", "Initial Access", "Execution", "Persistence", "Privilege Escalation", "Defense Evasion", "Credential Access", "Discovery", "Lateral Movement", "Collection", "Command and Control", "Exfiltration", "Impact"]).contains(cell.field);
},
render: function($td, cell) {
// Add a class to the cell based on the returned value
var value_arr = cell.value.split("|");
//var value_arr2 = cell.value.split("|");
var technique_id = value_arr[0];
var technique_name = value_arr[1];
var alert_list = value_arr[2];
var total_count = value_arr[3];
var urgency_str = "None"
var good_list = alert_list.replaceAll('=', '\n');
var ttl = "Total: " + total_count + "\nAlert_list : " + good_list
if(technique_id.includes('.')) {
$td.addClass('subtechnique');
}
else {
if(technique_name=="NULL"){
$td.addClass('empty');
}
else {
$td.addClass('technique');
}
}
$td.tooltip();
$td.prop('title', ttl);
if (total_count != "NULL") {
total = parseFloat(total_count);
if(total >= 10){
$td.addClass('range-cell').addClass('range-compliance_high');
}
if(total >= 4){
$td.addClass('range-cell').addClass('range-compliance_mid');
}
if(total >= 1){
$td.addClass('range-cell').addClass('range-compliance_low');
}
if(total >= 0){
$td.addClass('range-cell').addClass('range-compliance_zero');
}
}
else if(total_count == "NULL"){
$td.addClass('range-cell').addClass('range-none');
}
if (isDarkTheme) {
$td.addClass('dark');
}
// Update the cell content
//$td.text(value.toFixed(2)).addClass('numeric');
if (technique_name=="NULL"){
$td.text(" ");
}
else {
$td.text(technique_id + ": " + technique_name);
$td.addClass('add-border').addClass('text-align-center');
}
}
});
mvc.Components.get('mitrematrix').getVisualization(function(tableView) {
// Add custom cell renderer, the table will re-render automatically.
tableView.addCellRenderer(new CustomRangeRenderer());
});
});
... View more