(zeppelin) branch branch-0.12 updated: [ZEPPELIN-6097] Suppress duplicated error popup and fix broken CSS

[chengpan]

This is an automated email from the ASF dual-hosted git repository.

chengpan pushed a commit to branch branch-0.12
in repository https://gitbox.apache.org/repos/asf/zeppelin.git


The following commit(s) were added to refs/heads/branch-0.12 by this push:
     new 58ddbd18cc [ZEPPELIN-6097] Suppress duplicated error popup and fix 
broken CSS
58ddbd18cc is described below

commit 58ddbd18ccc7ab0d51e37ad671600c7dfbe5f19f
Author: YONGJAE LEE(이용재) <dev.yongjae...@gmail.com>
AuthorDate: Wed Oct 16 13:04:43 2024 +0900

    [ZEPPELIN-6097] Suppress duplicated error popup and fix broken CSS
    
    ### What is this PR for?
    
    If I broke notebook's(*.zepl) JSON structure I can get error message like 
below.
    
    
![image-2024-09-22-16-53-49-273](https://github.com/user-attachments/assets/24386e66-84f6-4902-b9d2-101af656f3e3)
    
    There are two kind of problems.
    
    1. Same error message shows twice.
    2. Word break CSS style is not applied yet so it looks quite weird.
    
    So I fixed it correct way.
    
    [How to solve]
    1. Check 
[/zeppelin-web-angular/src/app/pages/workspace/notebook/notebook.component.ts](https://github.com/apache/zeppelin/blob/bdf5b067b6bdde2614b98a6a3f6a7b5d6637e57c/zeppelin-web-angular/src/app/pages/workspace/notebook/notebook.component.ts)
 file and found 
[L392](https://github.com/apache/zeppelin/blob/bdf5b067b6bdde2614b98a6a3f6a7b5d6637e57c/zeppelin-web-angular/src/app/pages/workspace/notebook/notebook.component.ts#L392),
 [L396](https://github.com/apache/zeppelin/blob/bdf5b067b6 [...]
    2. So I just handle it with 
[/zeppelin-web-angular/src/app/app-message.interceptor.ts](https://github.com/apache/zeppelin/blob/bdf5b067b6bdde2614b98a6a3f6a7b5d6637e57c/zeppelin-web-angular/src/app/app-message.interceptor.ts)
 this file to this 
https://github.com/apache/zeppelin/pull/4872/commits/67bec5c3415b9fa6d23f842a61d2ee0a5f139dac
    3. I just added `word-wrap` and `word-break` options to 
`nzNotificationService.warning` function's third parameter for correct style 
issue 
https://github.com/apache/zeppelin/pull/4872/commits/d0e73057c9ee76a9af8b4caf53e68bb240d00328
    
    ### What type of PR is it?
    Bug Fix
    
    ### Todos
    
    ### What is the Jira issue?
    * [[ZEPPELIN-6097](https://issues.apache.org/jira/browse/ZEPPELIN-6097)]
    
    ### How should this be tested?
    
    <img width="1624" alt="스크린샷 2024-10-14 오후 10 26 25" 
src="https://github.com/user-attachments/assets/56cf3ae1-9eb6-4720-b6cc-9ef6a5ec5840";>
    1. Broke .zepl extension file's JSON structure like above screenshot.
    
    <img width="1378" alt="스크린샷 2024-10-14 오후 11 07 55" 
src="https://github.com/user-attachments/assets/05a15473-a9dc-426c-ae1e-a437ee3b4036";>
    2. Check it on webpage with browser console.
    
    <img width="1624" alt="스크린샷 2024-10-14 오후 11 11 15" 
src="https://github.com/user-attachments/assets/b9ec4f52-5857-416b-91b1-8af48d38ef14";>
    3. If error message look so long you can change 
`nzNotificationService.warning` function's second parameter.
    
    <img width="1277" alt="스크린샷 2024-10-14 오후 11 13 11" 
src="https://github.com/user-attachments/assets/6bdbdeca-aa14-4ac2-becb-b4fb11425b6c";>
    4. Check error message still appear twice.
    
    ### Screenshots (if appropriate)
    
    ### Questions:
    * Does the license files need to update? N
    * Is there breaking changes for older versions? N
    * Does this needs documentation? N
    
    Closes #4872 from dididy/master.
    
    Signed-off-by: Cheng Pan <cheng...@apache.org>
    (cherry picked from commit de406a7e713a5c6ad304c041f7d9b9d5f458af8a)
    Signed-off-by: Cheng Pan <cheng...@apache.org>
---
 zeppelin-web-angular/src/app/app-message.interceptor.ts | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/zeppelin-web-angular/src/app/app-message.interceptor.ts 
b/zeppelin-web-angular/src/app/app-message.interceptor.ts
index 02fdf962c6..d2be729277 100644
--- a/zeppelin-web-angular/src/app/app-message.interceptor.ts
+++ b/zeppelin-web-angular/src/app/app-message.interceptor.ts
@@ -26,7 +26,8 @@ export class AppMessageInterceptor implements 
MessageInterceptor {
     private router: Router,
     private nzNotificationService: NzNotificationService,
     private ticketService: TicketService,
-    private nzModalService: NzModalService
+    private nzModalService: NzModalService,
+    private prevErrorInfo: string
   ) {}
 
   received<T extends keyof MessageReceiveDataTypeMap>(data: 
WebSocketMessage<T>): WebSocketMessage<T> {
@@ -60,8 +61,18 @@ export class AppMessageInterceptor implements 
MessageInterceptor {
     } else if (data.op === OP.ERROR_INFO) {
       // tslint:disable-next-line:no-any
       const rData = (data.data as any) as 
MessageReceiveDataTypeMap[OP.ERROR_INFO];
-      if (rData.info) {
-        this.nzNotificationService.warning('ERROR', rData.info);
+      const isDuplicateError = this.prevErrorInfo === rData.info;
+
+      if (!isDuplicateError && rData.info) {
+        this.nzNotificationService.warning('ERROR', rData.info, {
+          nzStyle: { wordWrap: 'break-word', wordBreak: 'break-all' }
+        });
+        this.prevErrorInfo = rData.info;
+      }
+      if (isDuplicateError) {
+        setTimeout(() => {
+          this.prevErrorInfo = null;
+        }, 500);
       }
     }
     return data;