context_drop 0.1.0

data/app/views/context_drop/dashboard/feedbacks/show.html.erb

@@ -0,0 +1,121 @@
+<div style="display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.25rem;">
+  <div style="display: flex; align-items: center; gap: 0.75rem;">
+    <a href="<%= dashboard_feedbacks_path %>" class="cd-btn">&larr; Back to List</a>
+    <h1 style="margin: 0; font-size: 1.25rem;">Feedback #<%= @feedback.id %></h1>
+    <span class="cd-badge cd-badge-<%= @feedback.status %>"><%= @feedback.status %></span>
+  </div>
+
+  <div style="display: flex; gap: 0.5rem; flex-wrap: wrap;">
+    <% [
+      ["reviewed", "Mark Reviewed"],
+      ["resolved", "Mark Resolved"],
+      ["dismissed", "Dismiss"]
+    ].each do |target_status, label| %>
+      <%= form_with url: dashboard_feedback_path(@feedback), method: :patch, local: true, style: "display: inline;" do %>
+        <input type="hidden" name="status" value="<%= target_status %>">
+        <button type="submit"
+                class="cd-btn <%= 'cd-btn-primary' if target_status == 'resolved' %>"
+                <%= "disabled" if @feedback.status == target_status %>>
+          <%= label %>
+        </button>
+      <% end %>
+    <% end %>
+  </div>
+</div>
+
+<div class="cd-card">
+  <h2 style="margin-top: 0; font-size: 1rem; color: var(--cd-muted);">Feedback Message</h2>
+  <p style="font-size: 1rem; white-space: pre-wrap; margin: 0 0 1.25rem 0;"><%= @feedback.message.presence || "(No message text provided)" %></p>
+
+  <dl class="cd-meta-list">
+    <dt>Page URL</dt>
+    <dd><code class="cd-mono"><%= @feedback.page_url %></code></dd>
+    <dt>Submitter</dt>
+    <dd><%= @feedback.submitter_label %></dd>
+    <dt>Submitted At</dt>
+    <dd><%= @feedback.created_at&.iso8601 %></dd>
+    <dt>User Agent</dt>
+    <dd><%= @feedback.user_agent.presence || "N/A" %></dd>
+    <dt>Metadata</dt>
+    <dd><code class="cd-mono"><%= JSON.generate(@feedback.metadata || {}) %></code></dd>
+  </dl>
+</div>
+
+<div class="cd-card">
+  <h2 style="margin-top: 0; font-size: 1rem;">
+    DOM Element References (<%= @feedback.element_references.size %>)
+  </h2>
+
+  <% if @feedback.element_references.empty? %>
+    <p style="color: var(--cd-muted); margin: 0;">No DOM elements were selected for this submission.</p>
+  <% else %>
+    <div class="cd-grid">
+      <% @feedback.element_references.each do |el| %>
+        <div style="border: 1px solid var(--cd-border); border-radius: 0.5rem; padding: 1rem;">
+          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem;">
+            <code class="cd-mono">&lt;<%= el.tag_name %>&gt;</code>
+            <% if el.captured_at %>
+              <span style="font-size: 0.75rem; color: var(--cd-muted);"><%= el.captured_at.iso8601 %></span>
+            <% end %>
+          </div>
+          <dl class="cd-meta-list">
+            <dt>Selector</dt>
+            <dd><code class="cd-mono"><%= el.selector %></code></dd>
+            <dt>DOM Path</dt>
+            <dd><code class="cd-mono"><%= el.dom_path.presence || "N/A" %></code></dd>
+            <dt>Text Content</dt>
+            <dd><%= el.text_content.presence || "(empty)" %></dd>
+            <dt>Bounding Rect</dt>
+            <dd><code class="cd-mono"><%= JSON.generate(el.bounding_rect || {}) %></code></dd>
+            <dt>Viewport</dt>
+            <dd><code class="cd-mono"><%= JSON.generate(el.viewport || {}) %></code></dd>
+            <dt>Attributes</dt>
+            <dd><code class="cd-mono"><%= JSON.generate(el.attributes_snapshot || {}) %></code></dd>
+          </dl>
+        </div>
+      <% end %>
+    </div>
+  <% end %>
+</div>
+
+<div class="cd-card">
+  <h2 style="margin-top: 0; font-size: 1rem;">
+    Screenshots &amp; Attachments (<%= @feedback.attachments.size %>)
+  </h2>
+
+  <% if @feedback.attachments.empty? %>
+    <p style="color: var(--cd-muted); margin: 0;">No binary attachments or screenshots were included.</p>
+  <% else %>
+    <div class="cd-grid">
+      <% @feedback.attachments.each do |att| %>
+        <div style="border: 1px solid var(--cd-border); border-radius: 0.5rem; padding: 1rem;">
+          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem;">
+            <span class="cd-badge cd-badge-new"><%= att.attachment_type %></span>
+            <% if att.element_reference %>
+              <span style="font-size: 0.75rem; color: var(--cd-muted);">
+                Element: <code class="cd-mono"><%= att.element_reference.selector %></code>
+              </span>
+            <% end %>
+          </div>
+
+          <% if att.respond_to?(:file) && att.file.attached? %>
+            <div style="margin: 0.5rem 0;">
+              <% if main_app.respond_to?(:url_for) %>
+                <img src="<%= main_app.url_for(att.file) %>"
+                     alt="Attachment #<%= att.id %>"
+                     style="max-width: 100%; border-radius: 0.375rem; border: 1px solid var(--cd-border);" />
+              <% end %>
+            </div>
+            <div style="font-size: 0.75rem; color: var(--cd-muted);">
+              <%= att.file.filename %> (<%= att.file.content_type %>, <%= att.file.byte_size %> bytes)
+            </div>
+          <% end %>
+
+          <div style="margin-top: 0.5rem;">
+            <code class="cd-mono"><%= JSON.generate(att.metadata || {}) %></code>
+          </div>
+        </div>
+      <% end %>
+    </div>
+  <% end %>
+</div>

data/app/views/layouts/context_drop/application.html.erb

@@ -0,0 +1,215 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>ContextDrop — Feedback Triage Dashboard</title>
+  <%= csrf_meta_tags if respond_to?(:csrf_meta_tags) %>
+  <style>
+    :root {
+      --cd-bg: #f8fafc;
+      --cd-surface: #ffffff;
+      --cd-border: #e2e8f0;
+      --cd-text: #0f172a;
+      --cd-muted: #64748b;
+      --cd-primary: #2563eb;
+      --cd-primary-hover: #1d4ed8;
+      --cd-new-bg: #dbeafe;
+      --cd-new-text: #1e40af;
+      --cd-reviewed-bg: #fef3c7;
+      --cd-reviewed-text: #92400e;
+      --cd-resolved-bg: #dcfce7;
+      --cd-resolved-text: #166534;
+      --cd-dismissed-bg: #f1f5f9;
+      --cd-dismissed-text: #475569;
+    }
+    * { box-sizing: border-box; }
+    body {
+      margin: 0;
+      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+      background: var(--cd-bg);
+      color: var(--cd-text);
+      line-height: 1.5;
+    }
+    .cd-header {
+      background: var(--cd-surface);
+      border-bottom: 1px solid var(--cd-border);
+      padding: 0.875rem 1.5rem;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+    .cd-brand {
+      font-weight: 700;
+      font-size: 1.125rem;
+      color: var(--cd-text);
+      text-decoration: none;
+      display: flex;
+      align-items: center;
+      gap: 0.5rem;
+    }
+    .cd-brand-badge {
+      font-size: 0.75rem;
+      font-weight: 600;
+      padding: 0.125rem 0.5rem;
+      border-radius: 9999px;
+      background: var(--cd-new-bg);
+      color: var(--cd-new-text);
+    }
+    .cd-container {
+      max-width: 1200px;
+      margin: 1.5rem auto;
+      padding: 0 1.5rem;
+    }
+    .cd-flash {
+      padding: 0.75rem 1rem;
+      border-radius: 0.5rem;
+      margin-bottom: 1rem;
+      font-size: 0.875rem;
+      border: 1px solid var(--cd-border);
+      background: var(--cd-surface);
+    }
+    .cd-flash-notice { border-color: #86efac; background: #f0fdf4; color: #166534; }
+    .cd-flash-alert { border-color: #fca5a5; background: #fef2f2; color: #991b1b; }
+    .cd-card {
+      background: var(--cd-surface);
+      border: 1px solid var(--cd-border);
+      border-radius: 0.75rem;
+      padding: 1.25rem;
+      margin-bottom: 1.25rem;
+      box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+    }
+    .cd-tabs {
+      display: flex;
+      gap: 0.5rem;
+      flex-wrap: wrap;
+      margin-bottom: 1rem;
+    }
+    .cd-tab {
+      display: inline-flex;
+      align-items: center;
+      gap: 0.375rem;
+      padding: 0.4rem 0.85rem;
+      border-radius: 0.5rem;
+      font-size: 0.875rem;
+      font-weight: 500;
+      color: var(--cd-muted);
+      text-decoration: none;
+      border: 1px solid transparent;
+    }
+    .cd-tab:hover { background: #f1f5f9; color: var(--cd-text); }
+    .cd-tab.active {
+      background: var(--cd-surface);
+      color: var(--cd-primary);
+      border-color: var(--cd-border);
+      font-weight: 600;
+    }
+    .cd-filter-bar {
+      display: flex;
+      gap: 0.75rem;
+      flex-wrap: wrap;
+      margin-bottom: 1rem;
+    }
+    .cd-input {
+      padding: 0.5rem 0.75rem;
+      border: 1px solid var(--cd-border);
+      border-radius: 0.5rem;
+      font-size: 0.875rem;
+      min-width: 220px;
+    }
+    .cd-btn {
+      display: inline-flex;
+      align-items: center;
+      gap: 0.375rem;
+      padding: 0.5rem 0.9rem;
+      border-radius: 0.5rem;
+      font-size: 0.875rem;
+      font-weight: 500;
+      border: 1px solid var(--cd-border);
+      background: var(--cd-surface);
+      color: var(--cd-text);
+      cursor: pointer;
+      text-decoration: none;
+    }
+    .cd-btn:hover { background: #f8fafc; }
+    .cd-btn-primary {
+      background: var(--cd-primary);
+      border-color: var(--cd-primary);
+      color: #ffffff;
+    }
+    .cd-btn-primary:hover { background: var(--cd-primary-hover); }
+    .cd-table {
+      width: 100%;
+      border-collapse: collapse;
+      font-size: 0.875rem;
+    }
+    .cd-table th, .cd-table td {
+      text-align: left;
+      padding: 0.75rem 0.875rem;
+      border-bottom: 1px solid var(--cd-border);
+      vertical-align: top;
+    }
+    .cd-table th {
+      font-weight: 600;
+      color: var(--cd-muted);
+      font-size: 0.75rem;
+      text-transform: uppercase;
+      letter-spacing: 0.04em;
+    }
+    .cd-badge {
+      display: inline-flex;
+      align-items: center;
+      padding: 0.15rem 0.55rem;
+      border-radius: 9999px;
+      font-size: 0.75rem;
+      font-weight: 600;
+      text-transform: capitalize;
+    }
+    .cd-badge-new { background: var(--cd-new-bg); color: var(--cd-new-text); }
+    .cd-badge-reviewed { background: var(--cd-reviewed-bg); color: var(--cd-reviewed-text); }
+    .cd-badge-resolved { background: var(--cd-resolved-bg); color: var(--cd-resolved-text); }
+    .cd-badge-dismissed { background: var(--cd-dismissed-bg); color: var(--cd-dismissed-text); }
+    .cd-mono {
+      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+      font-size: 0.8125rem;
+      background: #f1f5f9;
+      padding: 0.15rem 0.4rem;
+      border-radius: 0.25rem;
+    }
+    .cd-grid {
+      display: grid;
+      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+      gap: 1rem;
+    }
+    .cd-meta-list {
+      margin: 0;
+      display: grid;
+      grid-template-columns: 140px 1fr;
+      row-gap: 0.5rem;
+      font-size: 0.875rem;
+    }
+    .cd-meta-list dt { color: var(--cd-muted); font-weight: 500; }
+    .cd-meta-list dd { margin: 0; word-break: break-all; }
+  </style>
+</head>
+<body>
+  <header class="cd-header">
+    <a class="cd-brand" href="<%= dashboard_feedbacks_path %>">
+      <span>ContextDrop</span>
+      <span class="cd-brand-badge">Feedback Triage</span>
+    </a>
+    <span style="font-size: 0.8125rem; color: var(--cd-muted);">v<%= ContextDrop::VERSION %></span>
+  </header>
+
+  <main class="cd-container">
+    <% if flash[:notice].present? %>
+      <div class="cd-flash cd-flash-notice"><%= flash[:notice] %></div>
+    <% end %>
+    <% if flash[:alert].present? %>
+      <div class="cd-flash cd-flash-alert"><%= flash[:alert] %></div>
+    <% end %>
+
+    <%= yield %>
+  </main>
+</body>
+</html>

data/config/routes.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+ContextDrop::Engine.routes.draw do
+  get "config", to: "configs#show"
+  get "assets/context_drop.js", to: "configs#widget_bundle"
+  post "attachments", to: "attachments#create"
+  post "feedback", to: "feedbacks#create"
+  get "health", to: "health#show"
+  post "mcp", to: "mcp#create"
+
+  namespace :dashboard do
+    root to: "feedbacks#index"
+    resources :feedbacks, only: %i[index show update]
+  end
+
+  root to: "dashboard/feedbacks#index"
+end

data/db/migrate/20261109000001_create_context_drop_feedbacks.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+class CreateContextDropFeedbacks < ActiveRecord::Migration[7.1]
+  def change
+    json_type = connection.adapter_name.downcase.include?("postgres") ? :jsonb : :json
+
+    create_table :context_drop_feedbacks do |t|
+      t.references :submitter, polymorphic: true, null: true, index: { name: "idx_context_drop_feedbacks_on_submitter" }
+      t.string :session_id, null: true
+      t.text :message, null: true
+      t.string :page_url, null: false
+      t.string :user_agent, null: true
+      t.public_send(json_type, :metadata, null: false, default: {})
+      t.string :status, null: false, default: "new"
+
+      t.timestamps
+    end
+
+    add_index :context_drop_feedbacks, :status
+    add_index :context_drop_feedbacks, :created_at
+    add_index :context_drop_feedbacks, :page_url
+  end
+end

data/db/migrate/20261109000002_create_context_drop_element_references.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+class CreateContextDropElementReferences < ActiveRecord::Migration[7.1]
+  def change
+    json_type = connection.adapter_name.downcase.include?("postgres") ? :jsonb : :json
+
+    create_table :context_drop_element_references do |t|
+      t.references :feedback,
+                   null: false,
+                   foreign_key: { to_table: :context_drop_feedbacks, on_delete: :cascade },
+                   index: { name: "idx_context_drop_element_refs_on_feedback_id" }
+      t.string :client_ref, null: true
+      t.string :tag_name, null: false
+      t.string :selector, null: false
+      t.string :dom_path, null: true
+      t.text :text_content, null: true
+      t.public_send(json_type, :attributes_snapshot, null: false, default: {})
+      t.public_send(json_type, :bounding_rect, null: false, default: {})
+      t.public_send(json_type, :viewport, null: false, default: {})
+      t.public_send(json_type, :metadata, null: false, default: {})
+      t.datetime :captured_at, null: true
+
+      t.timestamps
+    end
+
+    add_index :context_drop_element_references, :selector
+    add_index :context_drop_element_references, :tag_name
+  end
+end

data/db/migrate/20261109000003_create_context_drop_attachments.rb

@@ -0,0 +1,24 @@
+# frozen_string_literal: true
+
+class CreateContextDropAttachments < ActiveRecord::Migration[7.1]
+  def change
+    json_type = connection.adapter_name.downcase.include?("postgres") ? :jsonb : :json
+
+    create_table :context_drop_attachments do |t|
+      t.references :feedback,
+                   null: false,
+                   foreign_key: { to_table: :context_drop_feedbacks, on_delete: :cascade },
+                   index: { name: "idx_context_drop_attachments_on_feedback_id" }
+      t.references :element_reference,
+                   null: true,
+                   foreign_key: { to_table: :context_drop_element_references, on_delete: :nullify },
+                   index: { name: "idx_context_drop_attachments_on_element_ref_id" }
+      t.string :attachment_type, null: false
+      t.public_send(json_type, :metadata, null: false, default: {})
+
+      t.timestamps
+    end
+
+    add_index :context_drop_attachments, :attachment_type
+  end
+end

data/lib/context_drop/base64_util.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module ContextDrop
+  module Base64Util
+    module_function
+
+    def strict_encode64(bin)
+      [bin.to_s.b].pack("m0")
+    end
+
+    def strict_decode64(str)
+      str.to_s.unpack1("m0")
+    end
+  end
+end

data/lib/context_drop/configuration.rb

@@ -0,0 +1,155 @@
+# frozen_string_literal: true
+
+module ContextDrop
+  class Configuration
+    VALID_POSITIONS = %i[bottom_right bottom_left top_right top_left].freeze
+
+    MANDATORY_EXCLUDED_SELECTORS = [
+      "[data-feedback-ignore]",
+      "[data-feedback-sensitive]",
+      "input[type='password']",
+      "input[type='hidden']",
+      "[autocomplete^='cc-']"
+    ].freeze
+
+    DEFAULT_ALLOWED_CONTENT_TYPES = %w[
+      image/png
+      image/jpeg
+      image/webp
+      image/gif
+    ].freeze
+
+    attr_accessor :enabled,
+                  :storage,
+                  :active_storage_service,
+                  :allow_anonymous,
+                  :max_attachments,
+                  :max_element_references,
+                  :max_attachment_size,
+                  :allowed_content_types,
+                  :max_image_dimensions,
+                  :element_selection,
+                  :screenshot_capture,
+                  :element_capture_padding,
+                  :excluded_selectors,
+                  :current_submitter,
+                  :authorize_submission,
+                  :authorize_dashboard,
+                  :rate_limit,
+                  :on_feedback_created,
+                  :mcp_enabled,
+                  :mcp_api_key,
+                  :authorize_mcp
+
+    attr_reader :position
+
+    def initialize
+      @enabled = false
+      @position = :bottom_right
+      @storage = :active_storage
+      @active_storage_service = nil
+      @allow_anonymous = true
+
+      @max_attachments = 10
+      @max_element_references = 10
+      @max_attachment_size = 10 * 1024 * 1024 # 10 MB
+      @allowed_content_types = DEFAULT_ALLOWED_CONTENT_TYPES.dup
+      @max_image_dimensions = [4096, 4096]
+
+      @element_selection = true
+      @screenshot_capture = true
+      @element_capture_padding = 16
+
+      @excluded_selectors = MANDATORY_EXCLUDED_SELECTORS.dup
+
+      @current_submitter = lambda do |controller|
+        controller.respond_to?(:current_user, true) ? controller.send(:current_user) : nil
+      end
+
+      @authorize_submission = ->(_controller) { true }
+
+      @authorize_dashboard = lambda do |controller|
+        user = controller.respond_to?(:current_user, true) ? controller.send(:current_user) : nil
+        is_admin = user.respond_to?(:admin?) && user.admin?
+        is_dev = defined?(Rails) && Rails.respond_to?(:env) && Rails.env.development?
+        Boolean(is_admin || is_dev)
+      end
+
+      @rate_limit = { max_requests: 20, period: 3600 }
+      @on_feedback_created = ->(_feedback) {}
+
+      @mcp_enabled = false
+      @mcp_api_key = nil
+      @authorize_mcp = nil
+    end
+
+    def position=(value)
+      sym = value.to_s.strip.to_sym
+      unless VALID_POSITIONS.include?(sym)
+        raise ArgumentError, "Invalid ContextDrop position #{value.inspect}. Must be one of: #{VALID_POSITIONS.join(', ')}"
+      end
+
+      @position = sym
+    end
+
+    def effective_excluded_selectors
+      (MANDATORY_EXCLUDED_SELECTORS + Array(@excluded_selectors).map(&:to_s)).uniq
+    end
+
+    def resolve_submitter(controller)
+      return nil unless @current_submitter.respond_to?(:call)
+
+      @current_submitter.call(controller)
+    end
+
+    def submission_authorized?(controller)
+      submitter = resolve_submitter(controller)
+      return false if !@allow_anonymous && submitter.nil?
+      return true unless @authorize_submission.respond_to?(:call)
+
+      !!@authorize_submission.call(controller)
+    end
+
+    def dashboard_authorized?(controller)
+      return false unless @authorize_dashboard.respond_to?(:call)
+
+      !!@authorize_dashboard.call(controller)
+    end
+
+    def public_widget_config(overrides = {})
+      resolved_position = overrides[:position] ? normalize_position(overrides[:position]) : @position
+
+      {
+        enabled: !!@enabled,
+        position: resolved_position.to_s,
+        placeholder: (overrides[:placeholder] || "What would you like to tell us?").to_s,
+        features: {
+          element_selection: !!@element_selection,
+          screenshot_capture: !!@screenshot_capture,
+          element_capture_padding: @element_capture_padding.to_i
+        },
+        limits: {
+          max_attachments: @max_attachments.to_i,
+          max_element_references: @max_element_references.to_i,
+          max_attachment_size: @max_attachment_size.to_i,
+          allowed_content_types: Array(@allowed_content_types),
+          max_image_dimensions: Array(@max_image_dimensions)
+        },
+        privacy: {
+          excluded_selectors: effective_excluded_selectors
+        }
+      }
+    end
+
+    private
+
+    def normalize_position(pos)
+      sym = pos.to_s.strip.to_sym
+      VALID_POSITIONS.include?(sym) ? sym : @position
+    end
+
+    def Boolean(val) # rubocop:disable Naming/MethodName
+      !!val
+    end
+  end
+end

data/lib/context_drop/engine.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+module ContextDrop
+  class Engine < ::Rails::Engine
+    isolate_namespace ContextDrop
+
+    initializer "context_drop.assets" do |app|
+      if app.config.respond_to?(:assets) && app.config.assets.respond_to?(:paths)
+        app.config.assets.paths << root.join("app/assets/javascripts").to_s
+        app.config.assets.paths << root.join("app/assets/stylesheets").to_s
+        app.config.assets.paths << root.join("app/javascript").to_s
+
+        if app.config.assets.respond_to?(:precompile)
+          app.config.assets.precompile += %w[
+            context_drop/context_drop.js
+            context_drop/application.css
+          ]
+        end
+      end
+    end
+
+    initializer "context_drop.helpers" do
+      ActiveSupport.on_load(:action_view) do
+        include ContextDrop::WidgetHelper
+      end
+    end
+
+    rake_tasks do
+      load File.expand_path("../tasks/context_drop_tasks.rake", __dir__)
+    end
+  end
+end