testimonials 0.1.0

data/app/controllers/testimonials/testimonials_controller.rb

@@ -0,0 +1,194 @@
+# frozen_string_literal: true
+
+module Testimonials
+  class TestimonialsController < ApplicationController
+    PER_PAGE = 50
+
+    layout 'testimonials/application', except: :create
+
+    # create is the public widget endpoint; everything else is the dashboard.
+    before_action :require_enabled, only: :create
+    before_action :require_admin, except: :create
+    before_action :set_testimonial, only: %i[show update destroy]
+
+    # Throttle the public endpoint per IP so one user or bot can't flood the
+    # table (a submission may carry a video). Uses the rate limiter built
+    # into Rails 7.2+ (backed by Rails.cache); on Rails 7.1 this is a no-op.
+    # Tune or disable via config.rate_limit — read once at boot.
+    if respond_to?(:rate_limit) && Testimonials.config.rate_limit
+      rate_limit(**Testimonials.config.rate_limit, only: :create, with: -> { render_rate_limited })
+    end
+
+    def index
+      @status = Testimonial::STATUSES.include?(params[:status]) ? params[:status] : 'pending'
+      @kind = Testimonial::KINDS.include?(params[:kind]) ? params[:kind] : nil
+      @query = params[:q].to_s.strip.presence
+      @counts = Testimonial.group(:status).count
+
+      scope = Testimonial.where(status: @status)
+      scope = scope.where(kind: @kind) if @kind
+      scope = search(scope) if @query
+      @page = [params[:page].to_i, 1].max
+      @testimonials = scope.newest_first.offset((@page - 1) * PER_PAGE).limit(PER_PAGE + 1).to_a
+      @more = @testimonials.size > PER_PAGE
+      @testimonials = @testimonials.first(PER_PAGE)
+    end
+
+    def show; end
+
+    def update
+      @testimonial.update!(admin_params)
+      redirect_back fallback_location: testimonial_path(@testimonial), status: :see_other
+    end
+
+    def destroy
+      @testimonial.destroy!
+      redirect_to root_path, status: :see_other
+    end
+
+    def create
+      testimonial = build_testimonial
+
+      error = attach_video(testimonial) || attach_avatar(testimonial)
+      return render json: { errors: [error] }, status: :unprocessable_entity if error
+
+      if testimonial.save
+        # Purge only after a valid save, so a failed update can't strand a
+        # review with its video already gone.
+        testimonial.video_file.purge if remove_video? && testimonial.video_attached?
+        record_submission
+        notify_host(testimonial)
+        head :created
+      else
+        render json: { errors: testimonial.errors.full_messages }, status: :unprocessable_entity
+      end
+    end
+
+    private
+
+    def set_testimonial
+      @testimonial = Testimonial.find(params[:id])
+    end
+
+    def admin_params
+      params.require(:testimonial).permit(:status, :featured, :best_line)
+    end
+
+    # Case-insensitive match on the free-text columns. LOWER() keeps it
+    # portable across SQLite/PostgreSQL/MySQL, and the explicit ESCAPE makes
+    # the sanitized backslash escapes work on SQLite, which has no default
+    # LIKE escape character.
+    def search(scope)
+      pattern = "%#{Testimonial.sanitize_sql_like(@query.downcase)}%"
+      scope.where(
+        "LOWER(COALESCE(body, '')) LIKE :q ESCAPE '\\' OR LOWER(COALESCE(name, '')) LIKE :q ESCAPE '\\' " \
+        "OR LOWER(COALESCE(email, '')) LIKE :q ESCAPE '\\'",
+        q: pattern
+      )
+    end
+
+    # One review per signed-in user: a re-submission edits their existing
+    # review in place (the App Store model). The edit goes back through
+    # moderation, and the admin's best_line is cleared — it may no longer
+    # match the new wording. Guests have no reliable identity, so each guest
+    # submission stays a new record.
+    def build_testimonial
+      testimonial = existing_testimonial || Testimonial.new
+      testimonial.assign_attributes(testimonial_params)
+      if testimonial.persisted?
+        testimonial.status = 'pending'
+        testimonial.best_line = nil
+      end
+      testimonial.kind = wants_video?(testimonial) ? 'video' : 'text'
+      testimonial.source = 'widget' unless Testimonial::SOURCES.include?(testimonial.source)
+      testimonial.consent_text = testimonial.consent_given? ? Testimonials.consent_text : nil
+      testimonial.locale = I18n.locale.to_s
+      testimonial.user_agent = request.user_agent
+      attribute_author(testimonial)
+      testimonial
+    end
+
+    def existing_testimonial
+      return if current_author_id.blank?
+
+      Testimonial.where(author_id: current_author_id.to_s).newest_first.first
+    end
+
+    # A fresh upload makes it a video review; on an edit without a new
+    # upload, an already-attached video stays — unless the user removed it.
+    def wants_video?(testimonial)
+      return true if params.dig(:testimonial, :video_file).present?
+
+      testimonial.video_attached? && !remove_video?
+    end
+
+    def remove_video?
+      params.dig(:testimonial, :remove_video).present? && params.dig(:testimonial, :video_file).blank?
+    end
+
+    def testimonial_params
+      params.require(:testimonial)
+            .permit(:body, :rating, :consent_given, :page_url, :source,
+                    :name, :email, :title_company)
+    end
+
+    # Signed-in users are attributed server-side — the widget never sends
+    # (and the endpoint never trusts) contact fields for them.
+    def attribute_author(testimonial)
+      author = current_author
+      return if author.nil?
+
+      testimonial.author_id = author.id.to_s if author.respond_to?(:id)
+      display = Testimonials.config.user_display.call(author) || {}
+      testimonial.name = display[:name].presence || testimonial.name
+      testimonial.email = display[:email].presence || testimonial.email
+      testimonial.title_company = display[:title_company].presence || testimonial.title_company
+    end
+
+    # Returns an error message, or nil when everything is fine.
+    def attach_video(testimonial)
+      file = params.dig(:testimonial, :video_file)
+      return nil if file.blank?
+      return error_label(:error_save) unless Testimonials.config.video_enabled?
+      return error_label(:error_video_too_large) if file.size > Testimonials.config.max_video_size
+      return error_label(:error_save) unless file.content_type.to_s.start_with?('video/', 'audio/')
+
+      testimonial.video_file.attach(file)
+      nil
+    end
+
+    def attach_avatar(testimonial)
+      file = params.dig(:testimonial, :avatar)
+      return nil if file.blank?
+      return error_label(:error_save) unless Testimonials.config.avatars_enabled?
+      return error_label(:error_save) if file.size > Testimonials.config.max_avatar_size
+      return error_label(:error_save) unless file.content_type.to_s.start_with?('image/')
+
+      testimonial.avatar.attach(file)
+      nil
+    end
+
+    def record_submission
+      PromptEvent.record!(kind: 'testimonial', action: 'submitted',
+                          author_id: current_author_id, visitor_token: ensure_visitor_token)
+    end
+
+    # The host's hook must never turn a saved submission into a 500 — the
+    # testimonial is in the database; notification failures are the host's
+    # logs' problem.
+    def notify_host(record)
+      Testimonials.config.on_submit.call(record)
+    rescue StandardError => e
+      Rails.logger.error("testimonials: on_submit hook raised #{e.class}: #{e.message}")
+    end
+
+    def error_label(key)
+      defaults = {
+        error_save: 'Could not send. Please try again.',
+        error_video_too_large: 'The video is too large (max %{size} MB).'
+      }
+      I18n.t(key, scope: :testimonials, default: defaults[key],
+                  size: Testimonials.config.max_video_size / (1024 * 1024))
+    end
+  end
+end

data/app/controllers/testimonials/widgets_controller.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+module Testimonials
+  # Serves the widget JavaScript as a plain same-origin script. Same-origin
+  # matters: under a `script-src 'self'` (or nonce-based) CSP, an external
+  # script from the app's own host is always allowed — including when Turbo
+  # Drive swaps the <body> and re-runs body scripts under the *original*
+  # page's CSP header, where a freshly minted inline nonce would be refused.
+  class WidgetsController < ApplicationController
+    # The script is static and carries no user data; without this, Rails'
+    # cross-origin JavaScript guard refuses to serve it to a plain
+    # <script src> request.
+    skip_forgery_protection
+
+    # The script URLs carry a content fingerprint (?v=<md5>), so stale code
+    # is structurally impossible: new code means a new URL. The canonical
+    # fingerprinted URL is immutable and gets long-lived caching; anything
+    # else only ETag-revalidates.
+    def show
+      serve(Widget.javascript, Widget.fingerprint)
+    end
+
+    def dashboard
+      serve(Widget.dashboard_javascript, Widget.dashboard_fingerprint)
+    end
+
+    private
+
+    def serve(source, fingerprint)
+      expires_in 1.year, public: true if params[:v] == fingerprint
+      return unless stale?(etag: [Testimonials::VERSION, fingerprint])
+
+      render plain: source, content_type: 'text/javascript'
+    end
+  end
+end

data/app/helpers/testimonials/widget_helper.rb

@@ -0,0 +1,83 @@
+# frozen_string_literal: true
+
+module Testimonials
+  # Included into the host's ActionView. Drop `<%= testimonials_tag %>`
+  # before </body> in your layout; it renders nothing unless reviews are
+  # enabled for the request. The widget stays invisible until opened — by a
+  # `testimonial_prompt!` from a controller (throttled), by any element with a
+  # `data-testimonial-prompt` attribute, or by `window.Testimonials.open()`.
+  #
+  # `testimonials_button` renders a ready-made opener with a localized
+  # label ("Leave a review", or "Update your review" once the user has one),
+  # so hosts get a user-facing entry point without any i18n setup.
+  module WidgetHelper
+    def testimonials_tag
+      return unless Testimonials.enabled?(request)
+
+      Widget.snippet(
+        locale: I18n.locale,
+        authenticated: testimonials_author.present?,
+        auto_open: testimonials_auto_open,
+        existing: testimonials_existing_testimonial,
+        nonce: (content_security_policy_nonce if respond_to?(:content_security_policy_nonce))
+      ).html_safe
+    end
+
+    # A plain, unstyled <button> so it picks up the host's own styles. Put it
+    # anywhere on a page that also renders testimonials_tag. Pass label: to
+    # override the localized default, and any other options (class:, etc.)
+    # through to the tag.
+    def testimonials_button(label: nil, **)
+      return unless Testimonials.enabled?(request)
+
+      tag.button(label || testimonials_cta_label, type: 'button', 'data-testimonial-prompt': '', **)
+    end
+
+    # The localized call-to-action on its own — "Leave a review", or "Update
+    # your review" once the user has one — for hosts composing their own
+    # opener markup (icons, list items) around a data-testimonial-prompt element.
+    def testimonials_cta_label
+      if testimonials_existing_testimonial
+        I18n.t(:update_title, scope: :testimonials, default: 'Update your review')
+      else
+        I18n.t(:cta, scope: :testimonials, default: 'Leave a review')
+      end
+    end
+
+    private
+
+    def testimonials_author
+      return @testimonials_author if defined?(@testimonials_author)
+
+      @testimonials_author = Testimonials.config.current_user.call(request)
+    end
+
+    # One review per signed-in user: this is the record the widget opens
+    # pre-filled, and the one the create endpoint updates in place.
+    def testimonials_existing_testimonial
+      return @testimonials_existing_testimonial if defined?(@testimonials_existing_testimonial)
+
+      author = testimonials_author
+      @testimonials_existing_testimonial =
+        author.respond_to?(:id) ? Testimonial.where(author_id: author.id.to_s).newest_first.first : nil
+    end
+
+    # A prompt requested via testimonial_prompt! rides the flash, so it survives
+    # the usual redirect-after-create. It only reaches the page if the
+    # throttle ledger agrees — call testimonial_prompt! as often as you like.
+    def testimonials_auto_open
+      kind = flash[:testimonials_prompt].to_s
+      return unless Testimonials::PromptEvent::KINDS.include?(kind)
+      return if kind == 'nps' && !Testimonials.config.nps
+
+      author = testimonials_author
+      return unless Testimonials::PromptEvent.eligible?(
+        kind: kind,
+        author_id: author.respond_to?(:id) ? author.id : nil,
+        visitor_token: cookies[:testimonials_vid]
+      )
+
+      kind
+    end
+  end
+end

data/app/models/testimonials/application_record.rb

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

data/app/models/testimonials/nps_response.rb

@@ -0,0 +1,24 @@
+# frozen_string_literal: true
+
+module Testimonials
+  # One answer to "How likely are you to recommend us?" (0–10).
+  class NpsResponse < ApplicationRecord
+    validates :score, presence: true, inclusion: { in: 0..10 }
+
+    scope :newest_first, -> { order(id: :desc) }
+
+    def promoter? = score >= 9
+    def passive? = score.between?(7, 8)
+    def detractor? = score <= 6
+
+    # The classic Net Promoter Score: %promoters − %detractors, −100..100.
+    def self.score(scope = all)
+      total = scope.count
+      return nil if total.zero?
+
+      promoters = scope.where(score: 9..10).count
+      detractors = scope.where(score: 0..6).count
+      ((promoters - detractors) * 100.0 / total).round
+    end
+  end
+end

data/app/models/testimonials/prompt_event.rb

@@ -0,0 +1,60 @@
+# frozen_string_literal: true
+
+module Testimonials
+  # The throttling ledger. Every auto-open is a "shown", every close without
+  # submitting is a "dismissed", every saved submission is a "submitted" —
+  # keyed by author_id for signed-in users, by a visitor cookie otherwise.
+  # eligible? reads this history so the widget never nags:
+  #
+  #   * submitted a testimonial     -> never auto-prompted for one again
+  #   * submitted NPS               -> not again within nps_reprompt_after
+  #   * shown or dismissed recently -> not again within reprompt_after
+  #   * shown max_prompts times     -> never auto-prompted for that kind again
+  #
+  # Explicit opens (the user clicked something) bypass all of this.
+  class PromptEvent < ApplicationRecord
+    KINDS = %w[testimonial nps].freeze
+    ACTIONS = %w[shown dismissed submitted].freeze
+
+    validates :kind, inclusion: { in: KINDS }
+    validates :action, inclusion: { in: ACTIONS }
+
+    class << self
+      def record!(kind:, action:, author_id: nil, visitor_token: nil)
+        return if author_id.blank? && visitor_token.blank?
+
+        create!(kind: kind.to_s, action: action.to_s,
+                author_id: author_id.presence, visitor_token: visitor_token.presence)
+      end
+
+      def eligible?(kind:, author_id: nil, visitor_token: nil)
+        kind = kind.to_s
+        return false unless KINDS.include?(kind)
+        # No identity, no history: a brand-new visitor is always eligible.
+        return true if author_id.blank? && visitor_token.blank?
+
+        history = subject(author_id, visitor_token).where(kind: kind)
+        config = Testimonials.config
+
+        return false if submitted_recently?(history, kind, config)
+        return false if history.where(action: %w[shown dismissed])
+                               .exists?(created_at: (Time.current - config.reprompt_after)..)
+
+        history.where(action: 'shown').count < config.max_prompts
+      end
+
+      private
+
+      def subject(author_id, visitor_token)
+        author_id.present? ? where(author_id: author_id.to_s) : where(visitor_token: visitor_token)
+      end
+
+      def submitted_recently?(history, kind, config)
+        submitted = history.where(action: 'submitted')
+        return submitted.exists? if kind == 'testimonial'
+
+        submitted.exists?(created_at: (Time.current - config.nps_reprompt_after)..)
+      end
+    end
+  end
+end

data/app/models/testimonials/testimonial.rb

@@ -0,0 +1,53 @@
+# frozen_string_literal: true
+
+module Testimonials
+  # One testimonial — text or video. Author attribution is optional and
+  # stored as loose fields (no foreign key to the host's user table) so the
+  # model is portable across apps with different user models.
+  class Testimonial < ApplicationRecord
+    KINDS = %w[text video].freeze
+    STATUSES = %w[pending approved archived].freeze
+    SOURCES = %w[widget page nps].freeze
+
+    if defined?(::ActiveStorage)
+      has_one_attached :video_file
+      has_one_attached :avatar
+    end
+
+    validates :kind, inclusion: { in: KINDS }
+    validates :status, inclusion: { in: STATUSES }
+    validates :source, inclusion: { in: SOURCES }
+    validates :body, presence: true, if: -> { kind == 'text' }
+    validates :rating, inclusion: { in: 1..5 }, allow_nil: true
+
+    scope :newest_first, -> { order(id: :desc) }
+    scope :approved, -> { where(status: 'approved') }
+    # What the read API serves: approved by an admin AND consented by the
+    # customer. Both, always.
+    scope :publishable, -> { approved.where(consent_given: true) }
+    scope :featured_first, -> { order(featured: :desc, id: :desc) }
+
+    STATUSES.each do |status|
+      define_method(:"#{status}?") { self.status == status }
+    end
+
+    def video? = kind == 'video'
+
+    def video_attached?
+      respond_to?(:video_file) && video_file.attached?
+    end
+
+    def avatar_attached?
+      respond_to?(:avatar) && avatar.attached?
+    end
+
+    def display_name
+      name.presence || (author_id.present? ? "##{author_id}" : nil)
+    end
+
+    # The curated pull-quote when the admin picked one, else the full text.
+    def quote
+      best_line.presence || body
+    end
+  end
+end

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

@@ -0,0 +1,118 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title><%= t('testimonials.dashboard.title', default: 'Testimonials') %></title>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <%= csrf_meta_tags %>
+  <%# Same-origin script instead of inline handlers, so delete confirms and
+      the auto-submitting filter work under strict script-src CSPs. %>
+  <%= javascript_include_tag "#{dashboard_script_path}?v=#{Testimonials::Widget.dashboard_fingerprint}",
+                             defer: true, nonce: true %>
+  <style>
+    :root {
+      color-scheme: light dark;
+      --bg: #f6f7f9; --surface: #fff; --text: #1c2024; --muted: #6b7280;
+      --border: #e5e7eb; --accent: #2563eb; --accent-text: #fff;
+      --pending: #d97706; --approved: #16a34a; --archived: #6b7280;
+      --star: #f59e0b; --danger: #dc2626;
+      --promoter: #16a34a; --passive: #d97706; --detractor: #dc2626;
+    }
+    @media (prefers-color-scheme: dark) {
+      :root {
+        --bg: #111418; --surface: #1a1f26; --text: #e6e8ea; --muted: #9aa2ab;
+        --border: #2a313a; --accent: #3b82f6;
+      }
+    }
+    * { box-sizing: border-box; }
+    body { margin: 0; background: var(--bg); color: var(--text);
+           font: 15px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
+    a { color: var(--accent); text-decoration: none; }
+    a:hover { text-decoration: underline; }
+    .container { max-width: 1020px; margin: 0 auto; padding: 24px 16px 64px; }
+    h1 { font-size: 22px; margin: 0 0 16px; }
+    h1.title-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
+    .nav { display: flex; gap: 8px; align-items: center; margin-bottom: 16px; flex-wrap: wrap; }
+    .nav a { padding: 6px 16px; border: 1px solid var(--border); border-radius: 999px;
+             background: var(--surface); color: var(--muted); font-weight: 600; }
+    .nav a:hover { text-decoration: none; color: var(--text); }
+    .nav a.active { background: var(--accent); border-color: var(--accent); color: var(--accent-text); }
+    .nav a.active:hover { color: var(--accent-text); }
+    .share-link { margin-left: auto; font-size: 13px; font-weight: 400; }
+    .tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border); margin-bottom: 16px; flex-wrap: wrap; }
+    .tabs a { padding: 8px 14px; border-radius: 8px 8px 0 0; color: var(--muted); }
+    .tabs a.active { color: var(--text); font-weight: 600; border: 1px solid var(--border);
+                     border-bottom: 2px solid var(--surface); background: var(--surface); margin-bottom: -1px; }
+    .tabs a:hover { text-decoration: none; color: var(--text); }
+    .count { display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 4px; border-radius: 999px;
+             background: var(--border); font-size: 12px; text-align: center; }
+    .filters { margin-bottom: 16px; display: flex; gap: 8px; align-items: center; }
+    .filters select, .filters input[type=search] { padding: 6px 8px; border: 1px solid var(--border);
+                      border-radius: 8px; background: var(--surface); color: var(--text); font: inherit; }
+    .filters input[type=search] { flex: 1; max-width: 320px; }
+    .card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
+    .card.pad { padding: 16px; overflow: visible; }
+    table { width: 100%; border-collapse: collapse; }
+    th, td { padding: 10px 14px; text-align: left; vertical-align: top; }
+    th { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted);
+         border-bottom: 1px solid var(--border); }
+    tr + tr td { border-top: 1px solid var(--border); }
+    .badge { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 600;
+             color: #fff; white-space: nowrap; }
+    .badge.status-pending { background: var(--pending); }
+    .badge.status-approved { background: var(--approved); }
+    .badge.status-archived { background: var(--archived); }
+    .badge.nps-promoter { background: var(--promoter); }
+    .badge.nps-passive { background: var(--passive); }
+    .badge.nps-detractor { background: var(--detractor); }
+    .stars { color: var(--star); letter-spacing: 1px; white-space: nowrap; }
+    .stars .off { color: var(--border); }
+    .muted { color: var(--muted); font-size: 13px; }
+    .pager { margin-top: 16px; display: flex; gap: 16px; }
+    .actions { display: flex; gap: 8px; flex-wrap: wrap; margin: 16px 0; }
+    .actions form { display: inline; }
+    td.row-actions { white-space: nowrap; text-align: right; }
+    td.row-actions form { display: inline-block; }
+    td.row-actions form + form { margin-left: 6px; }
+    button, .button { padding: 8px 14px; border: 1px solid var(--border); border-radius: 8px; cursor: pointer;
+                      background: var(--surface); color: var(--text); font: inherit; }
+    button.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-text); }
+    button.danger { color: var(--danger); }
+    button.small { padding: 3px 10px; font-size: 13px; }
+    .message { white-space: pre-wrap; overflow-wrap: anywhere; }
+    dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
+    dt { color: var(--muted); }
+    dd { margin: 0; overflow-wrap: anywhere; }
+    video.playback { width: 100%; max-width: 480px; border-radius: 10px; background: #000; }
+    img.avatar { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
+    .empty { padding: 48px 16px; text-align: center; color: var(--muted); }
+    .breadcrumb { margin-bottom: 12px; font-size: 13px; }
+    .stat-row { display: flex; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
+    .stat { flex: 1; min-width: 140px; background: var(--surface); border: 1px solid var(--border);
+            border-radius: 12px; padding: 14px 16px; }
+    .stat b { display: block; font-size: 26px; }
+    .stat span { color: var(--muted); font-size: 13px; }
+    .best-line-form textarea { width: 100%; padding: 8px; border: 1px solid var(--border); border-radius: 8px;
+                             background: var(--surface); color: var(--text); font: inherit; resize: vertical; }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <div class="nav">
+      <%= link_to t('testimonials.dashboard.title', default: 'Testimonials'), root_path,
+                  class: ('active' unless controller_name == 'nps_responses') %>
+      <% if Testimonials.config.nps %>
+        <%= link_to t('testimonials.dashboard.nps', default: 'NPS'), nps_responses_path,
+                    class: ('active' if controller_name == 'nps_responses') %>
+      <% end %>
+      <%# The shareable collection page — drop this link into an email or DM. %>
+      <% if Testimonials.config.public_collection %>
+        <a class="button share-link" href="<%= collection_url %>" target="_blank" rel="noopener"
+           title="<%= collection_url %>">
+          🔗 <%= t('testimonials.dashboard.collection_page', default: 'Ask for testimonials') %>
+        </a>
+      <% end %>
+    </div>
+    <%= yield %>
+  </div>
+</body>
+</html>

data/app/views/layouts/testimonials/collection.html.erb

@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title><%= t('testimonials.page.title', app: Testimonials.app_name, default: "Share your experience with #{Testimonials.app_name}") %></title>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <%= csrf_meta_tags %>
+  <style>
+    :root { color-scheme: light dark; }
+    body { margin: 0; background: #f6f7f9; color: #1c2024;
+           font: 16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
+    @media (prefers-color-scheme: dark) { body { background: #111418; color: #e6e8ea; } }
+    .container { max-width: 640px; margin: 0 auto; padding: 48px 16px 64px; }
+    h1 { font-size: 28px; text-align: center; margin: 0 0 8px; }
+    .subtitle { text-align: center; color: #6b7280; margin: 0 0 32px; }
+    @media (prefers-color-scheme: dark) { .subtitle { color: #9aa2ab; } }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <%= yield %>
+  </div>
+</body>
+</html>

data/app/views/testimonials/collection/show.html.erb

@@ -0,0 +1,12 @@
+<h1><%= t('testimonials.page.title', app: Testimonials.app_name, default: "Share your experience with #{Testimonials.app_name}") %></h1>
+<p class="subtitle"><%= t('testimonials.page.subtitle', default: 'Your words help others decide — thank you!') %></p>
+
+<div data-testimonials-inline></div>
+
+<%= Testimonials::Widget.snippet(
+      locale: I18n.locale,
+      authenticated: Testimonials.config.current_user.call(request).present?,
+      mode: 'page',
+      existing: @existing,
+      nonce: (content_security_policy_nonce if respond_to?(:content_security_policy_nonce))
+    ).html_safe %>