Show flattened columns as extra columns in UI (#12524)

* Show each dimension as seperate column in html tables for flattened reports

* set default columns

* rename first dimension column for flattened reports to label

* modify rows right before rendering to prevent plugins to overwrite the displayed columns again

* Use datatable config to allow splitting dimensions into separate columns

* Hide datatable option if report has only one dimension

* ensure to add only needed metric dimensions

* adds ui test

* reorder datatable options

* Add additional columns before generic filters are applied to make sorting of those columns possible

* Improve table layout with multipe label columns

* show logo only in first column

* Add new metadata so the original combine label is still available for row actions

* improve check for multiple lables

* show row action always in last label column

* updates UI file

* fix Others handling for flattened reports

* ensure label translation is set correctly

* show concatenated dimension names as flatten report label

* search combined labels in flattened tables showing dimensions separately

* more ui tests

* fix handling of summary row for concatenated dimensions

* updates expected test files

* fix insights layout

* fix realtime visits table layout

* fix ui tests

* ensure dimensions have correct display order

5 files changed, 109 insertions, 2 deletions

diff --git a/plugins/CoreVisualizations/Visualizations/HtmlTable.php b/plugins/CoreVisualizations/Visualizations/HtmlTable.php
index 2fa6e6674b..a305c12538 100644
--- a/plugins/CoreVisualizations/Visualizations/HtmlTable.php
+++ b/plugins/CoreVisualizations/Visualizations/HtmlTable.php
@@ -9,9 +9,11 @@
 namespace Piwik\Plugins\CoreVisualizations\Visualizations;
 
 use Piwik\API\Request as ApiRequest;
+use Piwik\Columns\Dimension;
 use Piwik\Common;
 use Piwik\DataTable\Row;
 use Piwik\Metrics;
+use Piwik\DataTable;
 use Piwik\Period;
 use Piwik\Plugin\Visualization;
 
@@ -93,6 +95,55 @@ class HtmlTable extends Visualization
         if ($this->isPivoted()) {
             $this->config->columns_to_display = $this->dataTable->getColumns();
         }
+
+        // Note: This needs to be done right before rendering, as otherwise some plugins might change the columns to display again
+        if ($this->isFlattened()) {
+            $dimensions = $this->dataTable->getMetadata('dimensions');
+
+            $hasMultipleDimensions = is_array($dimensions) && count($dimensions) > 1;
+            $this->assignTemplateVar('hasMultipleDimensions', $hasMultipleDimensions);
+
+            if ($hasMultipleDimensions) {
+                if ($this->config->show_dimensions) {
+                    // ensure first metric translation is used as label if other dimensions are in separate columns
+                    $this->config->addTranslation('label', $this->config->translations[reset($dimensions)]);
+                } else {
+                    // concatenate dimensions if table is shown flattened
+                    foreach ($dimensions as $dimension) {
+                        $labels[] = $this->config->translations[$dimension];
+                    }
+                    $this->config->addTranslation('label', implode(' - ', $labels));
+                }
+            }
+
+            if ($this->config->show_dimensions && $hasMultipleDimensions) {
+
+
+                $properties = $this->config;
+                array_shift($dimensions); // shift away first dimension, as that will be shown as label
+
+                $this->dataTable->filter(function (DataTable $dataTable) use ($properties, $dimensions) {
+                    if (empty($properties->columns_to_display)) {
+                        $columns           = $dataTable->getColumns();
+                        $hasNbVisits       = in_array('nb_visits', $columns);
+                        $hasNbUniqVisitors = in_array('nb_uniq_visitors', $columns);
+
+                        $properties->setDefaultColumnsToDisplay($columns, $hasNbVisits, $hasNbUniqVisitors);
+                    }
+
+                    $label = array_search('label', $properties->columns_to_display);
+                    if ($label !== false) {
+                        unset($properties->columns_to_display[$label]);
+                    }
+
+                    foreach (array_reverse($dimensions) as $dimension) {
+                        array_unshift($properties->columns_to_display, $dimension);
+                    }
+
+                    array_unshift($properties->columns_to_display, 'label');
+                });
+            }
+        }
     }
 
     public function beforeGenericFiltersAreAppliedToLoadedDataTable()
@@ -104,6 +155,44 @@ class HtmlTable extends Visualization
         }
 
         parent::beforeGenericFiltersAreAppliedToLoadedDataTable();
+
+        // Note: This needs to be done right before generic filter are applied, to make sorting such columns possible
+        if ($this->isFlattened()) {
+            $dimensions = $this->dataTable->getMetadata('dimensions');
+
+            $hasMultipleDimensions = is_array($dimensions) && count($dimensions) > 1;
+
+            if ($hasMultipleDimensions) {
+                foreach (Dimension::getAllDimensions() as $dimension) {
+                    $dimensionId = str_replace('.', '_', $dimension->getId());
+                    $dimensionName = $dimension->getName();
+
+                    if (!empty($dimensionId) && !empty($dimensionName) && in_array($dimensionId, $dimensions)) {
+                        $this->config->translations[$dimensionId] = $dimensionName;
+                    }
+                }
+            }
+
+
+            if ($this->config->show_dimensions && $hasMultipleDimensions) {
+
+                $this->dataTable->filter(function($dataTable) use ($dimensions) {
+                    /** @var DataTable $dataTable */
+                    $rows = $dataTable->getRows();
+                    foreach ($rows as $row) {
+                        foreach ($dimensions as $dimension) {
+                            $row->setColumn($dimension, $row->getMetadata($dimension));
+                        }
+                    }
+                });
+
+                # replace original label column with first dimension
+                $firstDimension = array_shift($dimensions);
+                $this->dataTable->filter('ColumnCallbackAddMetadata', array('label', 'combinedLabel', function ($label) { return $label; }));
+                $this->dataTable->filter('ColumnDelete', array('label'));
+                $this->dataTable->filter('ReplaceColumnNames', array(array($firstDimension => 'label')));
+            }
+        }
     }
 
     protected function isPivoted()
@@ -122,4 +211,9 @@ class HtmlTable extends Visualization
     {
         return null;
     }
+
+    protected function isFlattened()
+    {
+        return $this->requestConfig->flat || Common::getRequestVar('flat', '');
+    }
 }
diff --git a/plugins/CoreVisualizations/Visualizations/HtmlTable/AllColumns.php b/plugins/CoreVisualizations/Visualizations/HtmlTable/AllColumns.php
index 9f754eccc4..d3221acb8f 100644
--- a/plugins/CoreVisualizations/Visualizations/HtmlTable/AllColumns.php
+++ b/plugins/CoreVisualizations/Visualizations/HtmlTable/AllColumns.php
@@ -63,6 +63,8 @@ class AllColumns extends HtmlTable
 
             $properties->columns_to_display = $columnsToDisplay;
         });
+
+        parent::beforeGenericFiltersAreAppliedToLoadedDataTable();
     }
 
     public function beforeLoadDataTable()
diff --git a/plugins/CoreVisualizations/Visualizations/HtmlTable/Config.php b/plugins/CoreVisualizations/Visualizations/HtmlTable/Config.php
index ba39a66c0f..94de8f18b3 100644
--- a/plugins/CoreVisualizations/Visualizations/HtmlTable/Config.php
+++ b/plugins/CoreVisualizations/Visualizations/HtmlTable/Config.php
@@ -9,6 +9,7 @@
 
 namespace Piwik\Plugins\CoreVisualizations\Visualizations\HtmlTable;
 
+use Piwik\Columns\Dimension;
 use Piwik\ViewDataTable\Config as VisualizationConfig;
 
 /**
@@ -100,6 +101,12 @@ class Config extends VisualizationConfig
      */
     public $report_ratio_columns = array();
 
+    /**
+     * If true, dimensions in flattened reports will be shown as separate columns
+     * @var bool
+     */
+    public $show_dimensions = false;
+
     public function __construct()
     {
         parent::__construct();
@@ -115,6 +122,7 @@ class Config extends VisualizationConfig
             'enable_sort',
             'keep_summary_row',
             'subtable_controller_action',
+            'show_dimensions',
         ));
 
         $this->addPropertiesThatCanBeOverwrittenByQueryParams(array(
@@ -126,6 +134,7 @@ class Config extends VisualizationConfig
             'disable_subtable_when_show_goals',
             'keep_summary_row',
             'highlight_summary_row',
+            'show_dimensions',
         ));
     }
 
diff --git a/plugins/CoreVisualizations/Visualizations/HtmlTable/RequestConfig.php b/plugins/CoreVisualizations/Visualizations/HtmlTable/RequestConfig.php
index dde538219c..804568bf08 100644
--- a/plugins/CoreVisualizations/Visualizations/HtmlTable/RequestConfig.php
+++ b/plugins/CoreVisualizations/Visualizations/HtmlTable/RequestConfig.php
@@ -58,12 +58,14 @@ class RequestConfig extends VisualizationRequestConfig
             'filter_sort_column',
             'filter_sort_order',
             'keep_summary_row',
-            'keep_totals_row'
+            'keep_totals_row',
+            'show_dimensions'
         ));
 
         $this->addPropertiesThatCanBeOverwrittenByQueryParams(array(
             'keep_summary_row',
             'keep_totals_row',
+            'show_dimensions',
         ));
     }
 
diff --git a/plugins/CoreVisualizations/templates/_dataTableViz_htmlTable.twig b/plugins/CoreVisualizations/templates/_dataTableViz_htmlTable.twig
index 10c28ff40b..c4b4659e03 100644
--- a/plugins/CoreVisualizations/templates/_dataTableViz_htmlTable.twig
+++ b/plugins/CoreVisualizations/templates/_dataTableViz_htmlTable.twig
@@ -21,7 +21,7 @@
             {%- for rowId, row in dataTable.getRows() -%}
                 {%- set rowHasSubtable = not subtablesAreDisabled and row.getIdSubDataTable() and properties.subtable_controller_action is not null -%}
                 {%- set rowSubtableId = row.getMetadata('idsubdatatable_in_db')|default(row.getIdSubDataTable()) -%}
-                {%- set isSummaryRow = rowId == constant('Piwik\\DataTable::ID_SUMMARY_ROW') -%}
+                {%- set isSummaryRow = rowId == constant('Piwik\\DataTable::ID_SUMMARY_ROW') or row.getMetadata('is_summary') -%}
                 {%- set shouldHighlightRow = isSummaryRow and properties.highlight_summary_row -%}
 
                 {# display this row if it doesn't have a subtable or if we don't replace the row with the subtable #}