From: Pascal Mugnier <pascal.mugnier@sonarsource.com>
Date: Thu, 31 May 2018 07:26:26 +0000 (+0200)
Subject: SONAR-10819 Word breaks in error message
X-Git-Tag: 7.5~1092
X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=b540b6744affabae0fe53a9a5fb926704f1a0a17;p=sonarqube.git

SONAR-10819 Word breaks in error message
---

diff --git a/server/sonar-web/src/main/js/components/controls/GlobalMessages.css b/server/sonar-web/src/main/js/components/controls/GlobalMessages.css
index 6d0f5054a3e..8a819383cff 100644
--- a/server/sonar-web/src/main/js/components/controls/GlobalMessages.css
+++ b/server/sonar-web/src/main/js/components/controls/GlobalMessages.css
@@ -24,7 +24,6 @@
   left: 50%;
   width: 350px;
   margin-left: -175px;
-  word-break: break-all;
 }
 
 .process-spinner {
diff --git a/server/sonar-web/src/main/js/components/controls/GlobalMessages.tsx b/server/sonar-web/src/main/js/components/controls/GlobalMessages.tsx
index 24edc1ac4e4..4f91aaa0792 100644
--- a/server/sonar-web/src/main/js/components/controls/GlobalMessages.tsx
+++ b/server/sonar-web/src/main/js/components/controls/GlobalMessages.tsx
@@ -35,6 +35,13 @@ interface Props {
 }
 
 export default class GlobalMessages extends React.PureComponent<Props> {
+  cutLongWords = (message: string) => {
+    return message
+      .split(' ')
+      .map(word => (word.length > 35 ? word.substr(0, 35) + '...' : word))
+      .join(' ');
+  };
+
   renderMessage = (message: Message) => {
     const className = classNames('process-spinner', 'shown', {
       'process-spinner-failed': message.level === 'ERROR',
@@ -42,7 +49,7 @@ export default class GlobalMessages extends React.PureComponent<Props> {
     });
     return (
       <div className={className} key={message.id}>
-        {message.message}
+        {this.cutLongWords(message.message)}
         <ButtonIcon
           className="button-small process-spinner-close"
           color="#fff"