karafka-web 0.6.3 → 0.7.0

data/lib/karafka/web/ui/pro/views/shared/_navigation.erb

@@ -4,6 +4,11 @@
 
 <div class="collapse navbar-collapse" id="navbarNav">
   <ul class="navbar-nav">
+    <li class="nav-item ms-3">
+      <a class="nav-link <%= nav_class(start_with: '/dashboard') %>" href="<%= root_path('dashboard') %>">
+        Dashboard
+      </a>
+    </li>
     <li class="nav-item ms-3">
       <a class="nav-link <%= nav_class(start_with: '/consumers') %>" href="<%= root_path('consumers') %>">
         Consumers
@@ -16,7 +21,7 @@
     </li>
 
     <li class="nav-item ms-3">
-      <a class="nav-link <%= nav_class(start_with: '/health') %>" href="<%= root_path('health') %>">
+      <a class="nav-link <%= nav_class(start_with: '/health') %>" href="<%= root_path('health/overview') %>">
         Health
       </a>
     </li>
@@ -31,7 +36,7 @@
       </a>
     </li>
     <li class="nav-item ms-3">
-      <a class="nav-link <%= nav_class(start_with: '/errors') %>" href="<%= root_path('errors/0') %>">
+      <a class="nav-link <%= nav_class(start_with: '/errors') %>" href="<%= root_path('errors') %>">
         Errors
       </a>
     </li>
@@ -52,11 +57,3 @@
     </li>
   </ul>
 </div>
-
-<ul class="nav navbar-nav navbar-right">
-  <li>
-    <span class="btn btn-secondary btn-sm" id="live-poll" data-on="Live polling" data-off="Live poll">
-      Live poll
-    </a>
-  </li>
-</ul>

data/lib/karafka/web/ui/public/images/logo-gray.svg

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 646.99998 136.1" xml:space="preserve" sodipodi:docname="logo.svg" width="647" height="136.10001" inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"><metadata id="metadata45"><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/></cc:Work></rdf:RDF></metadata><defs id="defs43"/><sodipodi:namedview pagecolor="#6c757d" bordercolor="#666666" borderopacity="1" objecttolerance="10" gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-width="1920" inkscape:window-height="1016" id="namedview41" showgrid="false" inkscape:zoom="1.3391547" inkscape:cx="198.39874" inkscape:cy="89.619887" inkscape:window-x="0" inkscape:window-y="27" inkscape:window-maximized="1" inkscape:current-layer="g22"/>
+<style type="text/css" id="style2">
+	.st0{fill:#FFFFFF;}
+	.st1{fill:none;stroke:#0B0C1B;stroke-width:5.7629;stroke-miterlimit:10;}
+	.st2{fill:#BC2C40;}
+	.st3{fill:none;stroke:#0B0C1B;stroke-width:4.6103;stroke-linejoin:round;stroke-miterlimit:10;}
+</style>
+
+
+<g id="g22" transform="translate(-183.3,-50.9)">
+	<path d="m 217.7,151.7 -9.3,11.1 v 22.4 H 183.3 V 52.6 h 25.1 v 76.7 l 30.1,-37.1 h 29 l -33,39.2 36.2,53.7 h -30.1 z" id="path8" inkscape:connector-curvature="0" style="fill:#6c757d;fill-opacity:1"/>
+	<path d="m 314.6,90.4 c 7.3,0 15.4,2 24.4,9.5 v -7.7 h 23.6 v 64.5 c 0,10.9 1.4,18.3 5,27.6 l -24,1.8 c -1.6,-3.8 -2.5,-8.4 -3.2,-12.2 -7.7,8.6 -18.3,13.1 -28.3,13.1 -18.5,0 -36.9,-16.3 -36.9,-48.4 0,-32.1 20.1,-48.2 39.4,-48.2 z m 5.4,75.1 c 5.9,0 12.4,-3 17.6,-8.1 v -38.5 c -5.9,-5 -11.3,-7 -16.5,-7 -11.1,0 -20.2,8.8 -20.2,26.7 -0.1,18.4 8.9,26.9 19.1,26.9 z" id="path10" inkscape:connector-curvature="0" style="fill:#6c757d;fill-opacity:1"/>
+	<path d="m 389.7,92.2 h 23.6 v 24.6 c 5.6,-12.7 17.2,-23.3 32.8,-26.9 l 4.5,24.9 c -14.5,2.3 -27.6,13.9 -35.8,24.3 v 46.1 h -25.1 z" id="path12" inkscape:connector-curvature="0" style="fill:#6c757d;fill-opacity:1"/>
+	<path d="m 497.2,90.4 c 7.3,0 15.4,2 24.4,9.5 v -7.7 h 23.6 v 64.5 c 0,10.9 1.4,18.3 5,27.6 l -24,1.8 c -1.6,-3.8 -2.5,-8.4 -3.2,-12.2 -7.7,8.6 -18.3,13.1 -28.3,13.1 -18.5,0 -36.9,-16.3 -36.9,-48.4 -0.1,-32.1 20,-48.2 39.4,-48.2 z m 5.3,75.1 c 5.9,0 12.4,-3 17.6,-8.1 v -38.5 c -5.9,-5 -11.3,-7 -16.5,-7 -11.1,0 -20.2,8.8 -20.2,26.7 0,18.4 8.9,26.9 19.1,26.9 z" id="path14" inkscape:connector-curvature="0" style="fill:#6c757d;fill-opacity:1"/>
+	<path d="M 578.7,113.7 H 564.2 V 92.2 h 14.5 v -9.1 c 0,-18.6 9.5,-32.2 28.8,-32.2 5.7,0 12.4,1.1 20.1,3.6 l -4.8,21 c -4.1,-1.4 -7.2,-2 -9.9,-2 -6.6,0 -9.1,4.3 -9.1,10.6 v 8.2 h 23.8 v 21.5 h -23.8 v 71.5 h -25.1 z" id="path16" inkscape:connector-curvature="0" style="fill:#6c757d;fill-opacity:1"/>
+	<path d="m 680.4,151.7 -9.3,11.1 v 22.4 H 646 V 52.6 h 25.1 v 76.7 l 30.1,-37.1 h 29 l -33,39.2 36.2,53.7 h -30.1 z" id="path18" inkscape:connector-curvature="0" style="fill:#6c757d;fill-opacity:1"/>
+	<path d="m 777.3,90.4 c 7.3,0 15.4,2 24.4,9.5 v -7.7 h 23.6 v 64.5 c 0,10.9 1.4,18.3 5,27.6 l -24,1.8 c -1.6,-3.8 -2.5,-8.4 -3.2,-12.2 -7.7,8.6 -18.3,13.1 -28.3,13.1 -18.5,0 -36.9,-16.3 -36.9,-48.4 0,-32.1 20.1,-48.2 39.4,-48.2 z m 5.4,75.1 c 5.9,0 12.4,-3 17.6,-8.1 v -38.5 c -5.9,-5 -11.3,-7 -16.5,-7 -11.1,0 -20.2,8.8 -20.2,26.7 0,18.4 8.9,26.9 19.1,26.9 z" id="path20" inkscape:connector-curvature="0" style="fill:#6c757d;fill-opacity:1"/>
+</g>
+
+
+
+
+
+
+
+<style xmlns="" id="autoconsent-prehide"/></svg>

data/lib/karafka/web/ui/public/javascripts/application.js

@@ -1,3 +1,4 @@
+// Nicer display of time distance from a given event
 function updateTimeAgo() {
   var selection = document.querySelectorAll('time');
 
@@ -7,11 +8,15 @@ function updateTimeAgo() {
   }
 }
 
+// To prevent from flickering, the UI is initially hidden and visible when all the JS components
+// are fully initialized
 function displayUi() {
   var content = document.getElementById('content');
   content.style.display = 'inherit';
 }
 
+// When using explorer, we can select the desired partition. This code redirects without having
+// to press a button after a select
 function redirectToPartition() {
   var selector = document.getElementById('current-partition');
 
@@ -22,6 +27,27 @@ function redirectToPartition() {
   });
 }
 
+// Binds to links and forms to make sure action is what user wants
+function bindActionsConfirmations() {
+  var elements = document.getElementsByClassName('confirm-action')
+  var confirmation = 'Are you sure?'
+
+  for (var i = 0; i < elements.length; i++) {
+    let element = elements[i]
+    let action = 'click'
+
+    if (element.nodeName === 'FORM') {
+      action = 'submit'
+    }
+
+    element.addEventListener(action, function(event) {
+      if (!window.confirm(confirmation)) {
+        event.preventDefault();
+      }
+    })
+  }
+}
+
 function addListeners() {
   bindPollingButtonClick();
   setLivePollButton();
@@ -30,6 +56,10 @@ function addListeners() {
   hljs.highlightAll();
   updateTimeAgo();
   redirectToPartition();
+  manageTabs();
+  manageCharts();
+  bindActionsConfirmations();
+  loadOffsetLookupDatePicker();
   displayUi();
 }