karafka-web 0.10.4 → 0.11.0.beta1

data/lib/karafka/web/ui/routes/assets.rb

@@ -0,0 +1,53 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      # Namespace for Ui related sub-routes
+      module Routes
+        # Manages the assets related routes
+        class Assets < Base
+          route do |r|
+            # Serves current version specific assets to prevent users from fetching old assets
+            # after upgrade.
+            r.on 'assets', Karafka::Web::VERSION do
+              custom_css = Karafka::Web.config.ui.custom.css
+
+              # If there are custom css styles and js inserted via the config we should display
+              # them. They can be either files or just content.
+              if custom_css
+                r.get('stylesheets/custom.css') do
+                  response['Content-Type'] = 'text/css'
+                  response['Cache-Control'] = 'max-age=31536000, immutable'
+
+                  if File.exist?(custom_css) && File.file?(custom_css)
+                    File.read(custom_css)
+                  else
+                    custom_css
+                  end
+                end
+              end
+
+              custom_js = Karafka::Web.config.ui.custom.js
+
+              if custom_js
+                r.get('javascripts/custom.js') do
+                  response['Content-Type'] = 'application/javascript'
+                  response['Cache-Control'] = 'max-age=31536000, immutable'
+
+                  if File.exist?(custom_js) && File.file?(custom_js)
+                    File.read(custom_js)
+                  else
+                    custom_js
+                  end
+                end
+              end
+
+              r.public
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/base.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      # Namespace for the Roda app routing components
+      module Routes
+        # Base class for all sub-routes that we want to use
+        # Splitting this makes the Roda app much smaller and allows us to operate within the scope
+        # of one routing namespace easily
+        class Base
+          class << self
+            # Stores the sub-routing
+            #
+            # @param block [Proc] routing block that we want to evaluate in roda
+            def route(&block)
+              @route_block = block
+            end
+
+            # Binds given routing block to Roda
+            #
+            # @param app [Karafka::Web::Ui::App] roda app
+            # @param request [Karafka::Web::Ui::App::RodaRequest] roda request
+            # @return [nil] We should always return nil so Roda does not interpret it as a custom
+            #   result
+            def bind(app, request)
+              app.instance_exec(request, &@route_block)
+
+              nil
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/cluster.rb

@@ -0,0 +1,28 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the cluster related routes
+        class Cluster < Base
+          route do |r|
+            r.on 'cluster' do
+              controller = build(Controllers::ClusterController)
+
+              r.get 'brokers' do
+                controller.brokers
+              end
+
+              r.get 'replication' do
+                controller.replication
+              end
+
+              r.redirect root_path('cluster/brokers')
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/consumers.rb

@@ -0,0 +1,35 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the consumers related routes
+        class Consumers < Base
+          route do |r|
+            r.on 'consumers' do
+              %w[
+                performance
+                controls
+                commands
+              ].each do |path|
+                r.get path do |_process_id|
+                  raise ::Karafka::Web::Errors::Ui::ProOnlyError
+                end
+              end
+
+              r.get String, 'subscriptions' do |_process_id|
+                raise ::Karafka::Web::Errors::Ui::ProOnlyError
+              end
+
+              r.get do
+                controller = build(Controllers::ConsumersController)
+                controller.index
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/dashboard.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the dashboard related routes
+        class Dashboard < Base
+          route do |r|
+            r.get 'dashboard' do
+              @breadcrumbs = false
+              controller = build(Controllers::DashboardController)
+              controller.index
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/errors.rb

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the errors related routes
+        class Errors < Base
+          route do |r|
+            r.on 'errors' do
+              controller = build(Controllers::ErrorsController)
+
+              r.get Integer do |offset|
+                controller.show(offset)
+              end
+
+              r.get do
+                controller.index
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/jobs.rb

@@ -0,0 +1,28 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the jobs related routes
+        class Jobs < Base
+          route do |r|
+            r.on 'jobs' do
+              controller = build(Controllers::JobsController)
+
+              r.get 'running' do
+                controller.running
+              end
+
+              r.get 'pending' do
+                controller.pending
+              end
+
+              r.redirect root_path('jobs/running')
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/pro_only.rb

@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the pro only related routes that OSS users can go to to get Pro info
+        class ProOnly < Base
+          route do |r|
+            %w[
+              health
+              explorer
+              dlq
+              topics
+              recurring_tasks
+              scheduled_messages
+            ].each do |route|
+              r.get route, [String, true], [String, true] do
+                raise ::Karafka::Web::Errors::Ui::ProOnlyError
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/routing.rb

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the routing related routes
+        class Routing < Base
+          route do |r|
+            r.on 'routing' do
+              controller = build(Controllers::RoutingController)
+
+              r.get String do |topic_id|
+                controller.show(topic_id)
+              end
+
+              r.get do
+                controller.index
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/status.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the status related routes
+        class Status < Base
+          route do |r|
+            r.get 'status' do
+              controller = build(Controllers::StatusController)
+              controller.show
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/support.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the support related routes
+        class Support < Base
+          route do |r|
+            r.get 'support' do
+              controller = build(Controllers::SupportController)
+              controller.show
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/routes/ux.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+module Karafka
+  module Web
+    module Ui
+      module Routes
+        # Manages the ux related routes
+        class Ux < Base
+          route do |r|
+            r.get 'ux' do
+              controller = build(Controllers::UxController)
+              controller.show
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/karafka/web/ui/views/cluster/_partition.erb

@@ -2,11 +2,11 @@
 
 <tr>
   <td>
-    <a href="<%= explorer_path(topic[:topic_name]) %>">
+    <a href="<%= explorer_topics_path(topic[:topic_name]) %>">
       <%= topic[:topic_name] %>
     </a>
   <td>
-    <a href="<%= explorer_path(topic[:topic_name], partition[:partition_id]) %>">
+    <a href="<%= explorer_topics_path(topic[:topic_name], partition[:partition_id]) %>">
       <%= partition[:partition_id] %>
     </a>
   </td>

data/lib/karafka/web/ui/views/cluster/brokers.erb

@@ -7,7 +7,7 @@
     <table class="data-table">
       <thead>
         <tr>
-          <th><%== sort_link(:id) %></th>
+          <th><%== sort_link('Node ID', :id) %></th>
           <th><%== sort_link(:name) %></th>
           <th><%== sort_link(:port) %></th>
         </tr>

data/lib/karafka/web/ui/views/consumers/_breadcrumbs.erb

@@ -1,5 +1,11 @@
 <li>
-  <a href="<%= root_path('consumers/overview') %>">
+  <a href="<%= consumers_path('overview') %>">
     Consumers
   </a>
 </li>
+
+<li>
+  <a href="<%= consumers_path('overview') %>">
+    Overview
+  </a>
+</li>

data/lib/karafka/web/ui/views/consumers/_consumer.erb

@@ -1,36 +1,45 @@
-<tr class="status-row-<%= process.status %>">
-  <td>
-    <p>
-      <a href="<%= root_path('consumers', process.id, 'subscriptions') %>">
-        <%== truncate(process.id, strategy: :middle) %>
-      </a>
-    </p>
+<% if process.schema_compatible? %>
+  <tr class="status-row-<%= process.status %>">
+    <td>
+      <p>
+        <a href="<%= consumer_path(process.id, 'subscriptions') %>">
+          <%== truncate(process.id, strategy: :middle) %>
+        </a>
+      </p>
 
-    <p class="mt-1">
-      <%== partial 'consumers/assignments_badges', locals: { process: process } %>
-    </p>
+      <p class="mt-1">
+        <%== partial 'consumers/assignments_badges', locals: { process: process } %>
+      </p>
 
-    <p>
-      <%== tags(process.tags) %>
-    </p>
-  </td>
+      <p>
+        <%== tags(process.tags) %>
+      </p>
+    </td>
 
-  <td>
-    <%== relative_time process.started_at %>
-  </td>
+    <td>
+      <%== relative_time process.started_at %>
+    </td>
 
-  <td>
-    <%== badge_primary_sm format_memory process.memory_usage %>
-  </td>
+    <td>
+      <%== badge_primary_sm format_memory process.memory_usage %>
+    </td>
 
-  <td>
-    <span class="badge badge-primary">
-      <%= process.workers %> /
-      <%= process.busy %>
-    </span>
-  </td>
+    <td>
+      <span class="badge badge-primary">
+        <%= process.workers %> /
+        <%= process.busy %>
+      </span>
+    </td>
 
-  <td>
-    <%= process.lag_hybrid %>
-  </td>
-</tr>
+    <td>
+      <%= process.lag_hybrid %>
+    </td>
+  </tr>
+<% else %>
+  <%==
+    partial(
+      'consumers/incompatible',
+      locals: { colspan: 5, process: process }
+    )
+  %>
+<% end %>

data/lib/karafka/web/ui/views/consumers/_incompatible.erb

@@ -0,0 +1,13 @@
+<tr class="status-row-incompatible">
+  <td>
+    <p class="text-muted">
+      <%== truncate(process.id, strategy: :middle) %>
+    </p>
+  </td>
+
+  <td colspan="<%= colspan %>" class="text-muted">
+    This process uses schema <%= process.schema_version %>
+    while Web UI runs on <%= ::Karafka::Web::Tracking::Consumers::Sampler::SCHEMA_VERSION %>.
+    Limited functionality until all components are updated to the same version.
+  </td>
+</tr>

data/lib/karafka/web/ui/views/consumers/_no_consumers.erb

@@ -1,3 +1,3 @@
-<% alert_box_info 'There are no Karafka consumer processes actively reporting to the Web UI.' do %>
-    If you are sure you are running at least one <code>karafka server</code> instance, please make sure that it can report to the <code><%= Karafka::Web.config.topics.consumers.reports %></code> topic.
+<% alert_box_info 'There Are No Karafka Consumer Processes Actively Reporting to the Web UI' do %>
+    If you are sure you are running at least one <code>karafka server</code> instance, please make sure that it can report to the <code><%= Karafka::Web.config.topics.consumers.reports.name %></code> topic.
 <% end %>

data/lib/karafka/web/ui/views/consumers/_tabs.erb

@@ -1,7 +1,7 @@
 <div class="tab-container-wrapper">
   <div class="tab-container">
     <a
-      href="<%= root_path('consumers', 'overview') %>"
+      href="<%= consumers_path('overview') %>"
       class="custom-tab <%= nav_class(include: 'overview') %>"
       title="Pro Feature"
     >
@@ -9,7 +9,7 @@
     </a>
 
     <a
-      href="<%= root_path('consumers', 'performance') %>"
+      href="<%= consumers_path('performance') %>"
       class="custom-tab disabled <%= nav_class(include: 'performance') %>"
       title="Pro Feature"
     >
@@ -17,7 +17,7 @@
     </a>
 
     <a
-      href="<%= root_path('consumers', 'controls') %>"
+      href="<%= consumers_path('controls') %>"
       class="custom-tab disabled <%= nav_class(include: 'controls') %>"
       title="Pro Feature"
     >
@@ -25,7 +25,7 @@
     </a>
 
     <a
-      href="<%= root_path('commands') %>"
+      href="<%= consumers_path('commands') %>"
       class="custom-tab disabled <%= nav_class(include: 'commands') %>"
       title="Pro Feature"
     >

data/lib/karafka/web/ui/views/consumers/index.erb

@@ -13,7 +13,7 @@
       <table class="data-table">
         <thead>
           <tr>
-            <th><%== sort_link(:id) %></th>
+            <th><%== sort_link('Process ID', :id) %></th>
             <th class="col-sm-2"><%== sort_link(:started_at, rev: true) %></th>
             <th class="col-sm-1">Memory</th>
             <th class="col-sm-1">Utilization</th>

data/lib/karafka/web/ui/views/dashboard/_feature_pro.erb

@@ -1,4 +1,4 @@
-<div class="alert alert-info bg-white mt-0 mb-6">
+<div class="alert alert-secondary mt-0 mb-6">
   <%== icon(:info_circle) %>
   <p>
     This feature is available only to <a target="_blank" href="https://karafka.io/#become-pro">Pro</a>

data/lib/karafka/web/ui/views/dashboard/_not_enough_data.erb

@@ -1,3 +1,3 @@
-<% alert_box_info('There needs to be more data to draw meaningful graphs.') do %>
-  If you are sure you are running at least one <code>karafka server</code> instance and you do not see charts in a few minutes, please ensure that it can report to the <code><%= Karafka::Web.config.topics.consumers.reports %></code> topic and that Web-UI is correctly installed.
+<% alert_box_info('There Needs to Be More Data to Draw Meaningful Graphs') do %>
+  If you are sure you are running at least one <code>karafka server</code> instance and you do not see charts in a few minutes, please ensure that it can report to the <code><%= Karafka::Web.config.topics.consumers.reports.name %></code> topic and that Web-UI is correctly installed.
 <% end %>

data/lib/karafka/web/ui/views/dashboard/_ranges_selector.erb

@@ -1,7 +1,7 @@
 <div class="col-span-12">
   <div class="container-fluid mx-auto">
     <div class="flex justify-end">
-      <div class="btn-group">
+      <div>
         <%
           path = root_path('dashboard?range=seconds')
           active = params.current_range == :seconds ? 'btn-active' : ''

data/lib/karafka/web/ui/views/dashboard/index.erb

@@ -21,7 +21,7 @@
     <div class="tab-container inline-tabs">
       <%== partial 'shared/tab_nav', locals: { title: 'Consumed', id: 'consumed', active: true } %>
       <%== partial 'shared/tab_nav', locals: { title: 'Batches', id: 'batches' } %>
-      <%== partial 'shared/tab_nav', locals: { title: 'Lags', id: 'lags', disabled: true } %>
+      <%== partial 'shared/tab_nav', locals: { title: 'Lags', id: 'lags', active: true } %>
       <%== partial 'shared/tab_nav', locals: { title: 'Max LSO', id: 'max-lso' } %>
       <%== partial 'shared/tab_nav', locals: { title: 'Pace', id: 'pace' } %>
     </div>
@@ -39,9 +39,7 @@
     </div>
 
     <div id="lags" class="hidden">
-      <%== partial 'dashboard/feature_pro' %>
-      <% data = { enqueued: set.call, busy: set.call }.to_json %>
-      <%== partial 'shared/charts/line', locals: { data: data, id: 'lags', blurred: true } %>
+      <%== partial 'shared/charts/line', locals: { data: @topics_charts.lags_hybrid, id: 'lags' } %>
     </div>
 
     <div id="max-lso" class="hidden">
@@ -53,12 +51,12 @@
     </div>
   </div>
 
-  <h2 class="h2">Utilization Metrics</h2>
+  <h2 class="h2 mt-4">Utilization Metrics</h2>
 
   <div class="tab-container-wrapper" id="graphs2">
     <div class="tab-container inline-tabs">
       <%== partial 'shared/tab_nav', locals: { title: 'Utilization', id: 'utilization', active: true } %>
-      <%== partial 'shared/tab_nav', locals: { title: 'RSS', id: 'rss', disabled: true } %>
+      <%== partial 'shared/tab_nav', locals: { title: 'RSS', id: 'rss', active: true } %>
       <%== partial 'shared/tab_nav', locals: { title: 'Concurrency', id: 'concurrency' } %>
       <%== partial 'shared/tab_nav', locals: { title: 'Data transfers', id: 'data-transfers', disabled: true } %>
     </div>
@@ -71,9 +69,8 @@
     </div>
 
     <div id="rss" class="hidden">
-      <%== partial 'dashboard/feature_pro' %>
-      <% data = { rss: set.call(1_050), process_rss: set.call(1_000) }.to_json %>
-      <%== partial 'shared/charts/line', locals: { data: data, id: 'rss', blurred: true } %>
+      <% data = @aggregated_charts.with(:rss, :process_rss) %>
+      <%== partial 'shared/charts/line', locals: { data: data, id: 'rss', label_type_y: 'memory' } %>
     </div>
 
     <div id="concurrency" class="hidden">
@@ -90,43 +87,3 @@
 <% else %>
   <%== partial 'dashboard/not_enough_data' %>
 <% end %>
-
-
-
-
-
-
-
-
-
-
-<% if false && @aggregated.sufficient? %>
-  <%== partial 'dashboard/ranges_selector' %>
-
-        <div class="tab-content">
-          <div class="tab-pane show active" id="utilization" role="tabpanel">
-            <% data = @aggregated_charts.with(:utilization) %>
-            <%== partial 'shared/charts/line', locals: { data: data, id: 'utilization', label_type_y: 'percentage' } %>
-          </div>
-
-          <div class="tab-pane show" id="rss" role="tabpanel">
-            <%== partial 'dashboard/feature_pro' %>
-            <% data = { rss: set.call(1_050), process_rss: set.call(1_000) }.to_json %>
-            <%== partial 'shared/charts/line', locals: { data: data, id: 'rss', blurred: true } %>
-          </div>
-
-          <div class="tab-pane show" id="concurrency" role="tabpanel">
-            <% data = @aggregated_charts.with(:processes, :workers, :active_listeners, :standby_listeners) %>
-            <%== partial 'shared/charts/line', locals: { data: data, id: 'concurrency' } %>
-          </div>
-
-          <div class="tab-pane show" id="data-transfers" role="tabpanel">
-            <%== partial 'dashboard/feature_pro' %>
-            <% data = { bytes_received: set.call(4, 10..15), bytes_sent: set.call(2, 0..5) }.to_json %>
-            <%== partial 'shared/charts/line', locals: { data: data, id: 'data-transfers', blurred: true } %>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-<% end %>