Add consumer rates to consumer view (#180)

* Calculate rate of consumption in table

* Add graph for consumer rate

* fix bug in label overflow

* add graph for producer rate

* Add lag graph

* resolve selectors

* add totals row

* reduce rolling average window

* update changelog

Author: Crim

CHANGELOG.md

@@ -2,11 +2,15 @@
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
-## 2.3.1 (UNRELEASED)
+## 2.4.0 (UNRELEASED)
+#### New Features
+- [PR-180]() Consumer Group inspector now shows average rate of consumption per partition.
+
 #### Bug Fixes
 - [ISSUE-175](https://github.com/SourceLabOrg/kafka-webview/issues/175) Update multi-threaded consumers with unique consumerId [PR](https://github.com/SourceLabOrg/kafka-webview/pull/176).
 - [PR-178](https://github.com/SourceLabOrg/kafka-webview/pull/178) @[lucrito](https://github.com/lucrito) fixed shebang in start.sh script.  Thanks!
 - [PR-179](https://github.com/SourceLabOrg/kafka-webview/pull/179) Streaming consumer now persists consumer state.
+- [PR-180](https://github.com/SourceLabOrg/kafka-webview/pull/180) Adds additional metrics (consume rate, producer rate, lag) and graphs to Consumer details page.
 
 ## 2.3.0 (06/19/2019)
 #### New Features

dev-cluster/pom.xml

@@ -5,12 +5,12 @@
     <parent>
         <artifactId>kafka-webview</artifactId>
         <groupId>org.sourcelab</groupId>
-        <version>2.3.1</version>
+        <version>2.4.0</version>
     </parent>
     <modelVersion>4.0.0</modelVersion>
 
     <artifactId>dev-cluster</artifactId>
-    <version>2.3.1</version>
+    <version>2.4.0</version>
 
     <!-- Require Maven 3.3.9 -->
     <prerequisites>

kafka-webview-plugin/pom.xml

@@ -5,7 +5,7 @@
     <parent>
         <groupId>org.sourcelab</groupId>
         <artifactId>kafka-webview</artifactId>
-        <version>2.3.1</version>
+        <version>2.4.0</version>
     </parent>
     <modelVersion>4.0.0</modelVersion>
     <artifactId>kafka-webview-plugin</artifactId>

kafka-webview-ui/pom.xml

@@ -5,11 +5,11 @@
     <parent>
         <artifactId>kafka-webview</artifactId>
         <groupId>org.sourcelab</groupId>
-        <version>2.3.1</version>
+        <version>2.4.0</version>
     </parent>
     <modelVersion>4.0.0</modelVersion>
     <artifactId>kafka-webview-ui</artifactId>
-    <version>2.3.1</version>
+    <version>2.4.0</version>
 
     <!-- Module Description and Ownership -->
     <name>Kafka WebView UI</name>

kafka-webview-ui/src/main/frontend/js/app.js

@@ -444,6 +444,20 @@ var DateTools = {
 
         return year + '-' + month + '-' + day + ' ' + hour + ':' + min + ':' + sec + DateTools.formatTz(myDate);
     },
+    displayTimeOnly: function(timestampMs) {
+        // Adjusts timestamp into local timezone and locate
+        var myDate = new Date(timestampMs);
+
+        var hour = myDate.getHours();
+        var min = myDate.getMinutes();
+        var sec = myDate.getSeconds();
+
+        hour = (hour < 10 ? "0" : "") + hour;
+        min = (min < 10 ? "0" : "") + min;
+        sec = (sec < 10 ? "0" : "") + sec;
+
+        return hour + ':' + min + ':' + sec;
+    },
     formatTz: function(date) {
         var timezone_offset_min = date.getTimezoneOffset(),
             offset_hrs = parseInt(Math.abs(timezone_offset_min/60)),

kafka-webview-ui/src/main/java/org/sourcelab/kafka/webview/ui/manager/kafka/KafkaOperations.java

@@ -30,7 +30,6 @@
 import org.apache.kafka.clients.admin.ConfigEntry;
 import org.apache.kafka.clients.admin.CreateTopicsResult;
 import org.apache.kafka.clients.admin.DeleteConsumerGroupsResult;
-import org.apache.kafka.clients.admin.DeleteTopicsOptions;
 import org.apache.kafka.clients.admin.DeleteTopicsResult;
 import org.apache.kafka.clients.admin.DescribeConfigsResult;
 import org.apache.kafka.clients.admin.DescribeConsumerGroupsResult;
@@ -506,7 +505,8 @@ public ConsumerGroupOffsetsWithTailPositions getConsumerGroupOffsetsWithTailOffs
         return new ConsumerGroupOffsetsWithTailPositions(
             consumerGroupId,
             consumerGroupOffsets.getTopic(),
-            offsetsWithPartitions
+            offsetsWithPartitions,
+            System.currentTimeMillis()
         );
     }
 

kafka-webview-ui/src/main/java/org/sourcelab/kafka/webview/ui/manager/kafka/dto/ConsumerGroupOffsetsWithTailPositions.java

@@ -41,20 +41,23 @@ public class ConsumerGroupOffsetsWithTailPositions {
     private final String consumerId;
     private final String topic;
     private final Map<Integer, PartitionOffsetWithTailPosition> offsetMap;
+    private final long timestamp;
 
     /**
      * Constructor.
      * @param consumerId id of consumer group.
      * @param topic name of the topic.
      * @param offsets details about each partition and offset.
+     * @param timestamp Timestamp offsets were retrieved.
      */
     public ConsumerGroupOffsetsWithTailPositions(
         final String consumerId,
         final String topic,
-        final Iterable<PartitionOffsetWithTailPosition> offsets
-    ) {
+        final Iterable<PartitionOffsetWithTailPosition> offsets,
+        final long timestamp) {
         this.consumerId = consumerId;
         this.topic = topic;
+        this.timestamp = timestamp;
 
         final Map<Integer, PartitionOffsetWithTailPosition> copiedMap = new HashMap<>();
         for (final PartitionOffsetWithTailPosition offset : offsets) {
@@ -74,6 +77,10 @@ public String getTopic() {
         return topic;
     }
 
+    public long getTimestamp() {
+        return timestamp;
+    }
+
     /**
      * Marked private to keep from being serialized in responses.
      */
@@ -143,6 +150,7 @@ public String toString() {
         return "ConsumerGroupOffsetsWithTailPositions{"
             + "consumerId='" + consumerId + '\''
             + ", topic='" + topic + '\''
+            + ", timestamp='" + timestamp + '\''
             + ", offsetMap=" + offsetMap
             + '}';
     }