Feature/3316 error handler orchestrator (#3327)

* feat(errorBoundary): Added ErrorBoundary HOC and component and added loglevel dependency

* feature(errorBoundary): Moved with the others HOCs.

* feature(errorBoundary): Typo refactor.

* First attempt LoggerService

* Merged error boundary, integrated loggerService.

* changed logger name, create logger-service test file

* Updated CHANGELOG

* Moved to react-services, changed name, traslates comments

* feat(errorBoundary): Removed old integration

* refactor(loggerService): Changed class for function methods.

* test(logger-service): Added basic unit test to logger-service

* refactor(logger-service): Applied new implementation of error-orchestrator service.

* feature(logger-service): PR comments and some refactors.

Co-authored-by: gabiwassan <gabriel.wassan@wazuh.com>
Co-authored-by: Ibarra Maximiliano <maximiliano.ibarra@wazuh.com>

CHANGELOG.md

@@ -9,6 +9,9 @@ All notable changes to the Wazuh app project will be documented in this file.
 - Changed ossec to wazuh in sample-data [#3121](https://github.com/wazuh/wazuh-kibana-app/pull/3121)
 - Changed empty fields in FIM tables and `syscheck.value_name` in discovery now show an empty tag for visual clarity [#3279](https://github.com/wazuh/wazuh-kibana-app/pull/3279)
 
+### Added 
+- Added new error handler to be responsible for the error orchestration [#3327](https://github.com/wazuh/wazuh-kibana-app/pull/3327)
+
 ## Wazuh v4.2.0 - Kibana 7.10.2 , 7.11.2 - Revision 4201
 
 ### Added

common/constants.ts

@@ -220,3 +220,36 @@ export enum WAZUH_MODULES_ID{
 
 export const AUTHORIZED_AGENTS = 'authorized-agents';
 export const HEALTH_CHECK = 'health-check';
+
+// Health check
+export const HEALTH_CHECK_REDIRECTION_TIME = 300; //ms
+
+// Kibana settings
+// Default timeTilter set by the app
+export const WAZUH_KIBANA_SETTING_TIME_FILTER = {
+  from: "now-24h",
+  to: 'now'
+};
+export const KIBANA_SETTING_NAME_TIME_FILTER = 'timepicker:timeDefaults';
+
+// Default maxBuckets set by the app
+export const WAZUH_KIBANA_SETTING_MAX_BUCKETS = 200000;
+export const KIBANA_SETTING_NAME_MAX_BUCKETS = 'timelion:max_buckets';
+
+// Default metaFields Kibana setting set by the app
+export const WAZUH_KIBANA_SETTING_METAFIELDS = ['_source', '_index'];
+export const KIBANA_SETTING_NAME_METAFIELDS = 'metaFields';
+
+
+// Logger
+export const UI_LOGGER_LEVELS = {
+  WARNING: 'WARNING',
+  INFO: 'INFO',
+  ERROR: 'ERROR',
+};
+
+export const UI_TOAST_COLOR = {
+  SUCCESS: 'success',
+  WARNING: 'warning',
+  DANGER: 'danger',
+};

package.json

@@ -37,7 +37,7 @@
     "test:browser": "plugin-helpers test:browser",
     "test:jest": "node scripts/jest",
     "generate:api-4.0-info": "cd scripts/generate-api-4.0-info;./generate-api-4.0-info.sh;cd ../..",
-    "prebuild": "node scripts/generate-build-version"    
+    "prebuild": "node scripts/generate-build-version"
   },
   "dependencies": {
     "angular-animate": "1.7.8",
@@ -48,6 +48,7 @@
     "js2xmlparser": "^3.0.0",
     "json2csv": "^4.1.2",
     "jwt-decode": "^2.2.0",
+    "loglevel": "^1.7.1",
     "needle": "^2.0.1",
     "node-cron": "^1.1.2",
     "pdfmake": "0.1.65",

public/kibana-services.ts

@@ -16,14 +16,17 @@ import { DataPublicPluginStart } from '../../../src/plugins/data/public';
 import { VisualizationsStart } from '../../../src/plugins/visualizations/public';
 import { NavigationPublicPluginStart } from '../../../src/plugins/navigation/public';
 import { AppPluginStartDependencies } from './types';
+import { ErrorOrchestrator } from '../common/constants';
 
 export const [getCore, setCore] = createGetterSetter<CoreStart>('Core');
 export const [getPlugins, setPlugins] = createGetterSetter<AppPluginStartDependencies>('Plugins');
 export const [getToasts, setToasts] = createGetterSetter<ToastsStart>('Toasts');
 export const [getHttp, setHttp] = createGetterSetter<HttpStart>('Http');
 export const [getUiSettings, setUiSettings] = createGetterSetter<IUiSettingsClient>('UiSettings');
 export const [getChrome, setChrome] = createGetterSetter<ChromeStart>('Chrome');
-export const [getScopedHistory, setScopedHistory] = createGetterSetter<ScopedHistory>('ScopedHistory');
+export const [getScopedHistory, setScopedHistory] = createGetterSetter<ScopedHistory>(
+  'ScopedHistory'
+);
 export const [getOverlays, setOverlays] = createGetterSetter<OverlayStart>('Overlays');
 export const [getSavedObjects, setSavedObjects] = createGetterSetter<SavedObjectsStart>(
   'SavedObjects'
@@ -37,6 +40,9 @@ export const [getVisualizationsPlugin, setVisualizationsPlugin] = createGetterSe
 export const [getNavigationPlugin, setNavigationPlugin] = createGetterSetter<
   NavigationPublicPluginStart
 >('NavigationPlugin');
+export const [getErrorOrchestrator, setErrorOrchestrator] = createGetterSetter<ErrorOrchestrator>(
+  'ErrorOrchestrator'
+);
 
 /**
  * set bootstrapped inner angular module
@@ -66,4 +72,4 @@ export function getDiscoverModule() {
   return discoverModule;
 }
 
-export const [getCookies, setCookies] = createGetterSetter<any>('Cookies');
+export const [getCookies, setCookies] = createGetterSetter<any>('Cookies');

public/react-services/error-orchestrator/error-orchestrator-base.ts

@@ -0,0 +1,65 @@
+/*
+ * Wazuh app - Error Orchestrator base
+ * Copyright (C) 2015-2021 Wazuh, Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * Find more information about this on the LICENSE file.
+ */
+
+import { ErrorToastOptions } from 'kibana/public';
+import { UI_LOGGER_LEVELS } from '../../../common/constants';
+import { getToasts } from '../../kibana-services';
+import loglevel from 'loglevel';
+import { GenericRequest } from '../../react-services/generic-request';
+import { ErrorOrchestrator, UIErrorLog } from './types';
+
+export class ErrorOrchestratorBase implements ErrorOrchestrator {
+  public loadErrorLog(errorLog: UIErrorLog) {
+    if (errorLog.display) this.displayError(errorLog);
+    if (errorLog.store) this.storeError(errorLog).then(loglevel.info);
+  }
+
+  public displayError(errorLog: UIErrorLog) {
+    const toast = {
+      title: errorLog.error.title,
+      toastMessage: errorLog.error.message,
+      toastLifeTimeMs: 3000,
+    };
+
+    getToasts().addError(errorLog.error.error, toast as ErrorToastOptions);
+  }
+
+  public loglevelError(errorLog: UIErrorLog) {
+    switch (errorLog.level) {
+      case UI_LOGGER_LEVELS.INFO:
+        loglevel.info(errorLog.error.message, errorLog.error.error);
+        break;
+      case UI_LOGGER_LEVELS.WARNING:
+        loglevel.warn(errorLog.error.message, errorLog.error.error);
+        break;
+      case UI_LOGGER_LEVELS.ERROR:
+        loglevel.error(errorLog.error.message, errorLog.error.error);
+        break;
+      default:
+        console.log('No error level', errorLog.error.message, errorLog.error.error);
+    }
+  }
+
+  private async storeError(errorLog: UIErrorLog) {
+    try {
+      await GenericRequest.request('POST', `/utils/logs/ui`, {
+        body: {
+          message: errorLog.error.message,
+          level: errorLog.level,
+          location: errorLog.location,
+        },
+      });
+    } catch (error) {
+      loglevel.error('Failed on request [POST /utils/logs/ui]', error);
+    }
+  }
+}

public/react-services/error-orchestrator/error-orchestrator-business.ts

@@ -0,0 +1,20 @@
+/*
+ * Wazuh app - Error Orchestrator for business implementation
+ * Copyright (C) 2015-2021 Wazuh, Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * Find more information about this on the LICENSE file.
+ */
+
+import { ErrorOrchestratorBase } from './error-orchestrator-base';
+import { UIErrorLog } from './types';
+
+export class ErrorOrchestratorBusiness extends ErrorOrchestratorBase {
+  public displayError(errorLog: UIErrorLog) {
+    super.displayError(errorLog);
+  }
+}

public/react-services/error-orchestrator/error-orchestrator-critical.ts

@@ -0,0 +1,20 @@
+/*
+ * Wazuh app - Error Orchestrator for critical implementation
+ * Copyright (C) 2015-2021 Wazuh, Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * Find more information about this on the LICENSE file.
+ */
+
+import { ErrorOrchestratorBase } from './error-orchestrator-base';
+import { UIErrorLog } from './types';
+
+export class ErrorOrchestratorCritical extends ErrorOrchestratorBase {
+  public displayError(errorLog: UIErrorLog) {
+    // continue here with the integration with the error-boundary hoc/component
+  }
+}

public/react-services/error-orchestrator/error-orchestrator-ui.ts

@@ -0,0 +1,24 @@
+/*
+ * Wazuh app - Error Orchestrator for UI implementation
+ * Copyright (C) 2015-2021 Wazuh, Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * Find more information about this on the LICENSE file.
+ */
+
+import { ErrorOrchestratorBase } from './error-orchestrator-base';
+import { UIErrorLog } from './types';
+
+export class ErrorOrchestratorUI extends ErrorOrchestratorBase {
+  public displayError(errorLog: UIErrorLog) {
+    super.displayError(errorLog);
+  }
+
+  public loglevelError(errorLog: UIErrorLog) {
+    super.loglevelError(errorLog);
+  }
+}

public/react-services/error-orchestrator/error-orchestrator.factory.ts

@@ -0,0 +1,29 @@
+/*
+ * Wazuh app - Error Orchestrator factory
+ * Copyright (C) 2015-2021 Wazuh, Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * Find more information about this on the LICENSE file.
+ */
+
+import { ErrorOrchestratorUI } from './error-orchestrator-ui';
+import { ErrorOrchestratorBusiness } from './error-orchestrator-business';
+import { ErrorOrchestratorCritical } from './error-orchestrator-critical';
+import { ErrorOrchestrator, UI_ERROR_SEVERITIES, UIErrorSeverity } from './types';
+
+export const errorOrchestratorFactory = (severity: UIErrorSeverity): ErrorOrchestrator => {
+  switch (severity) {
+    case UI_ERROR_SEVERITIES.UI:
+      return new ErrorOrchestratorUI();
+    case UI_ERROR_SEVERITIES.BUSINESS:
+      return new ErrorOrchestratorBusiness();
+    case UI_ERROR_SEVERITIES.CRITICAL:
+      return new ErrorOrchestratorCritical();
+    default:
+      break;
+  }
+};

public/react-services/error-orchestrator/error-orchestrator.service.ts

@@ -0,0 +1,23 @@
+/*
+ * Wazuh app - Error Orchestrator service
+ * Copyright (C) 2015-2021 Wazuh, Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * Find more information about this on the LICENSE file.
+ */
+
+import { errorOrchestratorFactory } from './error-orchestrator.factory';
+import { ErrorOrchestrator, UIErrorLog } from './types';
+
+export class ErrorOrchestratorClass {
+  public constructor() {}
+
+  public handleError(uiErrorLog: UIErrorLog) {
+    const errorOrchestrator: ErrorOrchestrator = errorOrchestratorFactory(uiErrorLog.severity);
+    errorOrchestrator.loadErrorLog(uiErrorLog);
+  }
+}

public/react-services/error-orchestrator/types.ts

@@ -0,0 +1,46 @@
+/*
+ * Wazuh app - Error logger types
+ * Copyright (C) 2015-2021 Wazuh, Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * Find more information about this on the LICENSE file.
+ */
+
+type WARNING = 'WARNING';
+type INFO = 'INFO';
+type ERROR = 'ERROR';
+export type UILogLevel = WARNING | INFO | ERROR;
+
+type UI = 'UI';
+type BUSINESS = 'BUSINESS';
+type CRITICAL = 'CRITICAL';
+export type UIErrorSeverity = UI | BUSINESS | CRITICAL;
+export const UI_ERROR_SEVERITIES = {
+  UI: 'UI',
+  BUSINESS: 'BUSINESS',
+  CRITICAL: 'CRITICAL',
+};
+
+export type UIError = {
+  message: string;
+  error: any;
+  title?: string;
+};
+
+export type UIErrorLog = {
+  context: string;
+  level: UILogLevel;
+  severity: UIErrorSeverity;
+  display?: boolean;
+  store?: boolean;
+  error: UIError;
+  location: string;
+};
+
+export type ErrorOrchestrator = {
+  loadErrorLog: (uiErrorLog: UIErrorLog) => void;
+};

public/react-services/index.ts

@@ -1,4 +1,5 @@
 export { GenericRequest } from './generic-request';
 export { WzRequest } from './wz-request';
 export { ErrorHandler } from './error-handler';
-export { formatUIDate } from './time-service';
+export { formatUIDate } from './time-service';
+export { ErrorOrchestratorClass } from './error-orchestrator/error-orchestrator.service';