From 6be3e3639c4ab41af9f494433a34dcb5862e7a64 Mon Sep 17 00:00:00 2001 From: Paul Weidner Date: Fri, 25 Aug 2023 11:37:10 -0700 Subject: [PATCH 1/6] Render metrics in small buttons --- modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php b/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php index d3ae73bc5..ce858d451 100644 --- a/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php +++ b/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php @@ -153,7 +153,7 @@ class FarmMetricsBlock extends BlockBase implements ContainerFactoryPluginInterf $count = $query->count()->execute(); $route_name = "view.farm_$entity_type.page_type"; - $metrics[] = Link::createFromRoute($bundle_info['label'] . ': ' . $count, $route_name, ['arg_0' => $bundle], ['attributes' => ['class' => ['metric', 'button']]])->toString(); + $metrics[] = Link::createFromRoute($bundle_info['label'] . ': ' . $count, $route_name, ['arg_0' => $bundle], ['attributes' => ['class' => ['metric', 'button', 'button--small']]])->toString(); } return $metrics; From 1b6b46ab9a5b4c461ea6e3ed20284e6edaa693fb Mon Sep 17 00:00:00 2001 From: Paul Weidner Date: Fri, 25 Aug 2023 11:37:32 -0700 Subject: [PATCH 2/6] Render entity labels using h6 tag --- .../src/Plugin/Block/FarmMetricsBlock.php | 32 +++++++++++-------- 1 file changed, 18 insertions(+), 14 deletions(-) diff --git a/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php b/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php index ce858d451..538d9ce0f 100644 --- a/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php +++ b/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php @@ -74,13 +74,15 @@ class FarmMetricsBlock extends BlockBase implements ContainerFactoryPluginInterf // Create a container for asset metrics. $assets_label = $this->entityTypeManager->getStorage('asset')->getEntityType()->getCollectionLabel(); - $output['asset'] = [ - '#markup' => '' . Link::createFromRoute($assets_label, 'view.farm_asset.page')->toString() . ' (' . $this->t('active') . ')', - 'metrics' => [ - '#type' => 'container', - '#attributes' => [ - 'class' => 'assets metrics-container', - ], + $output['asset']['label'] = [ + '#type' => 'html_tag', + '#tag' => 'h6', + '#value' => Link::createFromRoute($assets_label, 'view.farm_asset.page')->toString() . ' (' . $this->t('active') . ')', + ]; + $output['asset']['metrics'] = [ + '#type' => 'container', + '#attributes' => [ + 'class' => 'assets metrics-container', ], ]; $metrics = $this->getEntityMetrics('asset'); @@ -97,13 +99,15 @@ class FarmMetricsBlock extends BlockBase implements ContainerFactoryPluginInterf // Create a section for log metrics. $logs_label = $this->entityTypeManager->getStorage('log')->getEntityType()->getCollectionLabel(); - $output['log'] = [ - '#markup' => '' . Link::createFromRoute($logs_label, 'view.farm_log.page')->toString() . '', - 'metrics' => [ - '#type' => 'container', - '#attributes' => [ - 'class' => 'logs metrics-container', - ], + $output['log']['label'] = [ + '#type' => 'html_tag', + '#tag' => 'h6', + '#value' => Link::createFromRoute($logs_label, 'view.farm_log.page')->toString(), + ]; + $output['log']['metrics'] = [ + '#type' => 'container', + '#attributes' => [ + 'class' => 'logs metrics-container', ], ]; $metrics = $this->getEntityMetrics('log'); From 9b8eb314cc3d202b95d71b54465a091189cde20c Mon Sep 17 00:00:00 2001 From: Paul Weidner Date: Fri, 25 Aug 2023 11:38:25 -0700 Subject: [PATCH 3/6] Class attributes is an array --- modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php b/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php index 538d9ce0f..4c4bf92dd 100644 --- a/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php +++ b/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php @@ -82,7 +82,7 @@ class FarmMetricsBlock extends BlockBase implements ContainerFactoryPluginInterf $output['asset']['metrics'] = [ '#type' => 'container', '#attributes' => [ - 'class' => 'assets metrics-container', + 'class' => ['assets', 'metrics-container'], ], ]; $metrics = $this->getEntityMetrics('asset'); @@ -107,7 +107,7 @@ class FarmMetricsBlock extends BlockBase implements ContainerFactoryPluginInterf $output['log']['metrics'] = [ '#type' => 'container', '#attributes' => [ - 'class' => 'logs metrics-container', + 'class' => ['logs', 'metrics-container'], ], ]; $metrics = $this->getEntityMetrics('log'); From 91a6fccf85424768d2fdf439e4eb26dc5f885966 Mon Sep 17 00:00:00 2001 From: Paul Weidner Date: Fri, 25 Aug 2023 11:39:18 -0700 Subject: [PATCH 4/6] Use flexbox to manage metric button spacing --- modules/core/ui/metrics/css/metrics_block.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/modules/core/ui/metrics/css/metrics_block.css b/modules/core/ui/metrics/css/metrics_block.css index d80d2c659..5b30d9f9f 100644 --- a/modules/core/ui/metrics/css/metrics_block.css +++ b/modules/core/ui/metrics/css/metrics_block.css @@ -1,4 +1,12 @@ .metrics-container { + margin-top: .5em; display: flex; flex-flow: row wrap; + gap: .25em .5em; +} + +.metrics-container a.metric { + flex-basis: 20%; + margin: 0; + white-space: nowrap; } From 4ef19c79ce9fe62962b2321a5214c5a29123f3a8 Mon Sep 17 00:00:00 2001 From: Paul Weidner Date: Wed, 6 Sep 2023 17:34:40 -0700 Subject: [PATCH 5/6] Render metrics using item_list theme --- modules/core/ui/metrics/css/metrics_block.css | 4 +- .../src/Plugin/Block/FarmMetricsBlock.php | 78 ++++++++----------- 2 files changed, 33 insertions(+), 49 deletions(-) diff --git a/modules/core/ui/metrics/css/metrics_block.css b/modules/core/ui/metrics/css/metrics_block.css index 5b30d9f9f..cacd8aade 100644 --- a/modules/core/ui/metrics/css/metrics_block.css +++ b/modules/core/ui/metrics/css/metrics_block.css @@ -1,5 +1,4 @@ -.metrics-container { - margin-top: .5em; +.metrics-container ul { display: flex; flex-flow: row wrap; gap: .25em .5em; @@ -7,6 +6,5 @@ .metrics-container a.metric { flex-basis: 20%; - margin: 0; white-space: nowrap; } diff --git a/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php b/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php index 4c4bf92dd..0d0311030 100644 --- a/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php +++ b/modules/core/ui/metrics/src/Plugin/Block/FarmMetricsBlock.php @@ -72,55 +72,41 @@ class FarmMetricsBlock extends BlockBase implements ContainerFactoryPluginInterf public function build() { $output = []; - // Create a container for asset metrics. - $assets_label = $this->entityTypeManager->getStorage('asset')->getEntityType()->getCollectionLabel(); - $output['asset']['label'] = [ - '#type' => 'html_tag', - '#tag' => 'h6', - '#value' => Link::createFromRoute($assets_label, 'view.farm_asset.page')->toString() . ' (' . $this->t('active') . ')', - ]; - $output['asset']['metrics'] = [ - '#type' => 'container', - '#attributes' => [ + // Create a list of asset metrics. + $assets_label = $this->entityTypeManager->getStorage('asset')->getEntityType()->getCollectionLabel() . ' (' . $this->t('active') . ')'; + $output['asset'] = [ + '#theme' => 'item_list', + '#title' => Link::createFromRoute($assets_label, 'view.farm_asset.page')->toRenderable(), + '#items' => $this->getEntityMetrics('asset'), + '#empty' => $this->t('No assets found.'), + '#wrapper_attributes' => [ 'class' => ['assets', 'metrics-container'], ], - ]; - $metrics = $this->getEntityMetrics('asset'); - foreach ($metrics as $metric) { - $output['asset']['metrics'][] = [ - '#markup' => $metric, - ]; - } - if (empty($metrics)) { - $output['asset']['metrics']['empty']['#markup'] = '

' . $this->t('No assets found.') . '

'; - } - $output['#cache']['tags'][] = 'asset_list'; - $output['#cache']['tags'][] = 'config:asset_type_list'; - - // Create a section for log metrics. - $logs_label = $this->entityTypeManager->getStorage('log')->getEntityType()->getCollectionLabel(); - $output['log']['label'] = [ - '#type' => 'html_tag', - '#tag' => 'h6', - '#value' => Link::createFromRoute($logs_label, 'view.farm_log.page')->toString(), - ]; - $output['log']['metrics'] = [ - '#type' => 'container', - '#attributes' => [ - 'class' => ['logs', 'metrics-container'], + '#cache' => [ + 'tags' => [ + 'asset_list', + 'config:asset_type_list', + ], + ], + ]; + + // Create a list of log metrics. + $logs_label = $this->entityTypeManager->getStorage('log')->getEntityType()->getCollectionLabel(); + $output['log'] = [ + '#theme' => 'item_list', + '#title' => Link::createFromRoute($logs_label, 'view.farm_log.page')->toRenderable(), + '#items' => $this->getEntityMetrics('log'), + '#empty' => $this->t('No logs found.'), + '#wrapper_attributes' => [ + 'class' => ['logs', 'metrics-container'], + ], + '#cache' => [ + 'tags' => [ + 'log_list', + 'config:log_type_list', + ], ], ]; - $metrics = $this->getEntityMetrics('log'); - foreach ($metrics as $metric) { - $output['log']['metrics'][] = [ - '#markup' => $metric, - ]; - } - if (empty($metrics)) { - $output['log']['metrics']['empty']['#markup'] = '

' . $this->t('No logs found.') . '

'; - } - $output['#cache']['tags'][] = 'log_list'; - $output['#cache']['tags'][] = 'config:log_type_list'; // Attach CSS. $output['#attached']['library'][] = 'farm_ui_metrics/metrics_block'; @@ -157,7 +143,7 @@ class FarmMetricsBlock extends BlockBase implements ContainerFactoryPluginInterf $count = $query->count()->execute(); $route_name = "view.farm_$entity_type.page_type"; - $metrics[] = Link::createFromRoute($bundle_info['label'] . ': ' . $count, $route_name, ['arg_0' => $bundle], ['attributes' => ['class' => ['metric', 'button', 'button--small']]])->toString(); + $metrics[] = Link::createFromRoute($bundle_info['label'] . ': ' . $count, $route_name, ['arg_0' => $bundle], ['attributes' => ['class' => ['metric']]])->toRenderable(); } return $metrics; From ec51dfaff6c731f08b791438bc8fa8b896695c16 Mon Sep 17 00:00:00 2001 From: Michael Stenta Date: Thu, 5 Oct 2023 10:23:43 -0400 Subject: [PATCH 6/6] Add CHANGELOG.md line for #711. --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 51bf9d04d..827777578 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -19,6 +19,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed - [Dashboard improvements #712](https://github.com/farmOS/farmOS/pull/712) +- [Condense metrics UI #711](https://github.com/farmOS/farmOS/pull/711) - [Misc quick form code and documentation improvements #703](https://github.com/farmOS/farmOS/pull/703) ### Deprecated