error_radar 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 017c3eb241a062270368e74bf4a38e52caaf303ddfdc1848c3e1f88d0ea8219a
+  data.tar.gz: '08d6b0982d7cfae71bdde4c466948b0091e1c000091030a8c6c5507139c32136'
+SHA512:
+  metadata.gz: 887a6d150b9e3bbcade9f208f80b0ef89755b229716cf1d2798bd72fb1feb4b13a8feb480178fda95bf36e9b291426895066e5043ea22a48ac830f86887d8de6
+  data.tar.gz: 67e779feaef2bafc575a3aa6b52c1d8af20e907d22edc1b4e769a5cab6a88969984503b74c9a1f6df70b51367d98ed5d7cb254b2ea405741bef4c09600057179

data/CHANGELOG.md

@@ -0,0 +1,11 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+## [0.1.0] - 2026-06-18
+
+### Added
+- Initial release.
+- Captures unhandled exceptions from controllers, Rack, Sidekiq and ActiveJob.
+- Deduplicates errors by fingerprint.
+- Kanban dashboard (and optional RailsAdmin board) to triage errors as tasks.

data/MIT-LICENSE

@@ -0,0 +1,20 @@
+Copyright chienbn9x
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
+CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
+SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,106 @@
+# Error Radar
+
+Drop-in error tracking & task board for Rails apps. Captures unhandled
+exceptions from **controllers, Rack, Sidekiq and ActiveJob**, deduplicates them
+by fingerprint (a flood of the same failure stays one task with an occurrence
+count), and ships a kanban dashboard — plus an optional RailsAdmin board — to
+triage them as tasks (`open → in_progress → resolved → ignored`).
+
+It is built as a **mountable Rails Engine**, so the model, middleware, routes,
+dashboard and migration all come from the gem. Everything app-specific
+(authentication, custom exception types, server expectations) is injected via a
+small config block.
+
+## Requirements
+
+- Rails `>= 7.0`, Ruby `>= 3.0`
+- Optional: Sidekiq (job capture + server panel), RailsAdmin (admin board)
+
+> Rails 8 note: the model uses the classic `enum name: {...}` form. On Rails 8
+> switch it to `enum :name, {...}` (see `app/models/error_radar/error_log.rb`).
+
+## Install
+
+```ruby
+# Gemfile
+gem 'error_radar', git: 'https://github.com/chienbn9x/error_radar.git'
+# or, while developing locally:
+gem 'error_radar', path: '../error_radar'
+```
+
+```bash
+bundle install
+bin/rails generate error_radar:install   # creates initializer + migration
+bin/rails db:migrate
+```
+
+Mount the dashboard:
+
+```ruby
+# config/routes.rb
+authenticate :admin do                     # your own guard, optional
+  mount ErrorRadar::Engine, at: '/monitoring'
+end
+```
+
+Visit `/monitoring`.
+
+## Configure
+
+`config/initializers/error_radar.rb` (generated):
+
+```ruby
+ErrorRadar.configure do |config|
+  config.enabled = !Rails.env.test?
+
+  # Dashboard auth
+  config.authenticate = ->(controller) { controller.send(:authenticate_admin!) }
+  config.current_user = ->(controller) { controller.current_admin&.email }
+
+  # Teach it about your own API error type
+  config.categorize { |e| :external_api if e.is_a?(MyApi::Error) }
+  config.extract_details do |e|
+    { http_status: e.status, request_url: e.url, api_code: e.code } if e.is_a?(MyApi::Error)
+  end
+end
+```
+
+## Use
+
+```ruby
+# Capture an exception with context
+ErrorRadar.capture(e, source: 'HealthController#index', context: { check: :redis })
+
+# Log a problem without an exception
+ErrorRadar.notify('Webhook signature mismatch', category: :external_api, severity: :warning)
+
+# Wrap a boundary the middleware/Sidekiq hooks don't cover (rake tasks, cron)
+ErrorRadar.monitor('NightlyReindex', context: { batch: 1 }) { do_work }
+```
+
+Web requests and Sidekiq jobs are captured automatically once installed. For
+non-Sidekiq ActiveJob adapters, include the concern:
+
+```ruby
+class ApplicationJob < ActiveJob::Base
+  include ErrorRadar::Integrations::ActiveJob
+end
+```
+
+## What gets stored
+
+`ErrorRadar::ErrorLog` (`error_radar_error_logs`): category, severity, status,
+error_class, source, message, backtrace, JSON context, HTTP/API fields,
+occurrence count, first/last seen, and resolution metadata. Identical errors
+roll up by a SHA1 fingerprint of `(category, error_class, source,
+normalized_message)`.
+
+## Design notes
+
+- **Never raises.** Every capture path rescues internally and logs to
+  `Rails.logger` — error tracking must not break the code it watches.
+- **Decoupled.** No host model, controller or constant is referenced directly;
+  app-specifics arrive through `ErrorRadar.config`.
+- **Self-contained dashboard.** Charts use Chart.js from a CDN (no `chartkick`
+  dependency); the kanban uses SortableJS.
+```

data/Rakefile

@@ -0,0 +1,5 @@
+# frozen_string_literal: true
+
+require 'bundler/gem_tasks'
+
+task default: :build

data/app/controllers/error_radar/application_controller.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module ErrorRadar
+  class ApplicationController < ActionController::Base
+    protect_from_forgery with: :exception
+    layout 'error_radar/application'
+
+    private
+
+    # Delegates to the host-configured auth proc. nil => open access.
+    def authenticate_request!
+      auth = ErrorRadar.config.authenticate
+      return if auth.nil?
+
+      auth.call(self)
+    end
+
+    def error_radar_current_user
+      cu = ErrorRadar.config.current_user
+      cu.respond_to?(:call) ? cu.call(self) : nil
+    end
+  end
+end

data/app/controllers/error_radar/dashboard_controller.rb

@@ -0,0 +1,82 @@
+# frozen_string_literal: true
+
+module ErrorRadar
+  # Error-monitoring dashboard: summary stats, simple charts and a drag-and-drop
+  # kanban board over ErrorLog statuses.
+  class DashboardController < ApplicationController
+    before_action :authenticate_request!
+    before_action :set_error, only: %i[show update_status]
+
+    KANBAN_LIMIT = 100
+    SEVERITY_ORDER = { 'critical' => 0, 'error' => 1, 'warning' => 2, 'info' => 3 }.freeze
+
+    def index
+      @total          = ErrorLog.count
+      @open_count     = ErrorLog.status_open.count
+      @in_progress    = ErrorLog.status_in_progress.count
+      @resolved_count = ErrorLog.status_resolved.count
+      @ignored_count  = ErrorLog.status_ignored.count
+      @unresolved     = @open_count + @in_progress
+
+      @by_category = ErrorLog.unresolved.group(:category).count
+      @by_severity = ErrorLog.unresolved.group(:severity).count
+
+      # Distinct error-tasks last seen per day (last 30 days), grouped in Ruby to
+      # avoid relying on DB named-timezone tables.
+      @trend = ErrorLog.where(last_seen_at: 30.days.ago..)
+                       .pluck(:last_seen_at)
+                       .group_by { |t| t.in_time_zone.to_date }
+                       .transform_values(&:size)
+                       .sort.to_h
+                       .transform_keys { |d| d.strftime('%m/%d') }
+
+      @top = ErrorLog.unresolved.order(occurrences: :desc).limit(10)
+
+      monitor = ErrorRadar::ServerMonitor.new
+      @servers = monitor.statuses
+      @unexpected = monitor.unexpected_processes
+
+      @columns = ErrorLog.statuses.keys.index_with do |status|
+        ErrorLog.where(status: ErrorLog.statuses[status])
+                .order(last_seen_at: :desc)
+                .limit(KANBAN_LIMIT)
+                .to_a
+                .sort_by { |e| [SEVERITY_ORDER.fetch(e.severity, 9), -e.last_seen_at.to_i] }
+      end
+
+      @external_links = build_external_links
+    end
+
+    def show; end
+
+    def update_status
+      new_status = params[:status].to_s
+      unless ErrorLog.statuses.key?(new_status)
+        return render json: { ok: false, error: 'invalid status' }, status: :unprocessable_entity
+      end
+
+      if new_status == 'resolved'
+        @error.resolve!(by: error_radar_current_user)
+      else
+        @error.update!(status: new_status, resolved_at: nil)
+      end
+
+      render json: { ok: true, id: @error.id, status: @error.status }
+    end
+
+    private
+
+    def set_error
+      @error = ErrorLog.find(params[:id])
+    end
+
+    def build_external_links
+      links = {}
+      if defined?(::RailsAdmin)
+        links[:rails_admin] = (rails_admin.index_path(model_name: 'error_radar~error_log') rescue nil)
+      end
+      links[:sidekiq] = '/sidekiq' if defined?(::Sidekiq::Web)
+      links.compact
+    end
+  end
+end

data/app/models/error_radar/application_record.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+module ErrorRadar
+  class ApplicationRecord < ActiveRecord::Base
+    self.abstract_class = true
+  end
+end

data/app/models/error_radar/error_log.rb

@@ -0,0 +1,95 @@
+# frozen_string_literal: true
+
+require 'digest'
+
+module ErrorRadar
+  # One row per distinct failure (collapsed by fingerprint). Doubles as a task
+  # on the triage board. Table: error_radar_error_logs.
+  class ErrorLog < ApplicationRecord
+    enum category: {
+      application:  0, # generic Ruby/Rails runtime error
+      external_api: 1, # any 3rd-party API error
+      background_job: 2, # uncategorised background-job failure
+      syntax:       3, # SyntaxError / NameError / NoMethodError / ArgumentError / TypeError
+      database:     4, # ActiveRecord / DB level
+      network:      5  # timeouts, connection resets, DNS, ...
+    }, _prefix: :category
+
+    enum severity: { info: 0, warning: 1, error: 2, critical: 3 }, _prefix: :severity
+
+    enum status: { open: 0, in_progress: 1, resolved: 2, ignored: 3 }, _prefix: :status
+
+    validates :fingerprint, presence: true, uniqueness: true
+    validates :first_seen_at, :last_seen_at, presence: true
+
+    scope :open,        -> { where(status: statuses[:open]) }
+    scope :in_progress, -> { where(status: statuses[:in_progress]) }
+    scope :resolved,    -> { where(status: statuses[:resolved]) }
+    scope :ignored,     -> { where(status: statuses[:ignored]) }
+    scope :unresolved,  -> { where(status: [statuses[:open], statuses[:in_progress]]) }
+    scope :recent,      -> { order(last_seen_at: :desc) }
+
+    # Record (or roll-up) an error. Idempotent per fingerprint: identical errors
+    # increment `occurrences` and bump `last_seen_at` instead of creating a new
+    # row. NEVER raises — logging must not break the calling code path.
+    def self.record(category:, message:, severity: :error, error_class: nil, source: nil,
+                    backtrace: nil, context: {}, http_status: nil, request_url: nil,
+                    api_code: nil, api_subcode: nil, fingerprint: nil)
+      now = Time.current
+      fp  = presence(fingerprint) || build_fingerprint(category: category, error_class: error_class, source: source, message: message)
+
+      log = find_or_initialize_by(fingerprint: fp)
+
+      if log.persisted?
+        log.occurrences += 1
+        log.status = :open if log.status_resolved? || log.status_ignored?
+      else
+        log.assign_attributes(
+          category: category, severity: severity, error_class: error_class, source: source,
+          http_status: http_status, request_url: request_url, api_code: api_code, api_subcode: api_subcode,
+          first_seen_at: now, status: :open
+        )
+      end
+
+      log.message      = message.to_s.truncate(ErrorRadar.config.max_message_length)
+      log.backtrace    = presence(Array(backtrace).join("\n")) || log.backtrace
+      log.context      = (log.context || {}).merge(context.presence || {}).deep_stringify_keys if context.present? || log.context
+      log.severity     = severity if log.new_record? || severity_rank(severity) > severity_rank(log.severity)
+      log.last_seen_at = now
+      log.save!
+      log
+    rescue StandardError => e
+      ErrorRadar::Tracking.warn_internal("ErrorLog.record failed: #{e.class}: #{e.message}")
+      nil
+    end
+
+    def self.build_fingerprint(category:, error_class:, source:, message:)
+      normalized = message.to_s
+                          .gsub(/\d+/, '#')                        # ids, counts, timestamps
+                          .gsub(/0x[0-9a-f]+/i, '0x#')             # object addresses
+                          .gsub(/[0-9a-f]{8}-[0-9a-f-]{27}/i, '#') # uuids
+                          .strip
+      Digest::SHA1.hexdigest([category, error_class, source, normalized].join('|'))
+    end
+
+    def self.severity_rank(value)
+      severities[value.to_s] || 0
+    end
+
+    def self.presence(value)
+      value.respond_to?(:empty?) ? (value.empty? ? nil : value) : value
+    end
+
+    def short_message
+      message.to_s.truncate(120)
+    end
+
+    def resolve!(by: nil, note: nil)
+      update!(status: :resolved, resolved_at: Time.current, resolved_by: by, resolution_note: note.presence || resolution_note)
+    end
+
+    def reopen!
+      update!(status: :open, resolved_at: nil)
+    end
+  end
+end

data/app/views/error_radar/dashboard/index.html.erb

@@ -0,0 +1,185 @@
+<%
+  sev_colors = { 'info' => '#17a2b8', 'warning' => '#fd7e14', 'error' => '#dc3545', 'critical' => '#7b001c' }
+  status_labels = { 'open' => 'Open', 'in_progress' => 'In progress', 'resolved' => 'Resolved', 'ignored' => 'Ignored' }
+%>
+
+<h1>🛰 Error Radar</h1>
+<div class="sub">
+  Track &amp; triage system errors
+  <% @external_links.each do |label, href| %>
+    · <%= link_to(label.to_s.humanize, href) %>
+  <% end %>
+</div>
+
+<div class="cards">
+  <div class="card tot"><div class="n"><%= @total %></div><div class="l">Total</div></div>
+  <div class="card open"><div class="n"><%= @open_count %></div><div class="l">Open</div></div>
+  <div class="card prog"><div class="n"><%= @in_progress %></div><div class="l">In progress</div></div>
+  <div class="card res"><div class="n"><%= @resolved_count %></div><div class="l">Resolved</div></div>
+  <div class="card ign"><div class="n"><%= @ignored_count %></div><div class="l">Ignored</div></div>
+</div>
+
+<% if (@servers || []).any? %>
+  <div class="panel" style="margin-bottom:20px">
+    <h2>Job Servers (Sidekiq · realtime from Redis)</h2>
+    <div style="display:grid;grid-template-columns:repeat(4,1fr);gap:12px">
+      <% @servers.each do |s| %>
+        <div style="border:1px solid #e5e7eb;border-radius:10px;padding:12px;border-left:5px solid <%= s.up ? '#28a745' : '#dc3545' %>">
+          <div style="display:flex;justify-content:space-between;align-items:center">
+            <strong style="font-size:13px"><%= s.name %></strong>
+            <span class="badge" style="background: <%= s.up ? '#28a745' : '#dc3545' %>"><%= s.up ? 'UP' : 'DOWN' %></span>
+          </div>
+          <% if s.processes.any? %>
+            <% p = s.processes.first %>
+            <div style="font-size:11px;color:#6b7280;margin-top:6px">
+              host: <%= p[:hostname] %> · tag: <%= p[:tag] %><br>
+              busy <%= p[:busy] %>/<%= p[:concurrency] %> · RSS <%= p[:rss] %>KB<br>
+              heartbeat: <%= s.last_beat_ago %>s ago<%= ' · QUIET' if p[:quiet] %><br>
+              queues: <%= p[:queues].join(', ') %>
+            </div>
+          <% else %>
+            <div style="font-size:11px;color:#dc3545;margin-top:6px">No live process found.</div>
+          <% end %>
+        </div>
+      <% end %>
+    </div>
+    <% if (@unexpected || []).any? %>
+      <div style="font-size:11px;color:#6b7280;margin-top:10px">
+        Unregistered processes (<%= @unexpected.size %>):
+        <%= @unexpected.map { |p| "#{p[:hostname]}/#{p[:tag]} [#{p[:queues].join(',')}]" }.join(' · ') %>
+      </div>
+    <% end %>
+  </div>
+<% end %>
+
+<div class="grid2">
+  <div class="panel">
+    <h2>Errors per day (30 days · by occurrences)</h2>
+    <canvas id="chart-trend" height="120"
+            data-type="line"
+            data-values="<%= @trend.to_json %>"
+            data-color="#dc3545"></canvas>
+  </div>
+  <div class="panel">
+    <h2>Unresolved — by category</h2>
+    <canvas id="chart-category" height="120"
+            data-type="doughnut"
+            data-values="<%= @by_category.to_json %>"></canvas>
+  </div>
+</div>
+
+<div class="grid2">
+  <div class="panel">
+    <h2>Top 10 errors (unresolved, by occurrences)</h2>
+    <table>
+      <thead><tr><th>Severity</th><th>Source</th><th>Message</th><th>Count</th><th>Last seen</th></tr></thead>
+      <tbody>
+        <% @top.each do |e| %>
+          <tr>
+            <td><span class="badge" style="background: <%= sev_colors[e.severity] %>"><%= e.severity %></span></td>
+            <td><%= link_to e.source.presence || e.error_class, error_path(e) %></td>
+            <td><%= e.short_message %></td>
+            <td><%= e.occurrences %></td>
+            <td><%= e.last_seen_at&.strftime('%m/%d %H:%M') %></td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </div>
+  <div class="panel">
+    <h2>Unresolved — by severity</h2>
+    <canvas id="chart-severity" height="120"
+            data-type="bar"
+            data-values="<%= @by_severity.to_json %>"
+            data-color="#fd7e14"></canvas>
+  </div>
+</div>
+
+<div class="panel" style="margin-bottom:20px">
+  <h2>Kanban — drag a card to change status</h2>
+  <div class="kanban">
+    <% %w[open in_progress resolved ignored].each do |status| %>
+      <% items = @columns[status] || [] %>
+      <div class="col">
+        <h3><%= status_labels[status] %> <span class="count"><%= items.size %></span></h3>
+        <div class="col-list" data-status="<%= status %>">
+          <% items.each do |e| %>
+            <div class="ticket sev-<%= e.severity %>" data-id="<%= e.id %>" data-url="<%= error_status_path(e) %>">
+              <div class="src"><%= link_to (e.source.presence || e.error_class || 'unknown'), error_path(e) %></div>
+              <div class="msg"><%= e.short_message %></div>
+              <div class="meta">
+                <span><%= e.category %></span>
+                <span class="occ">×<%= e.occurrences %></span>
+                <span><%= e.last_seen_at&.strftime('%m/%d %H:%M') %></span>
+              </div>
+            </div>
+          <% end %>
+        </div>
+      </div>
+    <% end %>
+  </div>
+</div>
+
+<script>
+  (function () {
+    var token = document.querySelector('meta[name="csrf-token"]').content;
+
+    // --- charts (Chart.js) ---
+    var palette = ['#dc3545', '#fd7e14', '#17a2b8', '#7b001c', '#28a745', '#6c757d', '#2563eb'];
+    document.querySelectorAll('canvas[data-values]').forEach(function (el) {
+      var values = JSON.parse(el.dataset.values || '{}');
+      var labels = Object.keys(values);
+      var data = labels.map(function (k) { return values[k]; });
+      var type = el.dataset.type || 'bar';
+      var single = el.dataset.color || '#2563eb';
+      new Chart(el, {
+        type: type,
+        data: {
+          labels: labels,
+          datasets: [{
+            data: data,
+            backgroundColor: (type === 'doughnut') ? palette : single,
+            borderColor: single,
+            fill: false,
+            tension: 0.3
+          }]
+        },
+        options: {
+          plugins: { legend: { display: type === 'doughnut' } },
+          scales: (type === 'doughnut') ? {} : { y: { beginAtZero: true } }
+        }
+      });
+    });
+
+    // --- kanban ---
+    function toast(msg, ok) {
+      var t = document.getElementById('toast');
+      t.textContent = msg; t.style.background = ok ? '#16a34a' : '#dc2626';
+      t.classList.add('show'); setTimeout(function () { t.classList.remove('show'); }, 2000);
+    }
+    document.querySelectorAll('.col-list').forEach(function (list) {
+      Sortable.create(list, {
+        group: 'kanban', animation: 150,
+        onAdd: function (evt) {
+          var url = evt.item.dataset.url;
+          var status = evt.to.dataset.status;
+          fetch(url, {
+            method: 'PATCH',
+            headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': token },
+            body: JSON.stringify({ status: status })
+          }).then(function (r) { return r.json(); })
+            .then(function (d) {
+              if (d.ok) { toast('Moved #' + d.id + ' → ' + d.status, true); updateCounts(); }
+              else { toast('Error: ' + (d.error || 'update failed'), false); }
+            })
+            .catch(function () { toast('Network error on update', false); });
+        }
+      });
+    });
+    function updateCounts() {
+      document.querySelectorAll('.col').forEach(function (col) {
+        col.querySelector('.count').textContent = col.querySelectorAll('.ticket').length;
+      });
+    }
+  })();
+</script>

data/app/views/error_radar/dashboard/show.html.erb

@@ -0,0 +1,72 @@
+<%
+  sev_colors = { 'info' => '#17a2b8', 'warning' => '#fd7e14', 'error' => '#dc3545', 'critical' => '#7b001c' }
+  status_colors = { 'open' => '#dc3545', 'in_progress' => '#fd7e14', 'resolved' => '#28a745', 'ignored' => '#6c757d' }
+%>
+
+<div class="sub"><%= link_to '← Back to dashboard', root_path %></div>
+
+<div class="panel">
+  <h1 style="font-size:18px">
+    <span class="badge" style="background: <%= status_colors[@error.status] %>"><%= @error.status %></span>
+    <span class="badge" style="background: <%= sev_colors[@error.severity] %>"><%= @error.severity %></span>
+    <%= @error.source.presence || @error.error_class %>
+  </h1>
+  <div class="sub"><%= @error.category %> · ×<%= @error.occurrences %> times · last seen <%= @error.last_seen_at&.strftime('%Y/%m/%d %H:%M') %></div>
+
+  <table>
+    <tr><th style="width:160px">Error class</th><td><%= @error.error_class %></td></tr>
+    <tr><th>Message</th><td><%= @error.message %></td></tr>
+    <tr><th>First seen</th><td><%= @error.first_seen_at %></td></tr>
+    <tr><th>Last seen</th><td><%= @error.last_seen_at %></td></tr>
+    <% if @error.http_status || @error.api_code %>
+      <tr><th>HTTP / API code</th><td><%= @error.http_status %> / code=<%= @error.api_code %> subcode=<%= @error.api_subcode %></td></tr>
+      <tr><th>Request URL</th><td style="word-break:break-all"><%= @error.request_url %></td></tr>
+    <% end %>
+    <% if @error.resolved_at %>
+      <tr><th>Resolved</th><td><%= @error.resolved_at %> by <%= @error.resolved_by %></td></tr>
+      <tr><th>Note</th><td><%= @error.resolution_note %></td></tr>
+    <% end %>
+  </table>
+</div>
+
+<div class="panel" style="margin-top:16px">
+  <h2>Context</h2>
+  <pre style="white-space:pre-wrap;background:#f8fafc;padding:12px;border-radius:8px;max-height:320px;overflow:auto"><%= JSON.pretty_generate(@error.context || {}) %></pre>
+</div>
+
+<div class="panel" style="margin-top:16px">
+  <h2>Backtrace</h2>
+  <pre style="white-space:pre-wrap;background:#f8fafc;padding:12px;border-radius:8px;max-height:480px;overflow:auto"><%= @error.backtrace %></pre>
+</div>
+
+<div class="panel" style="margin-top:16px">
+  <h2>Change status</h2>
+  <% %w[open in_progress resolved ignored].each do |status| %>
+    <button class="status-btn" data-url="<%= error_status_path(@error) %>" data-status="<%= status %>"
+            style="padding:8px 14px;margin-right:8px;border:0;border-radius:8px;color:#fff;cursor:pointer;background: <%= status_colors[status] %>">
+      <%= status %>
+    </button>
+  <% end %>
+</div>
+
+<script>
+  (function () {
+    var token = document.querySelector('meta[name="csrf-token"]').content;
+    document.querySelectorAll('.status-btn').forEach(function (btn) {
+      btn.addEventListener('click', function () {
+        fetch(btn.dataset.url, {
+          method: 'PATCH',
+          headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': token },
+          body: JSON.stringify({ status: btn.dataset.status })
+        }).then(function (r) { return r.json(); })
+          .then(function (d) {
+            var t = document.getElementById('toast');
+            t.textContent = d.ok ? ('Moved → ' + d.status) : ('Error: ' + d.error);
+            t.style.background = d.ok ? '#16a34a' : '#dc2626';
+            t.classList.add('show');
+            setTimeout(function () { location.reload(); }, 700);
+          });
+      });
+    });
+  })();
+</script>