From 8a7bf14fbbfe33a2ec78e87e2bdd83fb2090671c Mon Sep 17 00:00:00 2001
From: Kartik Chavda <kcv@odoo.com>
Date: Wed, 14 Jun 2023 05:48:14 +0000
Subject: [PATCH] [FIX] web: fix new line in confirmation and alert dialog

Steps:
- Install studio.
- Open studio.
- Click on reset default view.

Issue:
- Confirmation dialog body display in single line instead in
multiple lines same thing happens in pos confirmation dialog
also in new friendly message task we need to display error
message in multiple line.

Cause:
- There is a style missing on body of that dialog to preserve
white spaces also need to use other tag then <t> to apply
proper style

Fix:
- Use <p> tag instead <t> tag and add a `text-prewrap` class
in bootstrap utility class and use this class in `<p>` to
preserve space.

task-3356114

closes odoo/odoo#125300

X-original-commit: 700d41d2f007124390b7cafca0a2e58a467e2b43
Related: odoo/enterprise#42842
Signed-off-by: Pierre Paridans (app) <app@odoo.com>
---
 .../core/confirmation_dialog/confirmation_dialog.xml |  4 ++--
 addons/web/static/src/core/errors/error_dialogs.xml  | 12 ++++++------
 addons/web/static/src/scss/utilities_custom.scss     |  9 +++++++++
 .../form/form_error_dialog/form_error_dialog.xml     |  2 +-
 4 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/addons/web/static/src/core/confirmation_dialog/confirmation_dialog.xml b/addons/web/static/src/core/confirmation_dialog/confirmation_dialog.xml
index f91fd1f4938..5383cef8b08 100644
--- a/addons/web/static/src/core/confirmation_dialog/confirmation_dialog.xml
+++ b/addons/web/static/src/core/confirmation_dialog/confirmation_dialog.xml
@@ -3,7 +3,7 @@
 
   <t t-name="web.ConfirmationDialog" owl="1">
     <Dialog size="'md'" title="props.title" modalRef="modalRef">
-      <t t-out="props.body" />
+      <p t-out="props.body" class="text-prewrap"/>
       <t t-set-slot="footer" owl="1">
         <button class="btn btn-primary" t-on-click="_confirm" t-esc="props.confirmLabel"/>
         <button t-if="props.cancel" class="btn btn-secondary" t-on-click="_cancel" t-esc="props.cancelLabel"/>
@@ -13,7 +13,7 @@
 
   <t t-name="web.AlertDialog" owl="1">
     <Dialog size="'sm'" title="props.title" contentClass="props.contentClass">
-      <t t-out="props.body" />
+      <p t-out="props.body" class="text-prewrap"/>
       <t t-set-slot="footer" owl="1">
         <button class="btn btn-primary" t-on-click="_confirm" t-esc="props.confirmLabel"/>
         <button t-if="props.cancel" class="btn btn-secondary" t-on-click="_cancel" t-esc="props.cancelLabel"/>
diff --git a/addons/web/static/src/core/errors/error_dialogs.xml b/addons/web/static/src/core/errors/error_dialogs.xml
index a479ff31ad4..f1a6c4032dc 100644
--- a/addons/web/static/src/core/errors/error_dialogs.xml
+++ b/addons/web/static/src/core/errors/error_dialogs.xml
@@ -4,7 +4,7 @@
     <t t-name="web.WarningDialog" owl="1">
       <Dialog title="title" size="'md'" contentClass="'o_error_dialog'">
         <div role="alert">
-          <p t-esc="message" style="white-space: pre-wrap;"/>
+          <p t-esc="message" class="text-prewrap"/>
         </div>
         <t t-set-slot="footer">
           <button class="btn btn-primary o-default-button" t-on-click="props.close">Close</button>
@@ -15,7 +15,7 @@
     <t t-name="web.RedirectWarningDialog" owl="1">
       <Dialog title="title" size="'md'" contentClass="'o_error_dialog'">
         <div role="alert">
-          <p t-esc="message" style="white-space: pre-wrap;"/>
+          <p t-esc="message" class="text-prewrap"/>
         </div>
         <t t-set-slot="footer">
           <button class="btn btn-primary" t-on-click="onClick" t-esc="buttonText"/>
@@ -27,7 +27,7 @@
     <t t-name="web.Error504Dialog" owl="1">
       <Dialog title="this.constructor.title" size="'md'" contentClass="'o_error_dialog'">
         <div role="alert">
-            <p style="white-space: pre-wrap;">
+            <p class="text-prewrap">
             The operation was interrupted. This usually means that the current operation is taking too much time.
             </p>
         </div>
@@ -40,7 +40,7 @@
     <t t-name="web.SessionExpiredDialog" owl="1">
       <Dialog title="this.constructor.title" size="'md'" contentClass="'o_error_dialog'">
         <div role="alert">
-          <p style="white-space: pre-wrap;">
+          <p class="text-prewrap">
             Your Odoo session expired. The current page is about to be refreshed.
           </p>
         </div>
@@ -53,7 +53,7 @@
     <t t-name="web.ErrorDialog" owl="1">
       <Dialog title="this.constructor.title" size="'md'" contentClass="'o_error_dialog'">
          <div role="alert">
-          <p style="white-space: pre-wrap;">
+          <p class="text-prewrap">
             <p><b>An error occurred</b></p>
             <p>Please use the copy button to report the error to your support service.</p>
           </p>
@@ -79,7 +79,7 @@
     <t t-name="web.ScssErrorDialog" owl="1">
       <Dialog title="this.constructor.title" size="'md'" contentClass="'o_error_dialog'">
         <div role="alert">
-          <p>
+          <p class="text-prewrap">
             The style compilation failed, see the error below. This is an administrator or developer error that must be fixed for the entire database before continuing working.
           </p>
           <pre t-esc="props.message"/>
diff --git a/addons/web/static/src/scss/utilities_custom.scss b/addons/web/static/src/scss/utilities_custom.scss
index 6028e3cdecf..8a5d8eafe27 100644
--- a/addons/web/static/src/scss/utilities_custom.scss
+++ b/addons/web/static/src/scss/utilities_custom.scss
@@ -52,6 +52,15 @@ $utilities: map-merge(
                 values: join(map-get(map-get($utilities, "display"), "values"), contents),
             ),
         ),
+        "white-space": map-merge(
+            map-get($utilities, "white-space"),
+            (
+                values: map-merge(
+                    map-get(map-get($utilities, "white-space"), "values"),
+                    ("prewrap": pre-wrap),
+                ),
+            ),
+        ),
         "position": map-merge(
             map-get($utilities, "position"),
             (
diff --git a/addons/web/static/src/views/form/form_error_dialog/form_error_dialog.xml b/addons/web/static/src/views/form/form_error_dialog/form_error_dialog.xml
index 5517bf6477a..90a6783012e 100644
--- a/addons/web/static/src/views/form/form_error_dialog/form_error_dialog.xml
+++ b/addons/web/static/src/views/form/form_error_dialog/form_error_dialog.xml
@@ -5,7 +5,7 @@
         <Dialog header="false" size="'md'" contentClass="'o_error_dialog'">
             <div role="alert">
                 <h1 class="text-danger">Oh snap!</h1>
-                <p t-esc="message" style="white-space: pre-wrap;"/>
+                <p t-esc="message" class="text-prewrap"/>
             </div>
             <t t-set-slot="footer">
                 <button class="btn btn-primary" t-on-click="stay">Stay here</button>