From 9b1de3cfb4a73fd176daa7ae794d11ff9809e33f Mon Sep 17 00:00:00 2001
From: Florian Scholdei <florian.scholdei@cloudogu.com>
Date: Wed, 12 Dec 2018 17:14:21 +0100
Subject: [PATCH 1/4] started impementation of wordbreak for table

---
 scm-ui/src/repos/sources/components/FileTreeLeaf.js | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/scm-ui/src/repos/sources/components/FileTreeLeaf.js b/scm-ui/src/repos/sources/components/FileTreeLeaf.js
index b4e2ad59ea..36bd734d11 100644
--- a/scm-ui/src/repos/sources/components/FileTreeLeaf.js
+++ b/scm-ui/src/repos/sources/components/FileTreeLeaf.js
@@ -10,6 +10,13 @@ import type { File } from "@scm-manager/ui-types";
 const styles = {
   iconColumn: {
     width: "16px"
+  },
+  wordBreakTable: {
+    WebkitHyphens: "auto",
+    MozHyphens: "auto",
+    MsHyphens: "auto",
+    hyphens: "auto",
+    wordBreak: "auto"
   }
 };
 
@@ -71,7 +78,7 @@ class FileTreeLeaf extends React.Component<Props> {
     return (
       <tr>
         <td className={classes.iconColumn}>{this.createFileIcon(file)}</td>
-        <td>{this.createFileName(file)}</td>
+        <td className={classes.wordBreakTable}>{this.createFileName(file)}</td>
         <td className="is-hidden-mobile">{fileSize}</td>
         <td className="is-hidden-mobile">
           <DateFromNow date={file.lastModified} />

From 044a60c7c94a2bfd965ddc50df9bd4046f44d89c Mon Sep 17 00:00:00 2001
From: Florian Scholdei <florian.scholdei@cloudogu.com>
Date: Fri, 14 Dec 2018 10:42:20 +0100
Subject: [PATCH 2/4] implemented word-break for column

---
 scm-ui/src/repos/sources/components/FileTreeLeaf.js | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/scm-ui/src/repos/sources/components/FileTreeLeaf.js b/scm-ui/src/repos/sources/components/FileTreeLeaf.js
index 36bd734d11..f7f9feb52e 100644
--- a/scm-ui/src/repos/sources/components/FileTreeLeaf.js
+++ b/scm-ui/src/repos/sources/components/FileTreeLeaf.js
@@ -11,12 +11,13 @@ const styles = {
   iconColumn: {
     width: "16px"
   },
-  wordBreakTable: {
+  wordBreakColumn: {
     WebkitHyphens: "auto",
     MozHyphens: "auto",
     MsHyphens: "auto",
     hyphens: "auto",
-    wordBreak: "auto"
+    wordBreak: "break-all",
+    minWidth: "10em"
   }
 };
 
@@ -78,12 +79,12 @@ class FileTreeLeaf extends React.Component<Props> {
     return (
       <tr>
         <td className={classes.iconColumn}>{this.createFileIcon(file)}</td>
-        <td className={classes.wordBreakTable}>{this.createFileName(file)}</td>
+        <td className={classes.wordBreakColumn}>{this.createFileName(file)}</td>
         <td className="is-hidden-mobile">{fileSize}</td>
         <td className="is-hidden-mobile">
           <DateFromNow date={file.lastModified} />
         </td>
-        <td>{file.description}</td>
+        <td className={classes.wordBreakColumn}>{file.description}</td>
       </tr>
     );
   }

From 30c9b87cd3d7be614bd8188fc0d5734a0ead09e5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Maren=20S=C3=BCwer?= <maren.suewer@cloudogu.com>
Date: Wed, 19 Dec 2018 08:40:04 +0100
Subject: [PATCH 3/4] added is-clipped class, and show description not at
 mobile view

---
 scm-ui/src/repos/containers/RepositoryRoot.js       | 2 +-
 scm-ui/src/repos/sources/components/FileTree.js     | 4 +++-
 scm-ui/src/repos/sources/components/FileTreeLeaf.js | 5 ++++-
 3 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/scm-ui/src/repos/containers/RepositoryRoot.js b/scm-ui/src/repos/containers/RepositoryRoot.js
index 81de0296fc..a3f69fe70b 100644
--- a/scm-ui/src/repos/containers/RepositoryRoot.js
+++ b/scm-ui/src/repos/containers/RepositoryRoot.js
@@ -114,7 +114,7 @@ class RepositoryRoot extends React.Component<Props> {
     return (
       <Page title={repository.namespace + "/" + repository.name}>
         <div className="columns">
-          <div className="column is-three-quarters">
+          <div className="column is-three-quarters is-clipped">
             <Switch>
               <Route
                 path={url}
diff --git a/scm-ui/src/repos/sources/components/FileTree.js b/scm-ui/src/repos/sources/components/FileTree.js
index 1dd11870ae..cbe03df62f 100644
--- a/scm-ui/src/repos/sources/components/FileTree.js
+++ b/scm-ui/src/repos/sources/components/FileTree.js
@@ -119,7 +119,9 @@ class FileTree extends React.Component<Props> {
             <th className="is-hidden-mobile">
               {t("sources.file-tree.lastModified")}
             </th>
-            <th>{t("sources.file-tree.description")}</th>
+            <th className="is-hidden-mobile">
+              {t("sources.file-tree.description")}
+            </th>
           </tr>
         </thead>
         <tbody>
diff --git a/scm-ui/src/repos/sources/components/FileTreeLeaf.js b/scm-ui/src/repos/sources/components/FileTreeLeaf.js
index f7f9feb52e..724a80e742 100644
--- a/scm-ui/src/repos/sources/components/FileTreeLeaf.js
+++ b/scm-ui/src/repos/sources/components/FileTreeLeaf.js
@@ -6,6 +6,7 @@ import FileSize from "./FileSize";
 import FileIcon from "./FileIcon";
 import { Link } from "react-router-dom";
 import type { File } from "@scm-manager/ui-types";
+import classNames from "classnames";
 
 const styles = {
   iconColumn: {
@@ -84,7 +85,9 @@ class FileTreeLeaf extends React.Component<Props> {
         <td className="is-hidden-mobile">
           <DateFromNow date={file.lastModified} />
         </td>
-        <td className={classes.wordBreakColumn}>{file.description}</td>
+        <td className={classNames(classes.wordBreakColumn, "is-hidden-mobile")}>
+          {file.description}
+        </td>
       </tr>
     );
   }

From 0d8e0fef8e6fdf7d2afb7555729f52b1482ee151 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Maren=20S=C3=BCwer?= <maren.suewer@cloudogu.com>
Date: Wed, 19 Dec 2018 08:26:50 +0000
Subject: [PATCH 4/4] Close branch bug/table_navi_overflow