karafka-web 0.9.1 → 0.10.1

data/lib/karafka/web/pro/ui/views/health/lags.erb

@@ -1,58 +1,58 @@
-<%== view_title('Consumers Groups Lags Details') %>
+<% view_title 'Consumers Groups Lags Details' %>
 
 <%== partial 'health/tabs' %>
 
-<% if @stats.empty? %>
-  <%== partial 'health/no_data' %>
-<% end %>
+<div class="col-span-12">
+  <% if @stats.empty? %>
+    <%== partial 'health/no_data' %>
+  <% end %>
 
-<% @stats.each_with_index do |(cg_name, details), index| %>
-  <div class="container mb-5">
-    <%== partial 'health/consumer_group_header', locals: { cg_name: cg_name, details: details } %>
+  <% @stats.each_with_index do |(cg_name, details), index| %>
+    <h2 class="h2"><%= cg_name %></h2>
 
-    <div class="row mb-3">
-      <div class="col-sm-12 table-responsive">
-        <% topics = details[:topics] %>
-        <% topics.each_with_index do |(topic_name, partitions), index| %>
-          <table class="processes bg-white table table-hover table-bordered table-striped align-middle <%= (index+1 < topics.size) ? 'mb-5' : 'mb-3' %>">
-            <thead>
-              <tr class="align-middle">
-                <th colspan="12">
-                  <h5 class="mb-0"><%= topic_name %></h4>
-                </th>
-              </tr>
-              <tr class="align-middle">
-                <th rowspan="2"><%== sort_link('Partition', :id) %></th>
-                <th colspan="2" class="text-center">Lags</th>
-                <th colspan="2" class="text-center">Trends</th>
-                <th colspan="12" rowspan="2">
-                  <%== sort_link(:poll_state) %>
-                </th>
-              </tr>
-              <tr class="align-middle">
-                <th><%== sort_link(:lag) %></th>
-                <th><%== sort_link(:lag_stored) %></th>
-                <th><%== sort_link('Lag', :lag_d) %></th>
-                <th><%== sort_link('Lag stored', :lag_stored_d) %></th>
-              </tr>
-            </thead>
-            <tbody>
-                <% partitions.each do |partition_id, details| %>
-                  <%==
-                    partial(
-                      'health/partition_lags',
-                      locals: {
-                        topic_name: topic_name,
-                        partition_id: partition_id,
-                        details: details
-                      }
-                    )
-                  %>
-                <% end %>
-            </tbody>
-          </table>
-        <% end %>
+    <% topics = details[:topics] %>
+    <% topics.each_with_index do |(topic_name, partitions), index| %>
+      <div class="data-table-wrapper">
+        <table class="data-table">
+          <thead>
+            <tr>
+              <th colspan="12">
+                <%= topic_name %>
+              </th>
+            </tr>
+            <tr>
+              <th rowspan="2"><%== sort_link('Partition', :id) %></th>
+              <th colspan="2" class="text-center">Lags</th>
+              <th colspan="2" class="text-center">Trends</th>
+              <th colspan="12" rowspan="2">
+                <%== sort_link(:poll_state) %>
+              </th>
+            </tr>
+            <tr>
+              <th><%== sort_link(:lag) %></th>
+              <th><%== sort_link(:lag_stored) %></th>
+              <th><%== sort_link('Lag', :lag_d) %></th>
+              <th><%== sort_link('Lag stored', :lag_stored_d) %></th>
+            </tr>
+          </thead>
+          <tbody>
+              <% partitions.each do |partition_id, details| %>
+                <%==
+                  partial(
+                    'health/partition_lags',
+                    locals: {
+                      topic_name: topic_name,
+                      partition_id: partition_id,
+                      details: details
+                    }
+                  )
+                %>
+              <% end %>
+          </tbody>
+        </table>
+
+        <%== partial 'health/table_metadata', locals: { details: details } %>
       </div>
-    </div>
-  </div>
-<% end %>
+    <% end %>
+  <% end %>
+</div>

data/lib/karafka/web/pro/ui/views/health/offsets.erb

@@ -1,61 +1,61 @@
-<%== view_title('Consumers Groups Offsets Details') %>
+<% view_title 'Consumers Groups Offsets Details' %>
 
 <%== partial 'health/tabs' %>
 
-<% if @stats.empty? %>
-  <%== partial 'health/no_data' %>
-<% end %>
+<div class="col-span-12">
+  <% if @stats.empty? %>
+    <%== partial 'health/no_data' %>
+  <% end %>
 
-<% @stats.each_with_index do |(cg_name, details), index| %>
-  <div class="container mb-5">
-    <%== partial 'health/consumer_group_header', locals: { cg_name: cg_name, details: details } %>
+  <% @stats.each_with_index do |(cg_name, details), index| %>
+    <h2 class="h2"><%= cg_name %></h2>
 
-    <div class="row mb-3">
-      <div class="col-sm-12 table-responsive">
-        <% topics = details[:topics] %>
-        <% topics.each_with_index do |(topic_name, partitions), index| %>
-          <table class="processes bg-white table table-hover table-bordered table-striped align-middle <%= (index+1 < topics.size) ? 'mb-5' : 'mb-3' %>">
-            <thead>
-              <tr class="align-middle">
-                <th colspan="12">
-                  <h5 class="mb-0"><%= topic_name %></h4>
-                </th>
-              </tr>
-              <tr class="align-middle">
-                <th rowspan="2"><%== sort_link('Partition', :id) %></th>
-                <th rowspan="2"><%== sort_link(:lag_hybrid) %></th>
-                <th colspan="10" class="text-center">Offsets</th>
-              </tr>
-              <tr class="align-middle">
-                <th><%== sort_link(:committed_offset) %></th>
-                <th><%== sort_link('Committed change', :committed_offset_fd) %></th>
-                <th><%== sort_link(:stored_offset) %></th>
-                <th><%== sort_link('Stored change', :stored_offset_fd) %></th>
-                <th><%== sort_link(:lo_offset) %></th>
-                <th><%== sort_link(:hi_offset) %></th>
-                <th><%== sort_link('High change', :hi_offset_fd) %></th>
-                <th><%== sort_link(:ls_offset) %></th>
-                <th><%== sort_link('LSO change', :ls_offset_fd) %></th>
-                <th><%== sort_link('LSO state', :lso_risk_state) %></th>
-              </tr>
-            </thead>
-            <tbody>
-                <% partitions.each do |partition_id, details| %>
-                  <%==
-                    partial(
-                      'health/partition_offset',
-                      locals: {
-                        topic_name: topic_name,
-                        partition_id: partition_id,
-                        details: details
-                      }
-                    )
-                  %>
-                <% end %>
-            </tbody>
-          </table>
-        <% end %>
+    <% topics = details[:topics] %>
+    <% topics.each_with_index do |(topic_name, partitions), index| %>
+      <div class="data-table-wrapper">
+        <table class="data-table">
+          <thead>
+            <tr>
+              <th colspan="12">
+                <%= topic_name %>
+              </th>
+            </tr>
+            <tr>
+              <th rowspan="2"><%== sort_link('Partition', :id) %></th>
+              <th rowspan="2"><%== sort_link(:lag_hybrid) %></th>
+              <th colspan="10" class="text-center">Offsets</th>
+            </tr>
+            <tr>
+              <th><%== sort_link(:committed_offset) %></th>
+              <th><%== sort_link('Committed change', :committed_offset_fd) %></th>
+              <th><%== sort_link(:stored_offset) %></th>
+              <th><%== sort_link('Stored change', :stored_offset_fd) %></th>
+              <th><%== sort_link(:lo_offset) %></th>
+              <th><%== sort_link(:hi_offset) %></th>
+              <th><%== sort_link('High change', :hi_offset_fd) %></th>
+              <th><%== sort_link(:ls_offset) %></th>
+              <th><%== sort_link('LSO change', :ls_offset_fd) %></th>
+              <th><%== sort_link('LSO state', :lso_risk_state) %></th>
+            </tr>
+          </thead>
+          <tbody>
+              <% partitions.each do |partition_id, details| %>
+                <%==
+                  partial(
+                    'health/partition_offset',
+                    locals: {
+                      topic_name: topic_name,
+                      partition_id: partition_id,
+                      details: details
+                    }
+                  )
+                %>
+              <% end %>
+          </tbody>
+        </table>
+
+        <%== partial 'health/table_metadata', locals: { details: details } %>
       </div>
-    </div>
-  </div>
-<% end %>
+    <% end %>
+  <% end %>
+</div>

data/lib/karafka/web/pro/ui/views/health/overview.erb

@@ -1,67 +1,67 @@
-<%== view_title('Consumers Groups Overview') %>
+<% view_title 'Consumers Groups Overview' %>
 
 <%== partial 'health/tabs' %>
 
-<% if @stats.empty? %>
-  <%== partial 'health/no_data' %>
-<% end %>
+<div class="col-span-12">
+  <% if @stats.empty? %>
+    <%== partial 'health/no_data' %>
+  <% end %>
 
-<% @stats.each_with_index do |(cg_name, details), index| %>
-  <div class="container mb-5">
-    <%== partial 'health/consumer_group_header', locals: { cg_name: cg_name, details: details } %>
+  <% @stats.each_with_index do |(cg_name, details), index| %>
+    <h2 class="h2"><%= cg_name %></h2>
 
-    <div class="row mb-3">
-      <div class="col-sm-12 table-responsive">
-        <% topics = details[:topics] %>
-        <% topics.each_with_index do |(topic_name, partitions), index| %>
-          <table class="processes bg-white table table-hover table-bordered table-striped align-middle <%= (index+1 < topics.size) ? 'mb-5' : 'mb-3' %>">
-            <thead>
-              <tr class="align-middle">
-                <th colspan="100">
-                  <h5 class="mb-0"><%= topic_name %></h4>
-                </th>
-              </tr>
-              <tr class="align-middle">
-                <th colspan="1" rowspan="2">
-                  <%== sort_link('Partition', :id) %>
-                </th>
-                <th colspan="1" rowspan="2">
-                  <%== sort_link(:lag_hybrid) %>
-                </th>
-                <th colspan="1" rowspan="2">
-                  <%== sort_link(:stored_offset) %>
-                </th>
-                <th colspan="3" rowspan="1" class="text-center">
-                  States
-                </th>
+    <% topics = details[:topics] %>
+    <% topics.each_with_index do |(topic_name, partitions), index| %>
+      <div class="data-table-wrapper">
+        <table class="data-table">
+          <thead>
+            <tr>
+              <th colspan="100">
+                <%= topic_name %>
+              </th>
+            </tr>
+            <tr>
+              <th colspan="1" rowspan="2">
+                <%== sort_link('Partition', :id) %>
+              </th>
+              <th colspan="1" rowspan="2">
+                <%== sort_link(:lag_hybrid) %>
+              </th>
+              <th colspan="1" rowspan="2">
+                <%== sort_link(:stored_offset) %>
+              </th>
+              <th colspan="3" rowspan="1" class="text-center">
+                States
+              </th>
 
-                <th colspan="1" rowspan="2">
-                 <%== sort_link(:id) %>
-                </th>
-              </tr>
-              <tr class="align-middle">
-                <th><%== sort_link(:fetch_state) %></th>
-                <th><%== sort_link(:poll_state) %></th>
-                <th><%== sort_link(:lso_risk_state) %></th>
-              </tr>
-            </thead>
-            <tbody>
-                <% partitions.each do |partition_id, details| %>
-                  <%==
-                    partial(
-                      'health/partition',
-                      locals: {
-                        topic_name: topic_name,
-                        partition_id: partition_id,
-                        details: details
-                      }
-                    )
-                  %>
-                <% end %>
-            </tbody>
-          </table>
-        <% end %>
+              <th colspan="1" rowspan="2">
+               <%== sort_link(:id) %>
+              </th>
+            </tr>
+            <tr>
+              <th><%== sort_link(:fetch_state) %></th>
+              <th><%== sort_link(:poll_state) %></th>
+              <th><%== sort_link(:lso_risk_state) %></th>
+            </tr>
+          </thead>
+          <tbody>
+              <% partitions.each do |partition_id, details| %>
+                <%==
+                  partial(
+                    'health/partition',
+                    locals: {
+                      topic_name: topic_name,
+                      partition_id: partition_id,
+                      details: details
+                    }
+                  )
+                %>
+              <% end %>
+          </tbody>
+        </table>
+
+        <%== partial 'health/table_metadata', locals: { details: details } %>
       </div>
-    </div>
-  </div>
-<% end %>
+    <% end %>
+  <% end %>
+</div>

data/lib/karafka/web/pro/ui/views/jobs/_job.erb

@@ -5,7 +5,7 @@
     </a>
   </td>
   <td>
-    <span class="badge bg-secondary badge-topic" title="Consumer group: <%= job.consumer_group %>">
+    <span class="badge badge-secondary" title="Consumer group: <%= job.consumer_group %>">
       <%= job.topic %>:
       <%= job.partition %>
     </span>

data/lib/karafka/web/pro/ui/views/jobs/_no_jobs.erb

@@ -1,7 +1 @@
-<div class="container mb-4">
-  <div class="row">
-    <div class="col-lg-12">
-      <%== alert_info("There are no #{type} jobs at the moment.") %>
-    </div>
-  </div>
-</div>
+<%== alert_info("There are no #{type} jobs at the moment.") %>

data/lib/karafka/web/pro/ui/views/jobs/pending.erb

@@ -1,43 +1,41 @@
-<%== view_title('Pending Jobs Overview', hr: false) %>
+<% view_title 'Pending Jobs' %>
 
 <%== partial 'jobs/tabs' %>
 
-<% if @jobs.empty? && params.current_page <= 1 %>
-  <%== partial 'jobs/no_jobs', locals: { type: 'pending' } %>
-<% elsif @jobs.empty? %>
-  <%== partial 'shared/no_paginated_data' %>
-<% else %>
-  <div class="container">
-    <div class="row mb-5">
-      <div class="col-sm-12 table-responsive">
-        <table class="processes bg-white table table-hover table-bordered table-striped mb-0 align-middle">
-          <thead>
-            <tr class="align-middle">
-              <th rowspan="2"><%== sort_link('Process', :id) %></th>
-              <th rowspan="2"><%== sort_link(:topic) %></th>
-              <th rowspan="2"><%== sort_link(:consumer) %></th>
-              <th rowspan="2"><%== sort_link(:type) %></th>
-              <th rowspan="2"><%== sort_link(:messages) %></th>
-              <th colspan="3" class="text-center">Offsets</th>
-              <th rowspan="2"><%== sort_link('Created', :updated_at, rev: true) %></th>
-            </tr>
+<div class="col-span-12">
+  <% if @jobs.empty? && params.current_page <= 1 %>
+    <%== partial 'jobs/no_jobs', locals: { type: 'pending' } %>
+  <% elsif @jobs.empty? %>
+    <%== partial 'shared/no_paginated_data' %>
+  <% else %>
+    <div class="data-table-wrapper">
+      <table class="data-table">
+        <thead>
+          <tr>
+            <th rowspan="2"><%== sort_link('Process', :id) %></th>
+            <th rowspan="2"><%== sort_link(:topic) %></th>
+            <th rowspan="2"><%== sort_link(:consumer) %></th>
+            <th rowspan="2"><%== sort_link(:type) %></th>
+            <th rowspan="2"><%== sort_link(:messages) %></th>
+            <th colspan="3" class="text-center">Offsets</th>
+            <th rowspan="2"><%== sort_link('Created', :updated_at, rev: true) %></th>
+          </tr>
 
-            <tr class="align-middle">
-              <th><%== sort_link(:first_offset) %></th>
-              <th><%== sort_link(:last_offset) %></th>
-              <th><%== sort_link(:committed_offset) %></th>
-            </tr>
-          </thead>
-          <tbody>
-            <%==
-              each_partial(
-                @jobs,
-                'jobs/job'
-              )
-            %>
-          </tbody>
-        </table>
-      </div>
+          <tr>
+            <th><%== sort_link(:first_offset) %></th>
+            <th><%== sort_link(:last_offset) %></th>
+            <th><%== sort_link(:committed_offset) %></th>
+          </tr>
+        </thead>
+        <tbody>
+          <%==
+            each_partial(
+              @jobs,
+              'jobs/job'
+            )
+          %>
+        </tbody>
+      </table>
     </div>
-  </div>
-<% end %>
+  <% end %>
+</div>

data/lib/karafka/web/pro/ui/views/jobs/running.erb

@@ -1,43 +1,41 @@
-<%== view_title('Running Jobs Overview', hr: false) %>
+<% view_title 'Running Jobs' %>
 
 <%== partial 'jobs/tabs' %>
 
-<% if @jobs.empty? && params.current_page <= 1 %>
-  <%== partial 'jobs/no_jobs', locals: { type: 'running' } %>
-<% elsif @jobs.empty? %>
-  <%== partial 'shared/no_paginated_data' %>
-<% else %>
-  <div class="container">
-    <div class="row mb-5">
-      <div class="col-sm-12 table-responsive">
-        <table class="processes bg-white table table-hover table-bordered table-striped mb-0 align-middle">
-          <thead>
-            <tr class="align-middle">
-              <th rowspan="2"><%== sort_link('Process', :id) %></th>
-              <th rowspan="2"><%== sort_link(:topic) %></th>
-              <th rowspan="2"><%== sort_link(:consumer) %></th>
-              <th rowspan="2"><%== sort_link(:type) %></th>
-              <th rowspan="2"><%== sort_link(:messages) %></th>
-              <th colspan="3" class="text-center">Offsets</th>
-              <th rowspan="2"><%== sort_link('Started', :updated_at, rev: true) %></th>
-            </tr>
+<div class="col-span-12">
+  <% if @jobs.empty? && params.current_page <= 1 %>
+    <%== partial 'jobs/no_jobs', locals: { type: 'running' } %>
+  <% elsif @jobs.empty? %>
+    <%== partial 'shared/no_paginated_data' %>
+  <% else %>
+    <div class="data-table-wrapper">
+      <table class="data-table">
+        <thead>
+          <tr>
+            <th rowspan="2"><%== sort_link('Process', :id) %></th>
+            <th rowspan="2"><%== sort_link(:topic) %></th>
+            <th rowspan="2"><%== sort_link(:consumer) %></th>
+            <th rowspan="2"><%== sort_link(:type) %></th>
+            <th rowspan="2"><%== sort_link(:messages) %></th>
+            <th colspan="3" class="text-center">Offsets</th>
+            <th rowspan="2"><%== sort_link('Started', :updated_at, rev: true) %></th>
+          </tr>
 
-            <tr class="align-middle">
-              <th><%== sort_link(:first_offset) %></th>
-              <th><%== sort_link(:last_offset) %></th>
-              <th><%== sort_link(:committed_offset) %></th>
-            </tr>
-          </thead>
-          <tbody>
-            <%==
-              each_partial(
-                @jobs,
-                'jobs/job'
-              )
-            %>
-          </tbody>
-        </table>
-      </div>
+          <tr>
+            <th><%== sort_link(:first_offset) %></th>
+            <th><%== sort_link(:last_offset) %></th>
+            <th><%== sort_link(:committed_offset) %></th>
+          </tr>
+        </thead>
+        <tbody>
+          <%==
+            each_partial(
+              @jobs,
+              'jobs/job'
+            )
+          %>
+        </tbody>
+      </table>
     </div>
-  </div>
-<% end %>
+  <% end %>
+</div>

data/lib/karafka/web/pro/ui/views/recurring_tasks/_actions.erb

@@ -0,0 +1,58 @@
+<%
+  trigger_path = root_path('recurring_tasks', task.id, 'trigger')
+  disabled_class = task.enabled? ? '' : 'btn-disabled'
+%>
+<form
+  action="<%= trigger_path %>"
+  method="post"
+  class="inline"
+>
+  <%== csrf_tag(trigger_path) %>
+  <button
+    type="submit"
+    class="btn btn-primary btn-sm  "
+    title="Trigger"
+  >
+    <%== icon(:play) %>
+  </button>
+</form>
+
+<%
+  enable_path = root_path('recurring_tasks', task.id, 'enable')
+  disabled_class = task.enabled? ? 'btn-disabled' : ''
+%>
+<form
+  action="<%= enable_path %>"
+  method="post"
+  class="inline"
+  title="Enable"
+>
+  <%== csrf_tag(enable_path) %>
+  <button
+    type="submit"
+    class="btn btn-success btn-sm   <%= disabled_class %>"
+  >
+    <%== icon(:check) %>
+  </button>
+</form>
+
+<%
+  disable_path = root_path('recurring_tasks', task.id, 'disable')
+  disabled_class = task.enabled? ? '' : 'btn-disabled'
+%>
+<form
+  action="<%= disable_path %>"
+  method="post"
+  class="inline"
+  title="Disable"
+
+>
+  <%== csrf_tag(disable_path) %>
+  <button
+    type="submit"
+    class="btn btn-warning btn-sm  <%= disabled_class %>"
+
+  >
+    <%== icon(:pause) %>
+  </button>
+</form>