rorvswild 1.7.1 → 1.8.0

data/lib/rorvswild/local/stylesheet/local.css

@@ -100,18 +100,51 @@
 }
 
 .rorvswild-local-panel__header .rorvswild-local-panel__width-limiter {
-  display: flex;
-  padding: 12px !important;
+  display: flex !important;
+  align-items: center !important;
+  gap: 24px  !important;
+  padding: 0 12px !important;
 }
 
-
-.rorvswild-local-panel__header__title {
-  color: rgb(199 203 214) !important;
+.rorvswild-local-panel__header nav {
   text-transform: uppercase !important;
   font-size: 12px !important;
-  letter-spacing: 2px !important;
-  text-align: center !important;
-  flex: 1;
+  font-weight: 700 !important;
+  letter-spacing: 1px !important;
+  flex: 1 !important;
+}
+
+.rorvswild-local-panel__header nav ul {
+  padding: 0 !important;
+  margin: 0 !important;
+  list-style-type: none !important;
+  display: flex !important;
+  gap: 12px !important;
+}
+
+.rorvswild-local-panel__header nav li {
+  color: rgb(146 149 159) !important;
+  cursor: pointer !important;
+  line-height: 48px !important;
+}
+
+.rorvswild-local-panel__header nav li:hover {
+  color: rgb(199 203 214) !important;
+}
+
+[data-tab="requests"] .tab--requests {
+  color: rgb(199 203 214) !important;
+  box-shadow: 0 -3px 0 0 rgb(199 203 214) inset !important;
+}
+
+[data-tab="jobs"] .tab--jobs {
+  color: rgb(199 203 214) !important;
+  box-shadow: 0 -3px 0 0 rgb(199 203 214) inset !important;
+}
+
+[data-tab="errors"] .tab--errors {
+  color: rgb(199 203 214) !important;
+  box-shadow: 0 -3px 0 0 rgb(199 203 214) inset !important;
 }
 
 .rorvswild-local-panel svg {
@@ -127,8 +160,6 @@
 
 .rorvswild-local-panel svg:hover { stroke: rgb(199 203 214) !important; }
 
-.rorvswild-local-panel__logo { width: 60px !important; }
-
 .rorvswild-local-panel__header__icons {
   width: 60px !important;
   display: flex !important;
@@ -158,6 +189,14 @@
   overscroll-behavior: contain;
 }
 
+.rorvswild-local-panel--blank {
+  text-align: center !important;
+  margin: 0 auto !important;
+  font-size: 31px !important;
+  line-height: calc(100dvh - 120px) !important;
+  color: rgb(26 29 36) !important;
+}
+
 .rorvswild-local-panel__content::-webkit-scrollbar { width: 4px !important; }
 
 .rorvswild-local-panel__content::-webkit-scrollbar-corner { background: transparent !important; }
@@ -173,7 +212,7 @@
 }
 
 /* Panel request summary */
-.rorvswild-local-panel__request {
+.rorvswild-local-panel__row {
   display: flex !important;
   padding: 12px 12px 11px !important;
   border-bottom: 1px solid rgb(26 29 36) !important;
@@ -181,24 +220,52 @@
   flex-wrap: wrap !important;
 }
 
-.rorvswild-local-panel__request:hover { background: rgb(26 29 36) !important; }
+.rorvswild-local-panel__row:first-of-type {
+  margin-top: 12px !important;
+}
+
+.rorvswild-local-panel__row:hover { background: rgb(26 29 36) !important; }
 
-.rorvswild-local-panel__request__name {
+.rorvswild-local-panel__name {
   word-break: break-all !important;
   overflow-wrap: break-word !important;
   width: 100% !important;
   color: rgb(199 203 214) !important;
-  font-weight: 700;
+  font-weight: 700 !important;
 }
 
-.rorvswild-local-panel__request__name > span {
-  text-decoration-color: rgb(146 149 159);
-  text-decoration: underline;
-  text-decoration-thickness: 1px;
-  text-underline-offset: 1px;
+.rorvswild-local-panel__row:hover .rorvswild-local-panel__name { color: rgb(223 228 242) !important; }
+
+.rorvswild-local-panel__row .rorvswild-local-panel__name > span {
+  text-decoration-color: rgb(146 149 159) !important;
+  text-decoration: underline !important;
+  text-decoration-thickness: 1px !important;
+  text-underline-offset: 1px !important;
+}
+
+.rorvswild-local-panel__row.rorvswild-local-panel__error .rorvswild-local-panel__name {
+  color: rgb(146 149 159) !important;
+  font-weight: 400 !important;
+  word-break: keep-all;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.rorvswild-local-panel__row.rorvswild-local-panel__error .rorvswild-local-panel__name > span,
+.rorvswild-local-panel__error .rorvswild-local-panel__title {
+  color: rgb(255 184 172) !important;
+  font-weight: 700 !important;
 }
 
-.rorvswild-local-panel__request__path {
+.rorvswild-local-panel__row.rorvswild-local-panel__error:hover .rorvswild-local-panel__name > span { color: rgb(255 220 214) !important; }
+
+
+.rorvswild-local-panel__error .rorvswild-local-panel__path {
+  color: rgb(199 203 214) !important;
+}
+
+.rorvswild-local-panel__path {
   color: rgb(146 149 159) !important;
   font-weight: 400;
   display: block !important;
@@ -207,12 +274,12 @@
   text-decoration-color: transparent !important;
 }
 
-.rorvswild-local-panel__request__started-at {
+.rorvswild-local-panel__started-at {
   color: rgb(146 149 159) !important;
   margin-left: 12px !important;
 }
 
-.rorvswild-local-panel__request__runtime { 
+.rorvswild-local-panel__runtime { 
   color: rgb(182 202 255) !important; 
   font-weight: 700 !important;
 }
@@ -224,14 +291,14 @@
   display: block !important;
 }
 
-.rorvswild-local-panel__request-details__request {
+.rorvswild-local-panel__details__header {
   display: flex !important;
-  margin-bottom: 48px !important;
-  padding: 12px 12px 0 !important;
+  margin-bottom: 36px !important;
+  padding: 48px 12px 0 !important;
   flex-wrap: wrap !important;
 }
 
-h2.rorvswild-local-panel__request__name__title {
+h2.rorvswild-local-panel__title {
   margin:-18px 0 0 !important;
   padding:0 !important;
   font-size: 31px !important;
@@ -242,25 +309,60 @@ h2.rorvswild-local-panel__request__name__title {
 }
 
 /* details sections */
-.rorvswild-local-panel__request-details__section {
+.rorvswild-local-panel__breakdown {
+  display: flex !important;
+  position: relative !important;
+  width: calc(100% - 24px) !important;
+  margin: 0 12px 12px !important;
+  padding: 0 !important;
+  text-align: center !important;
+}
+
+.rorvswild-local-panel__breakdown li {
+  display: inline-block !important;
+  margin: 0 !important;
+  padding: 0 8px !important;
+  white-space: nowrap !important;
+  overflow: hidden !important;
+  border: 1px solid rgb(26 29 36) !important;
+  font-size: 10px !important;
+  text-transform: uppercase !important;
+  letter-spacing: 1px !important;
+}
+
+.rorvswild-local-panel__breakdown li:first-of-type { background-color:rgba(199, 203, 214, .08) !important; }
+
+.rorvswild-local-panel__breakdown li:nth-of-type(2) { background-color:rgba(199, 203, 214, .04) !important; }
+
+.rorvswild-local-panel__breakdown li:nth-of-type(3) { background-color:rgba(199, 203, 214, .02) !important; }
+
+.rorvswild-local-panel__breakdown__label {
+  display: inline-block;
+  font-weight: 400;
+  margin-right: 4px;
+}
+
+.rorvswild-local-panel__breakdown__value { font-weight: 700; }
+
+.rorvswild-local-panel__details__section {
   padding: 12px 12px 11px !important;
   border-bottom: 1px solid rgb(26 29 36) !important;
   display: block !important;
 }
 
-.rorvswild-local-panel__request-details__section:hover {
+.rorvswild-local-panel__details__section:hover {
   background: rgb(26 29 36) !important;
   transition: all .3s !important;
 }
 
-.rorvswild-local-panel__request-details__section__main {
+.rorvswild-local-panel__details__section__main {
   display: flex !important;
   gap: 8px;
   width: 100% !important;
   flex-wrap: wrap !important;
 }
 
-.rorvswild-local-panel__request-details__section__file {
+.rorvswild-local-panel__details__section__file {
   width: 100% !important;
   word-break: break-all !important;
   overflow-wrap: break-word !important;
@@ -270,16 +372,19 @@ h2.rorvswild-local-panel__request__name__title {
   gap: 8px;
 }
 
-a.rorvswild-local-panel__request-details__section__file__name {
+a.rorvswild-local-panel__file__name {
   text-decoration-color: rgb(146 149 159);
   font-weight: 700;
   text-decoration-thickness: 1px;
   text-underline-offset: 1px;
 }
 
-a.rorvswild-local-panel__request-details__section__file__name:hover { text-decoration-color: rgb(199 203 214); }
+a.rorvswild-local-panel__file__name:hover { 
+  color: rgb(223 228 242) !important;
+  text-decoration-color: rgb(199 203 214);
+}
 
-a.rorvswild-local-panel__request-details__section__file__name::after {
+a.rorvswild-local-panel__file__name::after {
   content: '↗';
   text-decoration: none;
   display: inline-block;
@@ -287,15 +392,15 @@ a.rorvswild-local-panel__request-details__section__file__name::after {
   opacity: 0.5;
 }
 
-a.rorvswild-local-panel__request-details__section__file__name:hover::after { opacity: 1; }
+a.rorvswild-local-panel__file__name:hover::after { opacity: 1; }
 
-.rorvswild-local-panel__request-details__section__file__name span {
+.rorvswild-local-panel__file__name span {
   background: rgb(38 41 49);
   text-decoration: none;
   display: inline-block;
 }
 
-.rorvswild-local-panel__request-details__section__average {
+.rorvswild-local-panel__details__section__average {
   color: rgb(182 202 255) !important;
   font-weight: 700 !important;
   width: 48px !important;
@@ -303,20 +408,20 @@ a.rorvswild-local-panel__request-details__section__file__name:hover::after { opa
   margin-left: auto;
 }
 
-.rorvswild-local-panel__request-details__section__calls {
+.rorvswild-local-panel__details__section__calls {
   color: rgb(199 203 214) !important;
   width: 48px !important;
   text-align: right;
 }
 
-.rorvswild-local-panel__request-details__section__impact {
+.rorvswild-local-panel__details__section__impact {
   color: rgb(199 203 214) !important;
   width: 48px !important;
   font-weight: 700 !important;
   text-align: right;
 }
 
-.rorvswild-local-panel__request-details__section__code {
+.rorvswild-local-panel__details__section__code {
   color: rgb(146 149 159) !important;
   background: rgb(14 15 20);
   padding: 12px;
@@ -325,7 +430,40 @@ a.rorvswild-local-panel__request-details__section__file__name:hover::after { opa
   display: none;
 }
 
-.rorvswild-local-panel__request-details__section__kind {
+.rorvswild-local-panel__details__section__code dl {
+  display: flex;
+  align-items: baseline;
+  justify-content: flex-end;
+  flex-wrap: wrap;
+  margin: 0;
+  padding: 0;
+  text-align: right;
+  gap: 12px 24px;
+}
+
+.rorvswild-local-panel__details__section__code dt {
+  white-space: nowrap;
+  margin: 0;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+  font-size: 9px !important;
+}
+
+.rorvswild-local-panel__details__section__code dd {
+  margin: 0;
+  color: rgb(182 202 255) !important;
+  font-weight: 700;
+}
+
+.rorvswild-local-panel__details__section__code dd.dd--calls {
+  color: rgb(199 203 214) !important;
+}
+
+.rorvswild-local-panel__details__section__code dl + pre[class*="language-"] {
+  margin-top: 12px !important;
+}
+
+.rorvswild-local-panel__details__section__kind {
   background: rgb(38 41 49);
   font-size: 10px !important;
   text-transform: uppercase !important;
@@ -339,23 +477,27 @@ a.rorvswild-local-panel__request-details__section__file__name:hover::after { opa
   flex-shrink: 0;
 }
 
-button.rorvswild-local-panel__request-details__section__kind {
-  box-shadow: 0 0 0 1px rgb(72 75 80) inset;
-  border: none;
-  font-weight: 700;
-  position: relative;
+button.rorvswild-local-panel__details__section__kind {
+  box-shadow: 0 0 0 1px rgb(72 75 80) inset !important;
+  border: none !important;
+  font-weight: 700 !important;
+  position: relative !important;
+  cursor: pointer !important;
 }
 
-button.rorvswild-local-panel__request-details__section__kind span {
+button.rorvswild-local-panel__details__section__kind span {
   display: inline-block;
   max-width: calc(5ch + 5px);
   white-space: nowrap;
   overflow: hidden;
 }
 
-button.rorvswild-local-panel__request-details__section__kind:hover { box-shadow: 0 0 0 1px rgb(147 149 156) inset; }
+button.rorvswild-local-panel__details__section__kind:hover { 
+  box-shadow: 0 0 0 1px rgb(147 149 156) inset;
+  background-color: rgb(14 15 20) !important;
+}
 
-button.rorvswild-local-panel__request-details__section__kind::after {
+button.rorvswild-local-panel__details__section__kind::after {
   content: "";
   display: block;
   box-sizing: border-box;
@@ -369,28 +511,88 @@ button.rorvswild-local-panel__request-details__section__kind::after {
   top:calc(50% - 3px);
 }
 
-button.rorvswild-local-panel__request-details__section__kind:hover::after { border-color: inherit; }
+button.rorvswild-local-panel__details__section__kind:hover::after { border-color: inherit; }
 
-span.rorvswild-local-panel__request-details__section__kind { 
+span.rorvswild-local-panel__details__section__kind { 
   background: rgb(14 15 20) !important;
   color: rgb(146 149 159)!important;
 }
 
-.rorvswild-local-panel__request-details__section.is-open .rorvswild-local-panel__request-details__section__code {
-  display: flex;
+.rorvswild-local-panel__details__section.is-open .rorvswild-local-panel__details__section__code {
+  display: block;
   border-bottom: 1px solid rgb(26 29 36) !important
 }
 
-.rorvswild-local-panel__request-details__section.is-open .rorvswild-local-panel__request-details__section__kind {
+.rorvswild-local-panel__details__section.is-open .rorvswild-local-panel__details__section__kind {
   color: rgb(182 202 255) !important;
   background-color: rgb(14 15 20) !important;
 }
 
-.rorvswild-local-panel__request-details__section.is-open .rorvswild-local-panel__request-details__section__kind::after {
+.rorvswild-local-panel__details__section.is-open .rorvswild-local-panel__details__section__kind::after {
   transform: rotate(225deg);
   transform-origin: 2.5px 3px;
 }
 
+.rorvswild-local-panel__card {
+  padding: 12px;
+  border: 1px solid rgb(26 29 36) !important;
+}
+
+.rorvswild-local-panel__card + .rorvswild-local-panel__card {
+  margin-top: 24px;
+}
+
+.rorvswild-local-panel__card__title {
+  color: rgb(146 149 159) !important;
+  text-align: center;
+  text-transform: uppercase;
+  font-size: 10px !important;
+  letter-spacing: 1px;
+  margin: 0 !important;
+  padding: 0 0 12px !important;
+  line-height: 24px !important;
+}
+
+.rorvswild-local-panel__card > * + * {
+  margin-top: 12px;
+}
+
+.rorvswild-local-panel__card summary:hover {
+  cursor: pointer;
+  color: rgb(223 228 242) !important;
+}
+
+.rorvswild-local-panel__card dl {
+  padding: 0;
+  margin: 0 -12px -12px;
+}
+
+.rorvswild-local-panel__card dl div {
+  display: grid;
+  grid-template-columns: 112px auto;
+  padding: 12px;
+}
+
+.rorvswild-local-panel__card dl div:hover {
+  background:rgb(26 29 36);
+}
+
+.rorvswild-local-panel__card dl div + div {
+  border-top: 1px solid rgb(26 29 36);
+}
+
+.rorvswild-local-panel__card dt {
+  color: rgb(146 149 159) !important;
+  text-transform: uppercase;
+  font-size: 10px !important;
+  letter-spacing: 1px;
+}
+
+.rorvswild-local-panel__card dd {
+  word-break: break-all !important;
+  overflow-wrap: break-word !important;
+}
+
 /* Panel Footer */
 .rorvswild-local-panel__footer {
   width: 100% !important;
@@ -407,15 +609,15 @@ a.rorvswild-local-panel__footer__link {
 }
 
 @media screen and (min-width: 720px) {
-  .rorvswild-local-panel__request-details__section__main { flex-wrap: nowrap !important; }
+  .rorvswild-local-panel__details__section__main { flex-wrap: nowrap !important; }
 
-  .rorvswild-local-panel__request__name,
-  .rorvswild-local-panel__request-details__section__file { flex: 1 !important; }
+  .rorvswild-local-panel__name,
+  .rorvswild-local-panel__details__section__file { flex: 1 !important; }
 
-  .rorvswild-local-panel__request__runtime { margin-left: 12px !important; }
+  .rorvswild-local-panel__runtime { margin-left: 12px !important; }
 
   .rorvswild-local-panel__width-limiter {
     max-width: 1520px;
     margin: 0 auto;
   }
-}
+}

data/lib/rorvswild/local/stylesheet/vendor/prism.css

@@ -18,7 +18,7 @@ http://prismjs.com/download.html?themes=prism-twilight&languages=markup+css+clik
   line-height: 24px !important;
   font-weight: 300 !important;
 
-  white-space: pre-line !important;
+  white-space: pre-wrap !important;
   word-wrap: break-word !important;
   word-break: keep-all !important;
 

data/lib/rorvswild/local.rb

@@ -4,8 +4,8 @@ require "rorvswild/local/queue"
 module RorVsWild
   module Local
     def self.start(config = {})
-      Rails.application.config.middleware.unshift(RorVsWild::Local::Middleware, nil)
       RorVsWild.start(config.merge(queue: RorVsWild::Local::Queue.new))
+      Rails.application.config.middleware.unshift(RorVsWild::Local::Middleware, nil)
     end
   end
 end

data/lib/rorvswild/plugin/action_controller.rb

@@ -22,7 +22,7 @@ module RorVsWild
             if method_name = controller.send(:method_for_action, controller.action_name)
               section.file, section.line = controller.method(method_name).source_location
               section.file = RorVsWild.agent.locator.relative_path(section.file)
-              section.command = "#{controller.class}##{method_name}"
+              section.commands << "#{controller.class}##{method_name}"
             end
             RorVsWild.agent.current_data[:name] = controller_action if RorVsWild.agent.current_data
           end

data/lib/rorvswild/plugin/action_mailer.rb

@@ -14,7 +14,7 @@ module RorVsWild
 
       def finish(name, id, payload)
         RorVsWild::Section.stop do |section|
-          section.command = payload[:mailer]
+          section.commands << payload[:mailer]
           section.kind = "mail".freeze
         end
       end

data/lib/rorvswild/plugin/action_view.rb

@@ -16,7 +16,7 @@ module RorVsWild
       def finish(name, id, payload)
         RorVsWild::Section.stop do |section|
           section.kind = "view".freeze
-          section.command = RorVsWild.agent.locator.relative_path(payload[:identifier])
+          section.commands << RorVsWild.agent.locator.relative_path(payload[:identifier])
           section.file = section.command
           section.line = 1
         end

data/lib/rorvswild/plugin/active_job.rb

@@ -12,7 +12,7 @@ module RorVsWild
         RorVsWild.agent.measure_job(job.class.name, parameters: job.arguments) do
           begin
             section = RorVsWild::Section.start
-            section.command = "#{job.class}#perform"
+            section.commands << "#{job.class}#perform"
             section.file, section.line = job.method(:perform).source_location
             section.file = RorVsWild.agent.locator.relative_path(section.file)
             block.call

data/lib/rorvswild/plugin/active_record.rb

@@ -15,13 +15,11 @@ module RorVsWild
       end
 
       IGNORED_QUERIES = %w[EXPLAIN SCHEMA].freeze
-      APPENDABLE_QUERIES = ["BEGIN", "COMMIT"].freeze
 
       def start(name, id, payload)
         return if IGNORED_QUERIES.include?(payload[:name])
         RorVsWild::Section.start do |section|
-          section.appendable_command = APPENDABLE_QUERIES.include?(payload[:sql])
-          section.command = normalize_sql_query(payload[:sql])
+          section.commands << normalize_sql_query(payload[:sql])
           section.kind = "sql"
         end
       end

data/lib/rorvswild/plugin/middleware.rb

@@ -18,7 +18,7 @@ module RorVsWild
         RorVsWild.agent.current_data[:path] = env["ORIGINAL_FULLPATH"]
         section = RorVsWild::Section.start
         section.file, section.line = rails_engine_location
-        section.command = "Rails::Engine#call"
+        section.commands << "Rails::Engine#call"
         code, headers, body = @app.call(env)
         [code, headers, body]
       ensure
@@ -35,21 +35,21 @@ module RorVsWild
       def format_server_timing_header(sections)
         sections.map do |section|
           if section.kind == "view"
-            "#{section.kind};dur=#{section.self_runtime};desc=\"#{section.file}\""
+            "#{section.kind};dur=#{section.self_ms.round};desc=\"#{section.file}\""
           else
-            "#{section.kind};dur=#{section.self_runtime};desc=\"#{section.file}:#{section.line}\""
+            "#{section.kind};dur=#{section.self_ms.round};desc=\"#{section.file}:#{section.line}\""
           end
         end.join(", ")
       end
 
       def format_server_timing_ascii(sections, total_width = 80)
-        max_time = sections.map(&:self_runtime).max
+        max_time = sections.map(&:self_ms).max
         chart_width = (total_width * 0.25).to_i
         rows = sections.map { |section|
           [
             section.kind == "view" ? section.file : "#{section.file}:#{section.line}",
-            "█" * (section.self_runtime * (chart_width-1) / max_time),
-            "#{section.self_runtime}ms"
+            "█" * (section.self_ms * (chart_width-1) / max_time),
+            "%.1fms" % section.self_ms,
           ]
         }
         time_width = rows.map { |cols| cols[2].size }.max + 1
@@ -65,7 +65,7 @@ module RorVsWild
 
       def inject_server_timing(data, headers)
         return if !data || !data[:send_server_timing] || !(sections = data[:sections])
-        sections = sections.sort_by(&:self_runtime).reverse[0,10]
+        sections = sections.sort_by(&:self_ms).reverse[0,10]
         headers["Server-Timing"] = format_server_timing_header(sections)
         if data[:name] && RorVsWild.logger.level <= Logger::Severity::DEBUG
           RorVsWild.logger.debug(["┤ #{data[:name]} ├".center(80, "─"),

data/lib/rorvswild/plugin/redis.rb

@@ -15,8 +15,7 @@ module RorVsWild
       module V4
         def process(commands, &block)
           string = commands.map(&:first).join("\n")
-          appendable = APPENDABLE_COMMANDS.include?(commands[0][0])
-          RorVsWild.agent.measure_section(string, appendable_command: appendable, kind: "redis") do
+          RorVsWild.agent.measure_section(string, kind: "redis") do
             super(commands, &block)
           end
         end
@@ -24,8 +23,7 @@ module RorVsWild
 
       module V5
         def send_command(command, &block)
-          appendable = APPENDABLE_COMMANDS.include?(command)
-          RorVsWild.agent.measure_section(command[0], appendable_command: appendable, kind: "redis") do
+          RorVsWild.agent.measure_section(command[0], kind: "redis") do
             super(command, &block)
           end
         end
@@ -38,8 +36,6 @@ module RorVsWild
           RorVsWild.agent.measure_section("multi", kind: "redis") { super }
         end
       end
-
-      APPENDABLE_COMMANDS = [:auth, :select]
     end
   end
 end

data/lib/rorvswild/queue.rb

@@ -27,6 +27,10 @@ module RorVsWild
       push_to(requests, data) if !@request_sampling_rate || rand <= @request_sampling_rate
     end
 
+    def push_error(data)
+      client.post_async("/errors", error: data)
+    end
+
     def push_to(array, data)
       mutex.synchronize do
         wakeup_thread if array.push(data).size >= FLUSH_TRESHOLD || !thread