wip17242-datatable-header-wordwrap

3 files changed, 34 insertions, 2 deletions

diff --git a/core/Twig.php b/core/Twig.php
index 83bde2275e..3a079e4052 100644
--- a/core/Twig.php
+++ b/core/Twig.php
@@ -183,6 +183,7 @@ class Twig
         $this->addFilter_safelink();
         $this->addFilter_implode();
         $this->addFilter_wordTruncate();
+        $this->addFilter_wordwrap();
         $this->twig->addFilter(new TwigFilter('ucwords', 'ucwords'));
         $this->twig->addFilter(new TwigFilter('lcfirst', 'lcfirst'));
         $this->twig->addFilter(new TwigFilter('ucfirst', 'ucfirst'));
@@ -612,7 +613,29 @@ class Twig
         $this->twig->addFilter($implode);
     }
 
-    function addFilter_wordTruncate()
+    public function addFilter_wordwrap()
+    {
+        $wordwrapFilter = new TwigFilter('wordwrap', function ($value, $length = 8, $separator = '-') {
+            // return wordwrap($value, $length, $separator, true);
+            $sentences = [];
+            $pieces = mb_split($separator, $value);
+
+            foreach ($pieces as $piece) {
+                while (mb_strlen($piece) > $length) {
+                    $sentences[] = mb_substr($piece, 0, $length);
+                    $piece = mb_substr($piece, $length, 2048);
+                }
+
+                $sentences[] = $piece;
+            }
+
+            return implode($separator, $sentences);
+        });
+
+        $this->twig->addFilter($wordwrapFilter);
+    }
+
+    private function addFilter_wordTruncate()
     {
         $wordtruncateFilter = new TwigFilter('wordtruncate', function ($value, $limit = 8, $append = '…') {
             $words = explode(' ', $value);
diff --git a/plugins/CoreHome/templates/_dataTableHead.twig b/plugins/CoreHome/templates/_dataTableHead.twig
index e0e4175994..01bd54fbb2 100644
--- a/plugins/CoreHome/templates/_dataTableHead.twig
+++ b/plugins/CoreHome/templates/_dataTableHead.twig
@@ -12,7 +12,7 @@
                        {{ properties.metrics_documentation[column]|rawSafeDecoded|raw }}
                    </div>
                {% endif %}
-               <div id="thDIV" class="thDIV">{{ properties.translations[column]|default(column)|rawSafeDecoded|wordtruncate|raw }}</div>
+               <div id="thDIV" class="thDIV hyphenate">{{ properties.translations[column]|default(column)|rawSafeDecoded }}</div>
            </th>
        {% endfor %}
    </tr>
diff --git a/plugins/Morpheus/stylesheets/general/_misc.less b/plugins/Morpheus/stylesheets/general/_misc.less
index 4e52afacf4..41c328a4d9 100644
--- a/plugins/Morpheus/stylesheets/general/_misc.less
+++ b/plugins/Morpheus/stylesheets/general/_misc.less
@@ -49,3 +49,12 @@
 .card .card-content {
   padding: 20px;
 }
+
+.hyphenate {
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+
+  -webkit-hyphens: auto;
+  -moz-hyphens: auto;
+  hyphens: auto;
+}