You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@pinot.apache.org by GitBox <gi...@apache.org> on 2021/02/04 20:40:47 UTC

[GitHub] [incubator-pinot] zhangloo333 commented on a change in pull request #6545: [TE]frontend - Change the formatting of metric display in exploration page

zhangloo333 commented on a change in pull request #6545:
URL: https://github.com/apache/incubator-pinot/pull/6545#discussion_r570528578



##########
File path: thirdeye/thirdeye-frontend/app/pods/components/self-serve-alert-yaml-details/template.hbs
##########
@@ -40,58 +40,49 @@
   {{alertData.description}}
 </h4>
 {{#if (not isLoadError)}}
-  <div class="te-alert-detail-breakdown row">
-    <dl class="col-xs-12 col-sm-5 row">
-      <dt class="col-md-4">
-        Metric
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.metric}}>
-        {{if alertData.metric alertData.metric "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Dataset
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.dataset}}>
-        {{if alertData.dataset alertData.dataset "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Filtered By
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.filters}}>
-        {{if alertData.filters alertData.filters "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Breakdown By
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.dimensionExploration}}>
-        {{if alertData.dimensionExploration alertData.dimensionExploration "N/A"}}
-      </dd>
-    </dl>
-    <dl class="col-xs-12 col-sm-5 row">
-      <dt class="col-md-4">
-        Created By
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.createdBy}}>
-        {{if alertData.createdBy alertData.createdBy "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Updated By
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.updatedBy}}>
-        {{if alertData.updatedBy alertData.updatedBy "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Last detection
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.lastDetectionTime}}>
-        {{if alertData.lastDetectionTime alertData.lastDetectionTime "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Subscribed Groups
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{subscribedGroups}}>
-        {{if subscribedGroups subscribedGroups "N/A"}}
-      </dd>
-    </dl>
-  </div>
-{{/if}}
\ No newline at end of file
+<div class="te-alert-detail-breakdown row">
+  <dl class="col-xs-12 col-sm-5 row">
+    <dt class="col-md-4">Metric</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.metric}}>
+      <span>{{if firstMetric firstMetric 'N/A'}}</span>
+      {{#if (gt remainingMetricCount 0)}}
+      <span class="te-search-results__value te-search-results__value--remaining-metric-count">
+        +{{remainingMetricCount}}
+      </span>
+      {{/if}}
+    </dd>
+
+    <dt class="col-md-4">Dataset</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.dataset}}>
+      {{if alertData.dataset alertData.dataset 'N/A'}}
+    </dd>
+
+    <dt class="col-md-4">Filtered By</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.filters}}>
+      {{if alertData.filters alertData.filters 'N/A'}}</dd>
+
+    <dt class="col-md-4">Breakdown By</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.dimensionExploration}}>
+      {{if alertData.dimensionExploration alertData.dimensionExploration 'N/A'}}</dd>

Review comment:
       you could format it to set `dd` on the next line.

##########
File path: thirdeye/thirdeye-frontend/app/pods/components/self-serve-alert-yaml-details/template.hbs
##########
@@ -40,58 +40,49 @@
   {{alertData.description}}
 </h4>
 {{#if (not isLoadError)}}
-  <div class="te-alert-detail-breakdown row">
-    <dl class="col-xs-12 col-sm-5 row">
-      <dt class="col-md-4">
-        Metric
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.metric}}>
-        {{if alertData.metric alertData.metric "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Dataset
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.dataset}}>
-        {{if alertData.dataset alertData.dataset "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Filtered By
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.filters}}>
-        {{if alertData.filters alertData.filters "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Breakdown By
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.dimensionExploration}}>
-        {{if alertData.dimensionExploration alertData.dimensionExploration "N/A"}}
-      </dd>
-    </dl>
-    <dl class="col-xs-12 col-sm-5 row">
-      <dt class="col-md-4">
-        Created By
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.createdBy}}>
-        {{if alertData.createdBy alertData.createdBy "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Updated By
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.updatedBy}}>
-        {{if alertData.updatedBy alertData.updatedBy "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Last detection
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.lastDetectionTime}}>
-        {{if alertData.lastDetectionTime alertData.lastDetectionTime "N/A"}}
-      </dd>
-      <dt class="col-md-4">
-        Subscribed Groups
-      </dt>
-      <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{subscribedGroups}}>
-        {{if subscribedGroups subscribedGroups "N/A"}}
-      </dd>
-    </dl>
-  </div>
-{{/if}}
\ No newline at end of file
+<div class="te-alert-detail-breakdown row">
+  <dl class="col-xs-12 col-sm-5 row">
+    <dt class="col-md-4">Metric</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.metric}}>
+      <span>{{if firstMetric firstMetric 'N/A'}}</span>
+      {{#if (gt remainingMetricCount 0)}}
+      <span class="te-search-results__value te-search-results__value--remaining-metric-count">
+        +{{remainingMetricCount}}
+      </span>
+      {{/if}}
+    </dd>
+
+    <dt class="col-md-4">Dataset</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.dataset}}>
+      {{if alertData.dataset alertData.dataset 'N/A'}}
+    </dd>
+
+    <dt class="col-md-4">Filtered By</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.filters}}>
+      {{if alertData.filters alertData.filters 'N/A'}}</dd>
+
+    <dt class="col-md-4">Breakdown By</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.dimensionExploration}}>
+      {{if alertData.dimensionExploration alertData.dimensionExploration 'N/A'}}</dd>
+  </dl>
+
+  <dl class="col-xs-12 col-sm-5 row">
+    <dt class="col-md-4">Created By</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.createdBy}}>
+      {{if alertData.createdBy alertData.createdBy 'N/A'}}</dd>
+
+    <dt class="col-md-4">Updated By</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.updatedBy}}>
+      {{if alertData.updatedBy alertData.updatedBy 'N/A'}}</dd>
+
+    <dt class="col-md-4">Last detection</dt>
+    <dd class="col-md-8 te-search-results__value{{valueClassSuffix}}" title={{alertData.lastDetectionTime}}>

Review comment:
       you could format it to set `dd` on the next line.

##########
File path: thirdeye/thirdeye-frontend/app/pods/components/self-serve-alert-yaml-details/component.js
##########
@@ -38,6 +39,15 @@ export default Component.extend({
     }
   },
 
+  didReceiveAttrs() {
+    this._super(...arguments);
+
+    const { alertData: { metric: metrics = [] } = {} } = this;
+
+    this.set('firstMetric', metrics[0]);
+    this.set('remainingMetricCount', metrics.length - 1);

Review comment:
       if the metrics is empty, the count should be 0, but it shows -1.




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@pinot.apache.org
For additional commands, e-mail: commits-help@pinot.apache.org