Feature - customAlertHandler (SAP#2304)

core/src/App.html

@@ -827,6 +827,10 @@
   };
 
   export const showAlert = (settings, openFromClient = false) => {
+    const customAlertHandler = LuigiConfig.getConfigValue('settings.customAlertHandler');
+    if (GenericHelpers.isFunction(customAlertHandler)) {
+      return customAlertHandler(settings, openFromClient);
+    }
     const currentAlerts = alerts;
 
     if (!settings.id) {
@@ -1477,8 +1481,12 @@
 
       if ('luigi.ux.alert.show' === e.data.msg) {
         const { settings } = e.data.data;
-
-        if (!settings.text) {
+        if (
+          !settings.text &&
+          !GenericHelpers.isFunction(
+            LuigiConfig.getConfigValue('settings.customAlertHandler')
+          )
+        ) {
           console.error(
             "Luigi Client alert: 'text' field for alert is empty or not present, therefore alert will not be displayed"
           );

docs/general-settings.md

@@ -158,6 +158,21 @@ theming : {
      }
   }
 ```
+* **customAlertHandler** is a function which will be called if it is defined. With this function, Luigi alerts will be disabled and you can implement your own alerts. This function gets `settings` and `openFromClient` as parameters. In addition, we recommend to return a [promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise): 
+
+```javascript
+Luigi.setConfig({
+  ...,
+  settings: {
+    customAlertHandler: ()=>{
+     return new Promise((resolve, reject) => {
+       //custom alert implementation
+     });
+    }
+  }
+})
+```
+
 
 ### Third-party cookies support check
 

docs/luigi-core-api.md

@@ -884,6 +884,10 @@ Returns **[promise](https://developer.mozilla.org/docs/Web/JavaScript/Reference/
 
 -   **since**: 0.6.4
 
+<!-- add-attribute:class:warning -->
+
+> **NOTE:** You can also define a [customAlertHandler](general-settings.md#general-parameters) function to implement custom alerts.
+
 #### showConfirmationModal
 
 Shows a confirmation modal.

test/e2e-test-application/src/luigi-config/extended/settings.js

@@ -44,6 +44,11 @@ class Settings {
   featureToggles = {
     queryStringParam: 'ft'
   };
+
+  // customAlertHandler = (settings, openFromClient = false) =>{
+  //   window.open('http://localhost:4200',settings.title , `width=${settings.width},height=${settings.height}`);
+  // }
+
   // sideNavCompactMode = true;
   // allowRules = ['microphone'];
   // iframeCreationInterceptor = (iframe, viewGroup, navigationNode, microFrontendType) => { };