From db3807655a4d9b6e773fe96ed0b1f131f274b0f0 Mon Sep 17 00:00:00 2001
From: Drew Banin <drew@fishtownanalytics.com>
Date: Sun, 1 Mar 2020 21:33:49 -0500
Subject: [PATCH] render `meta` field in docs

---
 .../column_details/column_details.html        | 16 ++++++++++-
 .../column_details/column_details.js          |  3 +-
 .../table_details/table_details.html          | 28 +++++++------------
 .../components/table_details/table_details.js | 13 +++++++++
 src/app/docs/model.html                       |  2 +-
 5 files changed, 41 insertions(+), 21 deletions(-)

diff --git a/src/app/components/column_details/column_details.html b/src/app/components/column_details/column_details.html
index d737c5c05..9bc6ae9c4 100644
--- a/src/app/components/column_details/column_details.html
+++ b/src/app/components/column_details/column_details.html
@@ -57,7 +57,21 @@
                     <tr ng-repeat-end ng-show="column.expanded" style="background-color: white; padding: 10px">
                         <td colspan="5" class="column-expanded">
                             <div style="padding: 5px 20px">
-                                <div style="margin-bottom: 15px">
+                                <div ng-show="column.meta">
+                                    <h5>Details</h5>
+                                    <div class="detail-group" style="padding-bottom: 0">
+                                        <div class="detail-body" style="padding-left: 0">
+                                            <dl class="detail"
+                                                ng-style="{'padding-left': $index == 0 ? 0 : 'auto'}"
+                                                ng-repeat="(k, v) in column.meta">
+                                                <dt class="detail-label">{{ k }}</dt>
+                                                <dd class="detail-value">{{ v }}</dd>
+                                            </dl>
+                                        </div>
+                                    </div>
+                                </div>
+
+                                <div style="margin-bottom: 15px" ng-if="column.description.length">
                                     <h5>Description</h5>
                                     <span marked="column.description"></span>
                                 </div>
diff --git a/src/app/components/column_details/column_details.js b/src/app/components/column_details/column_details.js
index a7efe9173..4f68a1f41 100644
--- a/src/app/components/column_details/column_details.js
+++ b/src/app/components/column_details/column_details.js
@@ -22,8 +22,9 @@ angular
             scope.has_more_info = function(column) {
                 var tests = (column.tests || []);
                 var description = (column.description || "");
+                var meta = (column.meta || {});
 
-                return tests.length || description.length;
+                return tests.length || description.length || !_.isEmpty(meta);
             }
 
             scope.toggle_column_expanded = function(column) {
diff --git a/src/app/components/table_details/table_details.html b/src/app/components/table_details/table_details.html
index 02ae851b4..1c7870e6c 100644
--- a/src/app/components/table_details/table_details.html
+++ b/src/app/components/table_details/table_details.html
@@ -4,12 +4,16 @@ <h6>Details</h6>
         <div class="panel-body">
             <div class="details">
                 <div class="details-content">
-                    <div class="detail-group">
-                        <!--
-                        <div class="detail-header">
-                            <h6 class="detail-label">Details</h6>
+                    <div class="detail-group" ng-if="hasData(meta)">
+                        <div class="detail-body">
+                            <dl class="detail"
+                                ng-repeat="(k, v) in meta">
+                                <dt class="detail-label">{{ k }}</dt>
+                                <dd class="detail-value">{{ v }}</dd>
+                            </dl>
                         </div>
-                        -->
+                    </div>
+                    <div class="detail-group">
                         <div class="detail-body">
                             <dl class='detail' ng-if="model.tags != undefined">
                                 <dt class="detail-label">Tags</dt>
@@ -23,21 +27,9 @@ <h6 class="detail-label">Details</h6>
                                 <dt class="detail-label">{{ item.name }}</dt>
                                 <dd class="detail-value">{{ item.value }}</dd>
                             </dl>
-                            <dl class="detail" ng-if="show_extended">
-                                <dt class="detail-label">Advanced</dt>
-                                <dd class="detail-value">
-                                    <a ng-show="!show_expanded()" ng-click="show_expanded(true)">Show</a>
-                                    <a ng-show="show_expanded()"  ng-click="show_expanded(false)">Hide</a>
-                                </dd>
-                            </dl>
                         </div>
                     </div>
-                    <div class="detail-group" ng-if="show_extended && show_expanded()">
-                        <!--
-                        <div class="detail-header">
-                            <h6 class="detail-label">Table</h6>
-                        </div>
-                        -->
+                    <div class="detail-group" ng-if="hasData(extended)">
                         <div class="detail-body">
                             <dl class="detail"
                                 ng-repeat="item in extended"
diff --git a/src/app/components/table_details/table_details.js b/src/app/components/table_details/table_details.js
index a68694abe..e178f64db 100644
--- a/src/app/components/table_details/table_details.js
+++ b/src/app/components/table_details/table_details.js
@@ -18,6 +18,7 @@ angular
 
             scope.details = [];
             scope.extended = [];
+            scope.meta = null;
             scope._show_expanded = false;
 
             scope.show_expanded = function(v) {
@@ -27,6 +28,16 @@ angular
                 return scope._show_expanded;
             }
 
+            scope.hasData = function(data) {
+                if (!data || _.isEmpty(data)) {
+                    return false;
+                } else if (data.length == 1 && data[0].include == false) {
+                    return false;
+                }
+
+                return true;
+            }
+
             function asBytes(bytes, precision) {
                 if (bytes == 0) {
                     return '0 bytes';
@@ -128,6 +139,8 @@ angular
                 var get_type = _.property(['metadata', 'type'])
                 var rel_type = get_type(nv);
 
+                scope.meta = nv.meta || null;
+
                 scope.details = getBaseStats(nv);
                 scope.extended = getExtendedStats(nv.stats);
 
diff --git a/src/app/docs/model.html b/src/app/docs/model.html
index 2d09752d1..d71f7f3ba 100644
--- a/src/app/docs/model.html
+++ b/src/app/docs/model.html
@@ -44,7 +44,7 @@ <h1>
         <div class="app-frame app-pad">
             <section class="section">
                 <div class="section-target" id="details"></div>
-                <table-details model="model" />
+                <table-details model="model"></table-details>
             </section>
 
             <section class="section">