Merge branch '25681-network-graph-long-commit-msg' into 'master'

Account for newlines in commit messages on network graph

Closes #25681 and #21086

See merge request !8131

app/assets/javascripts/network/branch_graph.js

@@ -356,7 +356,7 @@
     icon = this.image(gon.relative_url_root + commit.author.icon, x, y, 20, 20);
     nameText = this.text(x + 25, y + 10, commit.author.name);
     idText = this.text(x, y + 35, commit.id);
-    messageText = this.text(x, y + 50, commit.message);
+    messageText = this.text(x, y + 50, commit.message.replace(/\r?\n/g, " \n "));
     textSet = this.set(icon, nameText, idText, messageText).attr({
       "text-anchor": "start",
       font: "12px Monaco, monospace"
@@ -368,6 +368,7 @@
     idText.attr({
       fill: "#AAA"
     });
+    messageText.node.style["white-space"] = "pre";
     this.textWrap(messageText, boxWidth - 50);
     rect = this.rect(x - 10, y - 10, boxWidth, 100, 4).attr({
       fill: "#FFF",
@@ -404,16 +405,21 @@
         s.push("\n");
         x = 0;
       }
-      x += word.length * letterWidth;
-      s.push(word + " ");
+      if (word === "\n") {
+        s.push("\n");
+        x = 0;
+      } else {
+        s.push(word + " ");
+        x += word.length * letterWidth;
+      }
     }
     t.attr({
-      text: s.join("")
+      text: s.join("").trim()
     });
     b = t.getBBox();
-    h = Math.abs(b.y2) - Math.abs(b.y) + 1;
+    h = Math.abs(b.y2) + 1;
     return t.attr({
-      y: b.y + h
+      y: h
     });
   };