improvement/IISCRUM-1249

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "grafana-zabbix",
+  "name": "iiris-zabbix-triggers-panel",
   "private": false,
   "version": "3.11.0",
   "description": "Zabbix plugin for Grafana",

src/dashboards/template_linux_server.json

@@ -3,7 +3,7 @@
     {
       "name": "DS_NAME",
       "type": "datasource",
-      "pluginId": "alexanderzobnin-zabbix-datasource"
+      "pluginId": "iiris-zabbix-datasource"
     }
   ],
   "title": "Zabbix Template Linux Server",

src/dashboards/zabbix_server_dashboard.json

@@ -601,7 +601,7 @@
         "label": "Zabbix Data Source",
         "name": "datasource",
         "options": [],
-        "query": "alexanderzobnin-zabbix-datasource",
+        "query": "iiris-zabbix-datasource",
         "refresh": 1,
         "regex": "",
         "type": "datasource"

src/dashboards/zabbix_system_status.json

@@ -3,7 +3,7 @@
     {
       "name": "DS_NAME",
       "type": "datasource",
-      "pluginId": "alexanderzobnin-zabbix-datasource"
+      "pluginId": "iiris-zabbix-datasource"
     }
   ],
   "title": "Zabbix System Status",

src/datasource-zabbix/module.ts

@@ -19,8 +19,8 @@ ZabbixQueryController.templateUrl = 'datasource-zabbix/partials/query.editor.htm
 ZabbixDSConfigController.templateUrl = 'datasource-zabbix/partials/config.html';
 
 loadPluginCss({
-  dark: 'plugins/alexanderzobnin-zabbix-app/css/grafana-zabbix.dark.css',
-  light: 'plugins/alexanderzobnin-zabbix-app/css/grafana-zabbix.light.css'
+  dark: 'plugins/iiris-zabbix-triggers-panel/css/grafana-zabbix.dark.css',
+  light: 'plugins/iiris-zabbix-triggers-panel/css/grafana-zabbix.light.css'
 });
 
 export {

src/datasource-zabbix/plugin.json

@@ -1,7 +1,7 @@
 {
   "type": "datasource",
-  "name": "Zabbix",
-  "id": "alexanderzobnin-zabbix-datasource",
+  "name": "Iiris Zabbix Datasource",
+  "id": "iiris-zabbix-datasource",
 
   "includes": [
     {

src/datasource-zabbix/utils.ts

@@ -78,13 +78,26 @@ export function containsMacro(itemName) {
   return MACRO_PATTERN.test(itemName);
 }
 
-export function replaceMacro(item, macros) {
-  let itemName = item.name;
+export function replaceMacro(item, macros, isTriggerItem) {
+  let itemName = isTriggerItem ? item.url : item.name;
   const item_macros = itemName.match(MACRO_PATTERN);
   _.forEach(item_macros, macro => {
     const host_macros = _.filter(macros, m => {
       if (m.hostid) {
-        return m.hostid === item.hostid;
+        if (isTriggerItem) {
+          // Trigger item can have multiple hosts
+          // Check all trigger host ids against macro host id
+          let hostIdFound = false;
+          _.forEach(item.hosts, h => {
+            if (h.hostid === m.hostid) {
+              hostIdFound = true;
+            }
+          });
+          return hostIdFound;
+        } else {
+          // Check app host id against macro host id
+          return m.hostid === item.hostid;
+        }
       } else {
         // Add global macros
         return true;

src/datasource-zabbix/zabbix/zabbix.js

@@ -235,13 +235,17 @@ export class Zabbix {
     .then(this.expandUserMacro.bind(this));
   }
 
-  expandUserMacro(items) {
+  expandUserMacro(items, isTriggerItem) {
     let hostids = getHostIds(items);
     return this.getMacros(hostids)
     .then(macros => {
       _.forEach(items, item => {
-        if (utils.containsMacro(item.name)) {
-          item.name = utils.replaceMacro(item, macros);
+        if (utils.containsMacro(isTriggerItem ? item.url : item.name)) {
+          if (isTriggerItem) {
+            item.url = utils.replaceMacro(item, macros, isTriggerItem);
+          } else {
+            item.name = utils.replaceMacro(item, macros);
+          }
         }
       });
       return items;
@@ -286,7 +290,8 @@ export class Zabbix {
       return query;
     })
     .then(query => this.zabbixAPI.getTriggers(query.groupids, query.hostids, query.applicationids, options))
-    .then(triggers => this.filterTriggersByProxy(triggers, proxyFilter));
+    .then(triggers => this.filterTriggersByProxy(triggers, proxyFilter))
+    .then(triggers => this.expandUserMacro.bind(this)(triggers, true));
   }
 
   filterTriggersByProxy(triggers, proxyFilter) {

src/module.js

@@ -5,8 +5,8 @@ import {ZabbixAppConfigCtrl} from './components/config';
 import {loadPluginCss} from 'grafana/app/plugins/sdk';
 
 loadPluginCss({
-  dark: 'plugins/alexanderzobnin-zabbix-app/css/grafana-zabbix.dark.css',
-  light: 'plugins/alexanderzobnin-zabbix-app/css/grafana-zabbix.light.css'
+  dark: 'plugins/iiris-zabbix-triggers-panel/css/grafana-zabbix.dark.css',
+  light: 'plugins/iiris-zabbix-triggers-panel/css/grafana-zabbix.light.css'
 });
 
 export {

src/panel-triggers/components/AlertList/AlertList.tsx

@@ -77,7 +77,10 @@ export default class AlertList extends PureComponent<AlertListProps, AlertListSt
             )}
           </ol>
         </section>
-
+        {(currentProblems.length === 0
+          ? <div className="no-data-container">Ei aktiivisia häiriöitä</div>
+          : null)
+        }
         <div className="triggers-panel-footer" key="alertListFooter">
           <PaginationControl
             itemsLength={problems.length}

src/panel-triggers/datasource-selector.directive.js

@@ -11,7 +11,7 @@ const template = `
 
 angular
 .module('grafana.directives')
-.directive('datasourceSelector', () => {
+.directive('iirisDatasourceSelector', () => {
   return {
     scope: {
       datasources: "=",

src/panel-triggers/module.js

@@ -16,8 +16,8 @@ import {loadPluginCss} from 'grafana/app/plugins/sdk';
 import './datasource-selector.directive';
 
 loadPluginCss({
-  dark: 'plugins/alexanderzobnin-zabbix-app/css/grafana-zabbix.dark.css',
-  light: 'plugins/alexanderzobnin-zabbix-app/css/grafana-zabbix.light.css'
+  dark: 'plugins/iiris-zabbix-triggers-panel/css/grafana-zabbix.dark.css',
+  light: 'plugins/iiris-zabbix-triggers-panel/css/grafana-zabbix.light.css'
 });
 
 export {

src/panel-triggers/partials/triggers_tab.html

@@ -5,11 +5,11 @@
         <label class="gf-form-label width-9">Data sources</label>
       </div>
       <div class="gf-form">
-        <datasource-selector
+        <iiris-datasource-selector
           datasources="editor.selectedDatasources"
           options="editor.panelCtrl.available_datasources"
           on-change="editor.datasourcesChanged()">
-        </datasource-selector>
+        </iiris-datasource-selector>
       </div>
     </div>
   </div>

src/panel-triggers/plugin.json

@@ -1,7 +1,7 @@
 {
   "type": "panel",
-  "name": "Zabbix Problems",
-  "id": "alexanderzobnin-zabbix-triggers-panel",
+  "name": "Iiris Zabbix Problems",
+  "id": "iiris-zabbix-problems-panel",
 
   "dataFormats": [],
   "skipDataQuery": true,

src/panel-triggers/triggers_panel_ctrl.js

@@ -13,7 +13,7 @@ import ProblemList from './components/Problems/Problems';
 import AlertList from './components/AlertList/AlertList';
 import { getNextRefIdChar } from './utils';
 
-const ZABBIX_DS_ID = 'alexanderzobnin-zabbix-datasource';
+const ZABBIX_DS_ID = 'iiris-zabbix-datasource';
 const PROBLEM_EVENTS_LIMIT = 100;
 
 export const DEFAULT_TARGET = {
@@ -38,12 +38,12 @@ export const getDefaultTarget = (targets) => {
 };
 
 export const DEFAULT_SEVERITY = [
-  { priority: 0, severity: 'Not classified',  color: 'rgb(108, 108, 108)', show: true},
-  { priority: 1, severity: 'Information',     color: 'rgb(120, 158, 183)', show: true},
-  { priority: 2, severity: 'Warning',         color: 'rgb(175, 180, 36)', show: true},
-  { priority: 3, severity: 'Average',         color: 'rgb(255, 137, 30)', show: true},
-  { priority: 4, severity: 'High',            color: 'rgb(255, 101, 72)', show: true},
-  { priority: 5, severity: 'Disaster',        color: 'rgb(215, 0, 0)', show: true},
+  { priority: 0, severity: 'Not classified',  color: 'rgb(108, 108, 108)', show: false},
+  { priority: 1, severity: 'Informatiivinen', color: 'rgb(120, 158, 183)', show: true},
+  { priority: 2, severity: 'Matala',          color: 'rgb(175, 180, 36)', show: true},
+  { priority: 3, severity: 'Keskitaso',       color: 'rgb(255, 137, 30)', show: true},
+  { priority: 4, severity: 'Vakava',          color: 'rgb(255, 101, 72)', show: true},
+  { priority: 5, severity: 'Kriittinen',      color: 'rgb(215, 0, 0)', show: true},
 ];
 
 export const getDefaultSeverity = () => DEFAULT_SEVERITY;
@@ -54,30 +54,30 @@ export const PANEL_DEFAULTS = {
   schemaVersion: CURRENT_SCHEMA_VERSION,
   targets: [getDefaultTarget([])],
   // Fields
-  hostField: true,
+  hostField: false,
   hostTechNameField: false,
   hostGroups: false,
   hostProxy: false,
-  showTags: true,
-  statusField: true,
+  showTags: false,
+  statusField: false,
   statusIcon: false,
   severityField: true,
-  ageField: false,
+  ageField: true,
   descriptionField: true,
-  descriptionAtNewLine: false,
+  descriptionAtNewLine: true,
   // Options
   hostsInMaintenance: true,
   showTriggers: 'all triggers',
-  sortTriggersBy: { text: 'last change', value: 'lastchange' },
+  sortTriggersBy: { text: 'severity', value: 'priority' },
   showEvents: { text: 'Problems', value: 1 },
-  limit: 100,
+  limit: 10,
   // View options
-  layout: 'table',
+  layout: 'list',
   fontSize: '100%',
-  pageSize: 10,
+  pageSize: 5,
   problemTimeline: true,
-  highlightBackground: false,
-  highlightNewEvents: false,
+  highlightBackground: true,
+  highlightNewEvents: true,
   highlightNewerThan: '1h',
   customLastChangeFormat: false,
   lastChangeFormat: "",
@@ -261,10 +261,10 @@ export class TriggerPanelCtrl extends PanelCtrl {
         showAckButton = !datasource.disableReadOnlyUsersAck || userIsEditor;
 
         // Replace template variables
-        const groupFilter = datasource.replaceTemplateVars(triggerFilter.group.filter);
-        const hostFilter = datasource.replaceTemplateVars(triggerFilter.host.filter);
-        const appFilter = datasource.replaceTemplateVars(triggerFilter.application.filter);
-        const proxyFilter = datasource.replaceTemplateVars(triggerFilter.proxy.filter);
+        const groupFilter = triggerFilter && triggerFilter.group ? datasource.replaceTemplateVars(triggerFilter.group.filter) : '';
+        const hostFilter = triggerFilter && triggerFilter.host ? datasource.replaceTemplateVars(triggerFilter.host.filter) : '';
+        const appFilter = triggerFilter && triggerFilter.application ? datasource.replaceTemplateVars(triggerFilter.application.filter) : '';
+        const proxyFilter = triggerFilter && triggerFilter.proxy ? datasource.replaceTemplateVars(triggerFilter.proxy.filter) : '';
 
         let triggersOptions = {
           showTriggers: showEvents
@@ -354,7 +354,7 @@ export class TriggerPanelCtrl extends PanelCtrl {
   filterTriggersPre(triggerList, target) {
     // Filter triggers by description
     const ds = target.datasource;
-    let triggerFilter = target.trigger.filter;
+    let triggerFilter = target ? target.trigger.filter : '';
     triggerFilter = this.datasources[ds].replaceTemplateVars(triggerFilter);
     if (triggerFilter) {
       triggerList = filterTriggers(triggerList, triggerFilter);
@@ -720,7 +720,7 @@ export class TriggerPanelCtrl extends PanelCtrl {
   }
 }
 
-TriggerPanelCtrl.templateUrl = 'public/plugins/alexanderzobnin-zabbix-app/panel-triggers/partials/module.html';
+TriggerPanelCtrl.templateUrl = 'public/plugins/iiris-zabbix-triggers-panel/panel-triggers/partials/module.html';
 
 function filterTriggers(triggers, triggerFilter) {
   if (utils.isRegex(triggerFilter)) {

src/panel-triggers/triggers_tab.js

@@ -125,7 +125,7 @@ export function triggerPanelTriggersTab() {
   return {
     restrict: 'E',
     scope: true,
-    templateUrl: 'public/plugins/alexanderzobnin-zabbix-app/panel-triggers/partials/triggers_tab.html',
+    templateUrl: 'public/plugins/iiris-zabbix-triggers-panel/panel-triggers/partials/triggers_tab.html',
     controller: TriggersTabCtrl,
   };
 }

src/plugin.json

@@ -1,10 +1,10 @@
 {
   "type": "app",
-  "name": "Zabbix",
-  "id": "alexanderzobnin-zabbix-app",
+  "name": "Iiris Zabbix",
+  "id": "iiris-zabbix-triggers-panel",
 
   "info": {
-    "description": "Zabbix plugin for Grafana",
+    "description": "Iiris Zabbix plugin for Grafana",
     "author": {
       "name": "Alexander Zobnin",
       "url": "https://github.com/alexanderzobnin"
@@ -33,11 +33,11 @@
   "includes": [
     {
       "type": "datasource",
-      "name": "Zabbix Datasource"
+      "name": "Iiris Zabbix Datasource"
     },
     {
       "type": "panel",
-      "name": "Triggers Panel"
+      "name": "Iiris Zabbix Problems"
     }
   ],
 

src/sass/_panel-triggers.scss

@@ -95,6 +95,19 @@
     }
   }
 
+  .no-data-container {
+    width: 100%;
+    height: 40px;
+    color: #333;
+    font-weight: 600;
+    font-size: 14px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-top: 1px solid #ccc;
+    border-bottom: 1px solid #ccc;
+  }
+
   .zabbix-trigger-name {
     font-weight: bold;
   }