ruby_cms 0.2.1.1 → 1.0.1

data/lib/generators/ruby_cms/templates/views/admin/audit_log_entries/show.html.erb

@@ -0,0 +1,89 @@
+<%
+  entry = @audit_log_entry
+  severity = entry.severity
+  bucket = entry.bucket
+  badge_classes = case severity
+  when :danger  then "bg-red-50 text-red-700 border-red-100"
+  when :success then "bg-green-50 text-green-700 border-green-100"
+  else
+                    case bucket
+                    when "content"  then "bg-blue-50 text-blue-700 border-blue-100"
+                    when "users"    then "bg-purple-50 text-purple-700 border-purple-100"
+                    when "security" then "bg-amber-50 text-amber-700 border-amber-100"
+                    else                  "bg-[#faf8f3] text-[#57534e] border-[#e9e4d4]"
+                    end
+  end
+%>
+<%= AdminPage do %>
+  <%= AdminPageHeader(
+    title: entry.target_label.presence || entry.action,
+    subtitle: entry.created_at.strftime("%Y-%m-%d %H:%M:%S"),
+    breadcrumbs: [
+      { label: t("ruby_cms.admin.breadcrumb.admin", default: "Admin"), url: admin_root_path },
+      { label: t("ruby_cms.admin.audit_log.title", default: "Audit log"), url: admin_audit_log_entries_path },
+      { label: "##{entry.id}" }
+    ]
+  ) do %>
+    <%= link_to admin_audit_log_entries_path, class: "inline-flex items-center gap-1.5 h-8 px-3 rounded-md border border-[#e9e4d4] bg-white text-[#1c1917] text-[12.5px] font-medium hover:bg-[#faf8f3] transition-colors no-underline" do %>
+      <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18" /></svg>
+      <%= t("admin.pages.common.back", default: "Terug") %>
+    <% end %>
+  <% end %>
+
+  <div class="px-6 py-5 space-y-6">
+    <div class="flex items-center gap-3">
+      <span class="inline-flex items-center px-2 py-0.5 rounded-full text-[11px] font-medium border <%= badge_classes %>"><%= entry.action %></span>
+      <span class="text-[12px] text-[#a8a29e]"><%= bucket %></span>
+    </div>
+
+    <section>
+      <h3 class="text-[11px] font-semibold uppercase tracking-[0.06em] text-[#a8a29e] mb-3">
+        <%= t("ruby_cms.admin.audit_log.details", default: "Details") %>
+      </h3>
+      <dl class="grid grid-cols-[140px_1fr] gap-x-4 gap-y-2 text-[13px]">
+        <dt class="text-[#78716c]"><%= t("ruby_cms.admin.audit_log.entry_id", default: "Entry ID") %></dt>
+        <dd class="font-mono text-[#1c1917]"><%= entry.id %></dd>
+
+        <dt class="text-[#78716c]"><%= t("ruby_cms.admin.audit_log.actor", default: "Actor") %></dt>
+        <dd class="text-[#1c1917]"><%= entry.actor_email %></dd>
+
+        <dt class="text-[#78716c]"><%= t("ruby_cms.admin.audit_log.action", default: "Actie") %></dt>
+        <dd class="font-mono text-[#1c1917]"><%= entry.action %></dd>
+
+        <% if entry.target_type.present? %>
+          <dt class="text-[#78716c]"><%= t("ruby_cms.admin.audit_log.target", default: "Target") %></dt>
+          <dd class="text-[#1c1917]"><%= entry.target_type %><% if entry.target_id %>#<%= entry.target_id %><% end %><% if entry.target_label.present? %> · <%= entry.target_label %><% end %></dd>
+        <% end %>
+
+        <dt class="text-[#78716c]">IP</dt>
+        <dd class="font-mono text-[#1c1917]"><%= entry.ip || "—" %></dd>
+
+        <% if entry.user_agent.present? %>
+          <dt class="text-[#78716c]">User agent</dt>
+          <dd class="text-[#57534e] text-[12px] break-all"><%= entry.user_agent %></dd>
+        <% end %>
+
+        <dt class="text-[#78716c]"><%= t("ruby_cms.admin.audit_log.timestamp", default: "Tijdstip") %></dt>
+        <dd class="text-[#1c1917]"><%= entry.created_at.strftime("%Y-%m-%d %H:%M:%S") %></dd>
+      </dl>
+    </section>
+
+    <% if entry.summary.present? %>
+      <section>
+        <h3 class="text-[11px] font-semibold uppercase tracking-[0.06em] text-[#a8a29e] mb-3">
+          <%= t("ruby_cms.admin.audit_log.summary", default: "Samenvatting") %>
+        </h3>
+        <p class="text-[13.5px] text-[#1c1917]"><%= entry.summary %></p>
+      </section>
+    <% end %>
+
+    <% if entry.metadata.present? %>
+      <section>
+        <h3 class="text-[11px] font-semibold uppercase tracking-[0.06em] text-[#a8a29e] mb-3">
+          <%= t("ruby_cms.admin.audit_log.metadata", default: "Metadata") %>
+        </h3>
+        <pre class="font-mono text-[12px] text-[#1c1917] bg-[#faf8f3] border border-[#e9e4d4] rounded-md p-3 overflow-x-auto"><%= JSON.pretty_generate(entry.metadata) %></pre>
+      </section>
+    <% end %>
+  </div>
+<% end %>

data/lib/generators/ruby_cms/templates/views/admin/commands/index.html.erb

@@ -0,0 +1,393 @@
+<%
+  category_meta = {
+    "all"         => { label: t("ruby_cms.admin.commands.cat.all",         default: "Alle"),         tone: "slate"  },
+    "content"     => { label: t("ruby_cms.admin.commands.cat.content",     default: "Content"),      tone: "blue"   },
+    "maintenance" => { label: t("ruby_cms.admin.commands.cat.maintenance", default: "Onderhoud"),    tone: "amber"  },
+    "email"       => { label: t("ruby_cms.admin.commands.cat.email",       default: "E-mail"),       tone: "purple" },
+    "custom"      => { label: t("ruby_cms.admin.commands.cat.custom",      default: "Overig"),       tone: "green"  }
+  }
+
+  tone_classes = {
+    "slate"  => { chip_bg: "bg-stone-100",  chip_fg: "text-stone-600",  pill_bg: "bg-stone-100",  pill_fg: "text-stone-700",  pill_ring: "ring-stone-200"  },
+    "blue"   => { chip_bg: "bg-blue-50",    chip_fg: "text-blue-700",   pill_bg: "bg-blue-50",    pill_fg: "text-blue-700",   pill_ring: "ring-blue-200"   },
+    "amber"  => { chip_bg: "bg-amber-50",   chip_fg: "text-amber-700",  pill_bg: "bg-amber-50",   pill_fg: "text-amber-700",  pill_ring: "ring-amber-200"  },
+    "purple" => { chip_bg: "bg-purple-50",  chip_fg: "text-purple-600", pill_bg: "bg-purple-50",  pill_fg: "text-purple-600", pill_ring: "ring-purple-200" },
+    "green"  => { chip_bg: "bg-green-50",   chip_fg: "text-green-700",  pill_bg: "bg-green-50",   pill_fg: "text-green-700",  pill_ring: "ring-green-200"  }
+  }
+
+  cat_icon_svg = {
+    "all"         => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M12 4l9 5-9 5-9-5 9-5zM3 14l9 5 9-5"/>',
+    "content"     => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M4 4h11a3 3 0 013 3v13H7a3 3 0 01-3-3V4zm3 4h8m-8 4h8m-8 4h5"/>',
+    "maintenance" => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9M20 20v-5h-.581m0 0a8.003 8.003 0 01-15.357-2"/>',
+    "email"       => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M3 8l9 6 9-6M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>',
+    "custom"      => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M13 10V3L4 14h7v7l9-11h-7z"/>'
+  }
+
+  rel_time = lambda { |t|
+    next t("ruby_cms.admin.commands.never", default: "Nog nooit") if t.blank?
+    "#{time_ago_in_words(t)} #{t('ruby_cms.admin.commands.ago', default: 'geleden')}"
+  }
+
+  fmt_dur = lambda { |ms|
+    n = ms.to_i
+    if n < 1000 then "#{n}ms"
+    elsif n < 60_000 then format("%.2fs", n / 1000.0)
+    else
+      m = n / 60_000
+      s = (n % 60_000) / 1000
+      "#{m}m #{s}s"
+    end
+  }
+
+  active_key  = params[:active].presence || @commands.first&.dig(:key)
+  active_cmd  = @commands.find { |c| c[:key] == active_key } || @commands.first
+
+  history_by_cmd = @history.group_by(&:command_key)
+
+  cat_keys    = ([ "all" ] + @commands.map { |c| c[:category] || "custom" }.uniq).uniq
+%>
+
+<%= AdminPage do %>
+  <%= AdminPageHeader(
+    title: t("ruby_cms.admin.commands.title", default: "Commando's"),
+    subtitle: t("ruby_cms.admin.commands.subtitle", default: "Run geregistreerde Rake-taken en bekijk de geschiedenis."),
+    breadcrumbs: [
+      { label: t("ruby_cms.admin.breadcrumb.admin", default: "Admin"), url: admin_root_path },
+      { label: t("ruby_cms.admin.commands.title", default: "Commando's") }
+    ]
+  ) do %>
+    <% scheduled_count = @commands.count { |c| c[:schedule].present? } %>
+    <span class="inline-flex items-center gap-1.5 h-8 px-3 rounded-md border border-[#e9e4d4] bg-white text-[#57534e] text-[12.5px] font-medium">
+      <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" /></svg>
+      <%= t("ruby_cms.admin.commands.scheduled_count", default: "%{n} geprogrammeerd", n: scheduled_count) %>
+    </span>
+  <% end %>
+
+  <div class="px-4 py-4 min-h-0 flex flex-col"
+       data-controller="admin--commands"
+       data-admin--commands-run-url-value="<%= admin_settings_commands_run_path %>"
+       data-admin--commands-active-value="<%= active_cmd&.dig(:key) %>"
+       data-admin--commands-category-value="all">
+
+    <div class="grid gap-4 min-h-0" style="grid-template-columns: minmax(0, 320px) minmax(0, 1fr); min-height: min(40rem, calc(100dvh - 9rem));">
+
+      <%# ────────────── LEFT: list ────────────── %>
+      <aside class="flex flex-col min-h-0 bg-white border border-[#e9e4d4] rounded-xl overflow-hidden">
+        <div class="px-3 py-2.5 border-b border-[#e9e4d4]">
+          <div class="relative">
+            <svg class="absolute left-2.5 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-[#a8a29e]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-4.35-4.35M11 19a8 8 0 100-16 8 8 0 000 16z" />
+            </svg>
+            <input
+              type="search"
+              autocomplete="off"
+              placeholder="<%= t("ruby_cms.admin.commands.search_placeholder", default: "Zoek command…") %>"
+              data-admin--commands-target="search"
+              data-action="input->admin--commands#filter"
+              class="w-full h-8 pl-8 pr-2 text-[12.5px] rounded-md border border-[#e9e4d4] bg-white placeholder:text-[#a8a29e] focus:outline-none focus:ring-2 focus:ring-blue-500/30 focus:border-blue-400">
+          </div>
+        </div>
+
+        <%# Categories %>
+        <div class="border-b border-[#e9e4d4] p-2 flex flex-col gap-px">
+          <% cat_keys.each do |c| %>
+            <%
+              meta = category_meta[c] || category_meta["custom"]
+              tone = tone_classes[meta[:tone]] || tone_classes["slate"]
+              count = @category_counts[c] || 0
+              active = (c == "all")
+            %>
+            <button type="button"
+                    data-admin--commands-target="categoryBtn"
+                    data-category="<%= c %>"
+                    data-action="click->admin--commands#filterCategory"
+                    class="js-cat group flex items-center gap-2 px-2 py-1 rounded-md text-[12px] text-[#57534e] hover:bg-[#faf8f3] hover:text-[#1c1917] data-[active=true]:bg-blue-50/60 data-[active=true]:text-blue-700 data-[active=true]:font-semibold transition-colors"
+                    data-active="<%= active %>">
+              <span class="w-[22px] h-[22px] rounded-md grid place-items-center flex-shrink-0 <%= tone[:chip_bg] %> <%= tone[:chip_fg] %>">
+                <svg class="w-[13px] h-[13px]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><%== cat_icon_svg[c] || cat_icon_svg["custom"] %></svg>
+              </span>
+              <span class="flex-1 text-left"><%= meta[:label] %></span>
+              <span class="tabular-nums text-[10.5px] text-[#a8a29e] bg-stone-100 rounded-full px-1.5 py-px min-w-[18px] text-center group-data-[active=true]:bg-white group-data-[active=true]:text-blue-700">
+                <%= count %>
+              </span>
+            </button>
+          <% end %>
+        </div>
+
+        <%# Commands %>
+        <div class="flex-1 overflow-y-auto p-2 flex flex-col gap-0.5 min-h-0">
+          <% if @commands.empty? %>
+            <div class="py-10 px-3 text-center">
+              <p class="text-[13px] text-[#57534e] font-medium"><%= t("ruby_cms.admin.commands.empty_title", default: "Geen commands geregistreerd") %></p>
+              <p class="text-[11.5px] text-[#a8a29e] mt-1"><%= t("ruby_cms.admin.commands.empty_hint", default: "Registreer commands via RubyCms.register_command in een initializer.") %></p>
+            </div>
+          <% end %>
+
+          <% @commands.each do |c| %>
+            <%
+              last = @last_runs[c[:key]]
+              status = last&.status || "idle"
+            %>
+            <button type="button"
+                    data-admin--commands-target="cmdBtn"
+                    data-key="<%= c[:key] %>"
+                    data-category="<%= c[:category] || "custom" %>"
+                    data-label="<%= c[:label].to_s.downcase %>"
+                    data-rake="<%= c[:rake_task].to_s.downcase %>"
+                    data-description="<%= c[:description].to_s.downcase %>"
+                    data-action="click->admin--commands#select"
+                    data-active="<%= c[:key] == active_cmd&.dig(:key) %>"
+                    class="js-cmd flex items-start gap-2.5 p-2 rounded-lg text-left border border-transparent hover:bg-[#faf8f3] data-[active=true]:bg-white data-[active=true]:border-blue-100 data-[active=true]:shadow-[0_1px_2px_rgba(0,0,0,0.04)]">
+              <span class="mt-1.5 inline-block w-2 h-2 rounded-full flex-shrink-0
+                <%= status == "ok"     ? "bg-green-600 shadow-[0_0_0_3px_rgba(34,197,94,0.15)]" : "" %>
+                <%= status == "failed" ? "bg-red-600 shadow-[0_0_0_3px_rgba(239,68,68,0.18)]"   : "" %>
+                <%= status == "idle"   ? "bg-stone-300" : "" %>"></span>
+              <span class="min-w-0 flex-1">
+                <span class="block text-[13px] font-medium text-[#1c1917] truncate"><%= c[:label] %></span>
+                <span class="block text-[11px] font-mono text-[#a8a29e] truncate mt-0.5"><%= c[:rake_task] %></span>
+              </span>
+              <% if c[:schedule].present? %>
+                <span class="inline-grid place-items-center w-5 h-5 rounded-full bg-blue-50 text-blue-600 flex-shrink-0" title="<%= c[:schedule] %>">
+                  <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
+                </span>
+              <% end %>
+            </button>
+          <% end %>
+
+          <div data-admin--commands-target="noResults"
+               class="hidden py-10 px-3 text-center">
+            <p class="text-[13px] text-[#57534e] font-medium"><%= t("ruby_cms.admin.commands.no_match", default: "Geen commands gevonden") %></p>
+            <p class="text-[11.5px] text-[#a8a29e] mt-1"><%= t("ruby_cms.admin.commands.no_match_hint", default: "Pas je zoekopdracht of categorie aan.") %></p>
+          </div>
+        </div>
+      </aside>
+
+      <%# ────────────── RIGHT: detail ────────────── %>
+      <div class="flex flex-col gap-3 min-h-0 overflow-y-auto pr-1">
+        <% if active_cmd.nil? %>
+          <div class="bg-white border border-[#e9e4d4] rounded-xl px-6 py-16 text-center">
+            <p class="text-sm font-medium text-[#57534e]"><%= t("ruby_cms.admin.commands.select_title", default: "Selecteer een command") %></p>
+            <p class="text-xs text-[#a8a29e] mt-1.5"><%= t("ruby_cms.admin.commands.select_hint", default: "Kies een command uit de lijst om de details en run-historie te zien.") %></p>
+          </div>
+        <% else %>
+          <%
+            cmd = active_cmd
+            cat = cmd[:category] || "custom"
+            cat_meta = category_meta[cat] || category_meta["custom"]
+            cat_tone = tone_classes[cat_meta[:tone]] || tone_classes["slate"]
+            last = @last_runs[cmd[:key]]
+            cmd_history = (history_by_cmd[cmd[:key]] || []).first(8)
+          %>
+
+          <%# ── Header card ── %>
+          <div class="bg-white border border-[#e9e4d4] rounded-xl px-5 py-4">
+            <div class="flex items-start gap-3.5">
+              <div class="min-w-0 flex-1">
+                <div class="flex items-center gap-1.5 text-[10.5px] font-semibold uppercase tracking-[0.06em] text-[#a8a29e] mb-1">
+                  <span class="w-[22px] h-[22px] rounded-md grid place-items-center <%= cat_tone[:chip_bg] %> <%= cat_tone[:chip_fg] %>">
+                    <svg class="w-[13px] h-[13px]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><%== cat_icon_svg[cat] || cat_icon_svg["custom"] %></svg>
+                  </span>
+                  <span><%= cat_meta[:label] %></span>
+                </div>
+                <h2 class="text-[18px] font-semibold tracking-[-0.015em] text-[#1c1917] m-0"><%= cmd[:label] %></h2>
+                <% if cmd[:description].present? %>
+                  <p class="mt-1 text-[13px] leading-relaxed text-[#57534e] m-0"><%= cmd[:description] %></p>
+                <% end %>
+              </div>
+
+              <form action="<%= admin_settings_commands_run_path %>"
+                    method="post"
+                    class="shrink-0"
+                    data-admin--commands-target="runForm"
+                    data-action="submit->admin--commands#run">
+                <input type="hidden" name="authenticity_token" value="<%= form_authenticity_token %>">
+                <input type="hidden" name="key" value="<%= cmd[:key] %>">
+                <% Array(cmd[:params]).each do |p|
+                  default = p[:default]
+                  val = (p[:type] == "toggle") ? (default ? "1" : "0") : default.to_s %>
+                  <input type="hidden"
+                         name="command_params[<%= p[:key] %>]"
+                         value="<%= val %>"
+                         data-admin--commands-target="paramInput"
+                         data-param="<%= p[:key] %>">
+                <% end %>
+                <button type="submit"
+                        data-admin--commands-target="runBtn"
+                        class="inline-flex items-center gap-1.5 h-8 px-4 rounded-md bg-blue-600 text-white text-[12.5px] font-medium hover:bg-blue-700 transition-colors disabled:opacity-60 disabled:cursor-wait">
+                  <svg class="w-3.5 h-3.5 js-icon-play" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+                  </svg>
+                  <svg class="hidden w-3.5 h-3.5 animate-spin js-icon-spin" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2" />
+                  </svg>
+                  <span class="js-label-run"><%= t("ruby_cms.admin.commands.run", default: "Run") %></span>
+                  <span class="hidden js-label-running"><%= t("ruby_cms.admin.commands.running", default: "Running…") %></span>
+                </button>
+              </form>
+            </div>
+
+            <%# Meta strip %>
+            <div class="grid grid-cols-3 gap-3.5 pt-3 mt-3 border-t border-[#e9e4d4]">
+              <div class="min-w-0">
+                <div class="text-[10.5px] font-semibold uppercase tracking-[0.06em] text-[#a8a29e] mb-1">Rake</div>
+                <code class="block text-[12px] font-mono text-[#1c1917] truncate">rake <%= cmd[:rake_task] %></code>
+              </div>
+              <div class="min-w-0">
+                <div class="text-[10.5px] font-semibold uppercase tracking-[0.06em] text-[#a8a29e] mb-1"><%= t("ruby_cms.admin.commands.last_run", default: "Laatst gerund") %></div>
+                <div class="text-[12.5px] text-[#1c1917] flex items-center gap-1.5 truncate" data-admin--commands-target="lastRun">
+                  <% if last %>
+                    <span><%= rel_time.call(last.started_at) %></span>
+                    <% if last.ok? %>
+                      <span class="inline-flex items-center gap-1 px-1.5 py-px rounded text-[10.5px] font-medium ring-1 ring-inset bg-green-50 text-green-700 ring-green-200">
+                        <span class="w-1.5 h-1.5 rounded-full bg-green-600"></span>OK
+                      </span>
+                    <% else %>
+                      <span class="inline-flex items-center gap-1 px-1.5 py-px rounded text-[10.5px] font-medium ring-1 ring-inset bg-red-50 text-red-700 ring-red-200">
+                        <span class="w-1.5 h-1.5 rounded-full bg-red-600"></span>Failed
+                      </span>
+                    <% end %>
+                  <% else %>
+                    <span class="text-[#a8a29e]"><%= t("ruby_cms.admin.commands.never", default: "Nog nooit") %></span>
+                  <% end %>
+                </div>
+              </div>
+              <div class="min-w-0">
+                <div class="text-[10.5px] font-semibold uppercase tracking-[0.06em] text-[#a8a29e] mb-1">Schedule</div>
+                <% if cmd[:schedule].present? %>
+                  <div class="text-[12.5px] text-[#1c1917] flex items-center gap-1.5 truncate">
+                    <svg class="w-3.5 h-3.5 text-[#78716c]" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
+                    <span class="truncate"><%= cmd[:schedule] %></span>
+                  </div>
+                <% else %>
+                  <span class="text-[12.5px] text-[#a8a29e]"><%= t("ruby_cms.admin.commands.no_schedule", default: "Niet geprogrammeerd") %></span>
+                <% end %>
+              </div>
+            </div>
+          </div>
+
+          <%# ── Parameters ── %>
+          <% if Array(cmd[:params]).any? %>
+            <div class="bg-white border border-[#e9e4d4] rounded-xl overflow-hidden">
+              <div class="px-4 py-2.5 border-b border-[#e9e4d4]">
+                <p class="text-[13px] font-semibold text-[#1c1917] m-0"><%= t("ruby_cms.admin.commands.parameters", default: "Parameters") %></p>
+              </div>
+              <div class="px-4">
+                <% cmd[:params].each do |p| %>
+                  <div class="grid grid-cols-[minmax(0,1fr)_200px] gap-4 py-2.5 border-b border-[#f5efde] last:border-b-0 items-center">
+                    <div class="min-w-0">
+                      <div class="text-[12.5px] font-semibold text-[#1c1917]"><%= p[:label] %></div>
+                      <div class="text-[11.5px] text-[#a8a29e] mt-0.5 flex flex-wrap items-center gap-1">
+                        <code class="font-mono">--<%= p[:key] %></code>
+                        <% if p[:description].present? %>
+                          <span>· <%= p[:description] %></span>
+                        <% end %>
+                      </div>
+                    </div>
+                    <div>
+                      <% case p[:type] %>
+                      <% when "toggle" %>
+                        <button type="button"
+                                data-admin--commands-target="paramControl"
+                                data-param="<%= p[:key] %>"
+                                data-action="click->admin--commands#toggleParam"
+                                data-on="<%= !!p[:default] %>"
+                                aria-pressed="<%= !!p[:default] %>"
+                                class="relative inline-flex h-5 w-9 items-center rounded-full transition-colors data-[on=true]:bg-blue-600 data-[on=false]:bg-stone-300">
+                          <span class="inline-block h-4 w-4 transform rounded-full bg-white shadow transition-transform data-[on=true]:translate-x-[18px] data-[on=false]:translate-x-0.5"
+                                data-on="<%= !!p[:default] %>"></span>
+                        </button>
+                      <% when "select" %>
+                        <select data-admin--commands-target="paramControl"
+                                data-param="<%= p[:key] %>"
+                                data-action="change->admin--commands#changeParam"
+                                class="w-full h-8 px-2 text-[12.5px] rounded-md border border-[#e9e4d4] bg-white focus:outline-none focus:ring-2 focus:ring-blue-500/30 focus:border-blue-400">
+                          <% Array(p[:options]).each do |opt| %>
+                            <option value="<%= opt %>" <%= "selected" if opt.to_s == p[:default].to_s %>><%= opt %></option>
+                          <% end %>
+                        </select>
+                      <% else %>
+                        <input type="text"
+                               autocomplete="off"
+                               value="<%= p[:default] %>"
+                               data-admin--commands-target="paramControl"
+                               data-param="<%= p[:key] %>"
+                               data-action="input->admin--commands#changeParam"
+                               class="w-full h-8 px-2 text-[12.5px] rounded-md border border-[#e9e4d4] bg-white focus:outline-none focus:ring-2 focus:ring-blue-500/30 focus:border-blue-400">
+                      <% end %>
+                    </div>
+                  </div>
+                <% end %>
+              </div>
+            </div>
+          <% end %>
+
+          <%# ── Terminal ── %>
+          <div class="bg-white border border-[#e9e4d4] rounded-xl overflow-hidden flex flex-col" style="min-height: 200px;">
+            <div class="px-4 py-2.5 border-b border-[#e9e4d4] flex items-center justify-between gap-2">
+              <p class="text-[13px] font-semibold text-[#1c1917] m-0">Output</p>
+              <div class="flex items-center gap-1.5">
+                <span data-admin--commands-target="runningPill"
+                      class="hidden inline-flex items-center gap-1.5 px-2 py-0.5 rounded-md text-[11px] font-medium bg-blue-50 text-blue-700 ring-1 ring-blue-200">
+                  <span class="w-1.5 h-1.5 rounded-full bg-blue-600 animate-pulse"></span>
+                  Running
+                </span>
+                <button type="button"
+                        data-action="click->admin--commands#copyOutput"
+                        class="inline-flex items-center gap-1 h-7 px-2 rounded-md text-[11.5px] font-medium text-[#57534e] hover:bg-[#faf8f3]">
+                  <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2v-2M8 5a2 2 0 002 2h4a2 2 0 002-2M8 5a2 2 0 012-2h4a2 2 0 012 2m0 0h2a2 2 0 012 2v3M9 11h6m-6 4h4" /></svg>
+                  <%= t("ruby_cms.admin.commands.copy", default: "Kopieer") %>
+                </button>
+                <button type="button"
+                        data-action="click->admin--commands#clearOutput"
+                        class="inline-flex items-center gap-1 h-7 px-2 rounded-md text-[11.5px] font-medium text-[#57534e] hover:bg-[#faf8f3]">
+                  <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" /></svg>
+                  <%= t("ruby_cms.admin.commands.clear", default: "Leeg") %>
+                </button>
+              </div>
+            </div>
+            <pre data-admin--commands-target="terminal"
+                 class="flex-1 min-h-[180px] m-0 px-4 py-3 font-mono text-[12px] leading-relaxed text-stone-200 bg-[#1c1917] whitespace-pre-wrap break-words overflow-auto"
+                 aria-live="polite"><span class="text-stone-500"># <%= t("ruby_cms.admin.commands.output_hint", default: "Klik Run om deze command uit te voeren.") %></span></pre>
+          </div>
+
+          <%# ── Recent runs for active cmd ── %>
+          <div class="bg-white border border-[#e9e4d4] rounded-xl overflow-hidden">
+            <div class="px-4 py-2.5 border-b border-[#e9e4d4]">
+              <p class="text-[13px] font-semibold text-[#1c1917] m-0"><%= t("ruby_cms.admin.commands.recent_runs", default: "Recente runs") %></p>
+              <p class="text-[11.5px] text-[#a8a29e] mt-0.5 m-0"><%= cmd_history.size %> <%= t("ruby_cms.admin.commands.recent_runs_sub", default: "laatste uitvoeringen van") %> <%= cmd[:label] %></p>
+            </div>
+            <div data-admin--commands-target="history">
+              <% if cmd_history.empty? %>
+                <div class="px-4 py-8 text-center">
+                  <p class="text-[13px] text-[#57534e] font-medium"><%= t("ruby_cms.admin.commands.no_runs_title", default: "Nog geen runs") %></p>
+                  <p class="text-[11.5px] text-[#a8a29e] mt-1"><%= t("ruby_cms.admin.commands.no_runs_hint", default: "Klik op Run om deze command voor het eerst uit te voeren.") %></p>
+                </div>
+              <% else %>
+                <% cmd_history.each do |h| %>
+                  <div class="px-4 py-2.5 flex items-center gap-3 border-b border-[#f5efde] last:border-b-0">
+                    <span class="w-2 h-2 rounded-full flex-shrink-0
+                      <%= h.ok? ? "bg-green-600 shadow-[0_0_0_3px_rgba(34,197,94,0.15)]" : "bg-red-600 shadow-[0_0_0_3px_rgba(239,68,68,0.18)]" %>"></span>
+                    <div class="flex-1 min-w-0 flex flex-col">
+                      <span class="text-[12.5px] text-[#1c1917] truncate">
+                        <%= h.error_message.presence || (h.ok? ? t("ruby_cms.admin.commands.success", default: "Succesvol") : t("ruby_cms.admin.commands.failed", default: "Mislukt")) %>
+                      </span>
+                      <span class="text-[11px] text-[#a8a29e] truncate">
+                        <%= h.by_label %> · <%= rel_time.call(h.started_at) %> · <%= fmt_dur.call(h.duration_ms) %>
+                      </span>
+                    </div>
+                    <span class="inline-flex items-center gap-1 px-1.5 py-0.5 rounded text-[10.5px] font-medium ring-1 ring-inset
+                      <%= h.ok? ? "bg-green-50 text-green-700 ring-green-200" : "bg-red-50 text-red-700 ring-red-200" %>">
+                      <span class="w-1.5 h-1.5 rounded-full <%= h.ok? ? "bg-green-600" : "bg-red-600" %>"></span>
+                      <%= h.ok? ? "OK" : "Failed" %>
+                    </span>
+                  </div>
+                <% end %>
+              <% end %>
+            </div>
+          </div>
+        <% end %>
+      </div>
+    </div>
+  </div>
+<% end %>

data/lib/generators/ruby_cms/templates/views/admin/content_block_versions/index.html.erb

@@ -0,0 +1,63 @@
+<%= AdminPage do %>
+  <%= AdminPageHeader(
+    title: "Versiegeschiedenis",
+    subtitle: @content_block.key,
+    breadcrumbs: [
+      { label: t("admin.pages.common.admin", default: "Beheer"), url: admin_root_path },
+      { label: t("ruby_cms.admin.nav.content_blocks", default: "Content blocks"), url: admin_content_blocks_path },
+      { label: @content_block.key, url: admin_content_block_path(@content_block) },
+      { label: "Versies" }
+    ]
+  ) do %>
+    <%= link_to admin_content_block_path(@content_block), class: "inline-flex items-center gap-1.5 h-8 px-3 rounded-md bg-white border border-[#e9e4d4] text-[#1c1917] text-[12.5px] font-medium hover:bg-[#faf8f3] transition-colors no-underline" do %>
+      <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" /></svg>
+      Terug
+    <% end %>
+  <% end %>
+
+  <div class="p-4 space-y-3">
+    <% @versions.each do |version| %>
+      <div class="rounded-lg border border-[#e9e4d4] bg-white p-4">
+        <div class="flex items-center justify-between gap-3 flex-wrap">
+          <div class="flex items-center gap-2.5 min-w-0">
+            <span class="inline-flex items-center gap-1.5 px-2 py-0.5 rounded-full text-[11px] font-medium border whitespace-nowrap
+              <%= case version.event
+                  when "create"        then "bg-blue-50 text-blue-700 border-blue-100"
+                  when "update"        then "bg-amber-50 text-amber-700 border-amber-100"
+                  when "rollback"      then "bg-purple-50 text-purple-700 border-purple-100"
+                  when "publish"       then "bg-green-50 text-green-700 border-green-100"
+                  when "unpublish"     then "bg-red-50 text-red-700 border-red-100"
+                  when "visual_editor" then "bg-cyan-50 text-cyan-700 border-cyan-100"
+                  else                      "bg-[#faf8f3] text-[#57534e] border-[#e9e4d4]"
+                  end %>">
+              <span class="font-mono">v<%= version.version_number %></span>
+              <span>·</span>
+              <span><%= version.event %></span>
+            </span>
+            <span class="text-[12.5px] text-[#57534e] truncate"><%= ruby_cms_user_display(version.user) %></span>
+            <span class="font-mono text-[11.5px] text-[#78716c] whitespace-nowrap"><%= version.created_at.strftime("%d %b %Y, %H:%M") %></span>
+          </div>
+
+          <div class="flex items-center gap-1.5 flex-shrink-0">
+            <%= link_to "Bekijk diff", admin_content_block_version_path(@content_block, version),
+                class: "inline-flex items-center gap-1 h-7 px-2.5 rounded-md text-[12.5px] font-medium text-[#1c1917] hover:bg-[#faf8f3] transition-colors no-underline" %>
+
+            <% unless version == @versions.first %>
+              <%= button_to "Rollback",
+                  rollback_admin_content_block_version_path(@content_block, version),
+                  method: :post,
+                  data: { turbo_confirm: "Weet je zeker dat je wilt terugdraaien naar versie #{version.version_number}?" },
+                  class: "inline-flex items-center gap-1 h-7 px-2.5 rounded-md text-[12.5px] font-medium text-red-600 hover:bg-red-50 transition-colors bg-transparent border-0 cursor-pointer" %>
+            <% end %>
+          </div>
+        </div>
+
+        <% if version.metadata&.dig("changed_fields").present? %>
+          <p class="mt-2 text-[11.5px] text-[#78716c]">
+            Gewijzigde velden: <span class="font-mono text-[#1c1917]"><%= version.metadata["changed_fields"].join(", ") %></span>
+          </p>
+        <% end %>
+      </div>
+    <% end %>
+  </div>
+<% end %>

data/{app/views/ruby_cms → lib/generators/ruby_cms/templates/views}/admin/content_block_versions/show.html.erb

@@ -1,7 +1,7 @@
 <h1>Versie <%= @version.version_number %> - <%= @content_block.key %></h1>
 
 <%= link_to "Terug naar versiegeschiedenis",
-    ruby_cms_admin_content_block_versions_path(@content_block),
+    admin_content_block_versions_path(@content_block),
     class: "inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground mb-4" %>
 
 <% diff = @version.diff_from(@previous_version) %>
@@ -30,7 +30,7 @@
 
 <div class="mt-6">
   <%= button_to "Rollback naar deze versie",
-      rollback_ruby_cms_admin_content_block_version_path(@content_block, @version),
+      rollback_admin_content_block_version_path(@content_block, @version),
       method: :post,
       data: { turbo_confirm: "Weet je zeker dat je wilt terugdraaien naar versie #{@version.version_number}?" },
       class: "inline-flex items-center px-4 py-2 rounded-md bg-primary text-primary-foreground text-sm font-medium hover:bg-primary/90" %>

data/lib/generators/ruby_cms/templates/views/admin/content_blocks/_audits.html.erb

@@ -0,0 +1,49 @@
+<%# Per-field audit trail powered by the `audited` gem. Coexists with the
+    older ContentBlockVersion snapshots (those still drive rollback). %>
+<%
+  audits = (@content_block.respond_to?(:audits) ? @content_block.audits.reorder(created_at: :desc).limit(15) : []).to_a
+%>
+<% if audits.any? %>
+  <div class="mt-6 rounded-lg border border-[#e9e4d4] bg-white overflow-hidden">
+    <header class="flex items-center justify-between px-3 py-2.5 border-b border-[#e9e4d4] bg-[#faf8f3]">
+      <h3 class="text-[13px] font-semibold text-[#1c1917] m-0">
+        <%= t("ruby_cms.admin.content_blocks.audits", default: "Wijzigingsgeschiedenis") %>
+      </h3>
+      <span class="text-[11px] text-[#a8a29e]"><%= audits.size %> records</span>
+    </header>
+    <div class="divide-y divide-[#f5efde]">
+      <% audits.each do |a| %>
+        <div class="px-3 py-2.5">
+          <div class="flex items-center justify-between gap-2 mb-1.5">
+            <div class="flex items-center gap-2 min-w-0">
+              <%= status_pill(
+                    a.action == "create" ? :success : (a.action == "destroy" ? :danger : :blue),
+                    a.action.to_s,
+                    dot: false) %>
+              <span class="text-[12px] text-[#1c1917] font-medium truncate">
+                <%= a.user.respond_to?(:email_address) ? a.user.email_address : (a.username.presence || "system") %>
+              </span>
+            </div>
+            <span class="text-[11px] text-[#78716c]" title="<%= a.created_at.strftime("%Y-%m-%d %H:%M:%S") %>"><%= rel_time(a.created_at) %></span>
+          </div>
+          <% if a.audited_changes.present? %>
+            <dl class="grid grid-cols-[110px_1fr] gap-x-3 gap-y-1 text-[11.5px]">
+              <% a.audited_changes.each do |field, change| %>
+                <dt class="font-mono text-[#78716c]"><%= field %></dt>
+                <dd class="text-[#1c1917] truncate">
+                  <% if change.is_a?(Array) %>
+                    <span class="text-red-700 line-through"><%= change[0].to_s.truncate(80).presence || "—" %></span>
+                    <span class="text-[#a8a29e]">→</span>
+                    <span class="text-green-700"><%= change[1].to_s.truncate(80).presence || "—" %></span>
+                  <% else %>
+                    <%= change.to_s.truncate(120) %>
+                  <% end %>
+                </dd>
+              <% end %>
+            </dl>
+          <% end %>
+        </div>
+      <% end %>
+    </div>
+  </div>
+<% end %>