0052429: OnLoginActions do not allow to display UI - Openbravo Issue Tracking System

Openbravo Issue Tracking System - POS2

View Issue Details

Project

Category

View Status

Date Submitted

Last Update

0052429

POS2

Core

public

2022-09-27 18:08

2023-06-05 11:36

Reporter

adrianromero

Assigned To

meriem_azaf

Priority

normal

Severity

major

Reproducibility

have not tried

Status

closed

Resolution

fixed

Platform

OS Version

Product Version

Target Version

23Q2.1

Fixed in Version

23Q2.1

Merge Request Status

Review Assigned To

OBNetwork customer

Support ticket

Regression level

Regression date

Regression introduced in release

Regression introduced by commit

Triggers an Emergency Pack

Summary

0052429: OnLoginActions do not allow to display UI

Description

OnLoginActions are asynchronous and in cases like Fiscalization events and other events it is required to display UI dialogs. But this UI never appears and the cashier cannot interact with it because it is rendered but behind the loading panel

Steps To Reproduce

Register the following login action and verify the ask confirmation expression is reached but the console log expression is never reached and the application never ends the login action because there is a dialog behind the loading panel the cashier cannot interact with it. See the screenshots attached.

import OB from 'org.openbravo.core2/src/core/OB';
import OnLoginActions from 'org.openbravo.core2/src/core/authentication/OnLoginActions';
import './assets/style/main.scss';

export async function register() {
  OnLoginActions.registerAction(OB.EVTFIS.fiscalizationLogin);

  OnLoginActions.registerAction(async () => {
    await OB.App.View.DialogUIHandler.askConfirmation({
      title: 'Login dialog title',
      message: 'message',
      hideCancel: true
    });
    console.log('End login action.');
  });
}

export async function init() {
  // Nothing
}

Proposed Solution

The loading panel should not be in top of all the UI it should only replace the POS application. This way dialogs and modals can be rendered on top of the loading panel.

Loading Screen component has a z-index of 2000 to be on top of all other material UI components according the change comment: https://gitlab.com/openbravo/product/pmods/org.openbravo.core2/-/commit/ec4dd5ede9bbd089d3508bbd5c83a4f35c3222cf [^] This is OK fdr common components but not for modals, snackbars or tooltips See z-index for material UI components: https://mui.com/material-ui/customization/z-index/ [^]

The proposal is to change the z-index to 1250 for the Loading Screen component to be on top of regular material ui components but not for modals, snackbars or tooltips. The proposed change fixes this issue:

diff --git a/web-jspack/org.openbravo.core2/src/components/LoadingScreen/LoadingScreen.scss b/web-jspack/org.openbravo.core2/src/components/LoadingScreen/LoadingScreen.scss
index c30838ef..6fe19787 100644
--- a/web-jspack/org.openbravo.core2/src/components/LoadingScreen/LoadingScreen.scss
+++ b/web-jspack/org.openbravo.core2/src/components/LoadingScreen/LoadingScreen.scss
@@ -14,7 +14,7 @@

.obc2LoadingScreen-container .obc2LoadingScreen {
   position: absolute;
- z-index: 2000; /* This screen has to be above any other element */
+ z-index: 1250; /* This screen has to be above any other element but not modals, with z-index: 1300 */
   display: grid;
   align-items: center;
   justify-items: center;

Additional Information