glancer 1.0.0

data/app/views/glancer/messages/_message_info.html.erb

@@ -0,0 +1,176 @@
+<div data-controller="message" id="message-info">
+  <% if local_assigns[:message_info] %>
+    <div class="fixed inset-0 z-50 flex justify-end"
+         id="message-info--area"
+         role="dialog"
+         aria-modal="true"
+         aria-label="Detalhes da mensagem">
+      <%# Backdrop %>
+      <div class="absolute inset-0 bg-black/40 backdrop-blur-sm"
+           data-action="click->message#closeMessageInfo"></div>
+
+      <%# Panel %>
+      <div id="message-info--content"
+           class="relative z-10 flex flex-col w-full max-w-xl bg-white dark:bg-gray-900 h-full shadow-2xl overflow-hidden transform translate-x-full transition-transform duration-200 ease-out"
+           data-action="click->message#stopPropagation">
+
+        <%# Panel header %>
+        <div class="flex items-center justify-between px-5 py-4 border-b border-gray-100 dark:border-gray-800 flex-shrink-0">
+          <h2 class="text-sm font-semibold text-gray-900 dark:text-white"><%= t("glancer.info_panel.title") %></h2>
+          <button class="p-1.5 rounded-lg text-gray-400 hover:text-gray-600 dark:hover:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors"
+                  data-action="click->message#closeMessageInfo"
+                  aria-label="<%= t('glancer.info_panel.close') %>">
+            <svg class="w-4 h-4" aria-hidden="true"><use href="#icon-x"/></svg>
+          </button>
+        </div>
+
+        <%# Panel body %>
+        <div class="flex-1 overflow-y-auto px-5 py-5 space-y-6">
+          <%# User question %>
+          <% if message_info.user_message %>
+            <div>
+              <p class="text-[11px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500 mb-2"><%= t("glancer.info_panel.user_question") %></p>
+              <div class="rounded-xl bg-gray-50 dark:bg-gray-800 px-4 py-3 text-sm text-gray-700 dark:text-gray-200">
+                <%= message_info.user_message.content %>
+              </div>
+            </div>
+          <% end %>
+
+          <%# Enriched question (only when enrichment is enabled and produced a different result) %>
+          <% if message_info.enriched_question.present? %>
+            <div>
+              <div class="flex items-center gap-2 mb-2">
+                <p class="text-[11px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500"><%= t("glancer.info_panel.enriched_question") %></p>
+                <span class="text-[10px] font-medium px-1.5 py-0.5 rounded-full bg-primary-50 dark:bg-primary-950 text-primary-600 dark:text-primary-400">enriched</span>
+              </div>
+              <div class="rounded-xl bg-gray-50 dark:bg-gray-800 px-4 py-3 text-sm text-gray-600 dark:text-gray-300 italic">
+                <%= message_info.enriched_question %>
+              </div>
+            </div>
+          <% end %>
+
+          <%# Generated code (SQL or ActiveRecord) %>
+          <% if message_info.code.present? %>
+            <% code_lang  = message_info.code_type == "activerecord" ? "ruby" : "sql" %>
+            <% code_label = message_info.code_type == "activerecord" ? t("glancer.info_panel.current_code") : t("glancer.info_panel.current_sql") %>
+            <div>
+              <div class="flex items-center justify-between mb-2">
+                <p class="text-[11px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500"><%= code_label %></p>
+                <div class="flex items-center gap-2">
+                  <% if message_info.user_edited_code? %>
+                    <span class="text-[10px] font-medium text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-950 px-2 py-0.5 rounded-full"><%= t("glancer.info_panel.user_edited") %></span>
+                  <% end %>
+                  <button class="p-1 rounded text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors"
+                          data-action="click->message#copySql"
+                          data-sql="<%= j message_info.code.strip %>"
+                          aria-label="<%= t('glancer.messages.copy_sql') %>">
+                    <svg class="w-3 h-3" aria-hidden="true"><use href="#icon-copy"/></svg>
+                  </button>
+                </div>
+              </div>
+              <div class="rounded-xl overflow-hidden border border-gray-200 dark:border-gray-700">
+                <pre class="!m-0 !rounded-none text-xs overflow-x-auto p-4"><code class="language-<%= code_lang %>"><%= message_info.code.strip %></code></pre>
+              </div>
+            </div>
+          <% end %>
+
+          <%# Code version history %>
+          <% versions = message_info.code_versions.order(created_at: :desc) %>
+          <% if versions.any? %>
+            <div>
+              <p class="text-[11px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500 mb-2">
+                <%= t("glancer.info_panel.code_versions", count: versions.size) %>
+              </p>
+              <div class="space-y-2">
+                <% versions.each_with_index do |version, idx| %>
+                  <details class="rounded-lg border border-gray-200 dark:border-gray-700 overflow-hidden" <%= idx == 0 ? 'open' : '' %>>
+                    <summary class="flex items-center justify-between px-3 py-2 bg-gray-50 dark:bg-gray-800 cursor-pointer select-none hover:bg-gray-100 dark:hover:bg-gray-750 transition-colors">
+                      <div class="flex items-center gap-2">
+                        <svg class="w-3 h-3 text-gray-400 summary-arrow transition-transform duration-200" aria-hidden="true">
+                          <use href="#icon-chevron-down"/>
+                        </svg>
+                        <span class="text-[11px] text-gray-600 dark:text-gray-300">
+                          <%= version.created_at.strftime("%-d/%m/%Y %H:%M") %>
+                        </span>
+                      </div>
+                      <div class="flex items-center gap-2">
+                        <% if version.user_edited? %>
+                          <span class="text-[10px] font-medium text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-950 px-2 py-0.5 rounded-full">
+                            <%= t("glancer.info_panel.user") %>
+                          </span>
+                        <% else %>
+                          <span class="text-[10px] font-medium text-primary-600 dark:text-primary-400 bg-primary-50 dark:bg-primary-950 px-2 py-0.5 rounded-full">
+                            <%= t("glancer.info_panel.generated") %>
+                          </span>
+                        <% end %>
+                        <button class="p-0.5 rounded text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors"
+                                data-action="click->message#copySql"
+                                data-sql="<%= j version.code.strip %>"
+                                aria-label="<%= t('glancer.messages.copy_sql') %>">
+                          <svg class="w-3 h-3" aria-hidden="true"><use href="#icon-copy"/></svg>
+                        </button>
+                      </div>
+                    </summary>
+                    <div class="overflow-x-auto">
+                      <% version_lang = message_info.code_type == "activerecord" ? "ruby" : "sql" %>
+                      <pre class="!m-0 !rounded-none text-[11px] p-3"><code class="language-<%= version_lang %>"><%= version.code.strip %></code></pre>
+                    </div>
+                  </details>
+                <% end %>
+              </div>
+            </div>
+          <% end %>
+
+          <%# Execution history %>
+          <% executions = message_info.audits.order(executed_at: :desc) %>
+          <% if executions.any? %>
+            <div>
+              <p class="text-[11px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500 mb-2">
+                <%= t("glancer.info_panel.execution_history", count: executions.size) %>
+              </p>
+              <div class="space-y-1.5">
+                <% executions.each do |audit| %>
+                  <div class="flex items-start justify-between px-3 py-2 rounded-lg bg-gray-50 dark:bg-gray-800 border border-gray-100 dark:border-gray-700">
+                    <div>
+                      <p class="text-[11px] text-gray-600 dark:text-gray-300">
+                        <%= audit.executed_at.strftime("%-d/%m/%Y às %H:%M:%S") %>
+                      </p>
+                      <p class="text-[10px] text-gray-400 dark:text-gray-500 font-mono mt-0.5">
+                        run_id: <%= audit.run_id %>
+                      </p>
+                    </div>
+                    <span class="text-[10px] font-medium text-gray-500 dark:text-gray-400 bg-gray-100 dark:bg-gray-700 px-2 py-0.5 rounded-full flex-shrink-0 ml-2">
+                      <%= audit.adapter %>
+                    </span>
+                  </div>
+                <% end %>
+              </div>
+            </div>
+          <% end %>
+
+          <%# Status %>
+          <div>
+            <p class="text-[11px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500 mb-2"><%= t("glancer.info_panel.status") %></p>
+            <% if message_info.successful? %>
+              <span class="inline-flex items-center gap-1.5 px-2.5 py-1 rounded-full text-xs font-medium bg-green-50 dark:bg-green-950 text-green-700 dark:text-green-400">
+                <svg class="w-3 h-3" aria-hidden="true"><use href="#icon-check"/></svg>
+                <%= t("glancer.info_panel.success") %>
+              </span>
+            <% else %>
+              <span class="inline-flex items-center gap-1.5 px-2.5 py-1 rounded-full text-xs font-medium bg-red-50 dark:bg-red-950 text-red-700 dark:text-red-400">
+                <svg class="w-3 h-3" aria-hidden="true"><use href="#icon-x"/></svg>
+                <%= t("glancer.info_panel.failed") %>
+              </span>
+            <% end %>
+          </div>
+
+          <%# Created at %>
+          <div>
+            <p class="text-[11px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500 mb-2"><%= t("glancer.info_panel.created_at") %></p>
+            <p class="text-sm text-gray-600 dark:text-gray-300"><%= message_info.created_at.strftime("%-d de %B de %Y às %H:%M:%S") %></p>
+          </div>
+        </div>
+      </div>
+    </div>
+  <% end %>
+</div>

data/app/views/glancer/messages/_temp_form.html.erb

@@ -0,0 +1,100 @@
+<%# Compute indexed table names for @ autocomplete.
+    Only paths with "#" are real table entries (e.g. "schema.rb#users").
+    Paths without "#" are auxiliary chunks (inflections file, etc.). %>
+<% glancer_tables = begin
+     Glancer::Embedding.where(source_type: "schema")
+                       .pluck(:source_path)
+                       .filter_map do |p|
+                         next unless p.include?("#")
+                         n = p.split("#").last
+                         n unless n == "foreign_keys"
+                       end
+                       .uniq.sort
+   rescue StandardError
+     []
+   end %>
+
+<%# Temp form — submits to /start, creates chat + first message, then redirects via Turbo.visit %>
+<div class="max-w-3xl lg:max-w-4xl xl:max-w-5xl 2xl:max-w-6xl mx-auto">
+<form action="<%= glancer.start_session_path %>"
+      method="post"
+      data-controller="message"
+      data-action="submit->message#submit"
+      data-message-target="form"
+      data-message-start-url-value="<%= glancer.start_session_path %>"
+      data-message-tables-value="<%= h glancer_tables.to_json %>"
+      data-message-step-labels-value="<%= h({
+        enriching:          t("glancer.workflow_steps.enriching"),
+        retrieving_context: t("glancer.workflow_steps.retrieving_context"),
+        generating_code:    t("glancer.workflow_steps.generating_code"),
+        validating:         t("glancer.workflow_steps.validating"),
+        executing:          t("glancer.workflow_steps.executing"),
+        humanizing:         t("glancer.workflow_steps.humanizing")
+      }.to_json) %>">
+  <%= hidden_field_tag :authenticity_token, form_authenticity_token %>
+
+  <div class="relative">
+    <%# @ mention autocomplete dropdown %>
+    <div id="mention-dropdown"
+         class="hidden absolute left-0 right-0 bottom-full mb-1 max-h-52 overflow-y-auto bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-xl shadow-lg z-50 text-sm"
+         role="listbox"
+         aria-label="Table suggestions"></div>
+
+    <div class="rounded-2xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 shadow-sm focus-within:ring-2 focus-within:ring-primary-500 focus-within:border-transparent transition-shadow">
+      <textarea name="content"
+                rows="1"
+                maxlength="2000"
+                placeholder="<%= t('glancer.chat.placeholder') %>"
+                class="block w-full px-4 pt-3.5 pb-2 bg-transparent resize-none outline-none text-sm text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 min-h-[42px] max-h-[200px] relative z-10"
+                data-message-target="input"
+                data-action="keydown->message#handleKeydown input->message#autoResize input->message#updateCharCount input->message#handleMentionInput keydown->message#handleMentionKeydown"
+                aria-label="<%= t('glancer.chat.placeholder') %>"
+                autocomplete="off"></textarea>
+
+      <%# @ mention chips — shown when @tablename patterns are detected %>
+      <div id="mention-chips"
+           class="hidden px-3 pb-1.5 flex flex-wrap gap-1.5"
+           data-message-target="mentionChips"
+           aria-label="Referenced tables"></div>
+
+      <div class="flex items-center justify-between px-3 pb-2.5">
+        <div class="flex items-center gap-3">
+          <span class="text-[11px] text-gray-300 dark:text-gray-600 select-none"
+                data-message-target="charCount"
+                aria-live="polite">0 / 2000</span>
+          <% if glancer_tables.any? %>
+            <span class="hidden sm:inline-flex items-center gap-1 text-[11px] text-gray-300 dark:text-gray-600 select-none" title="<%= t('glancer.chat.mention_tip_title') %>">
+              <kbd class="inline-flex items-center px-1 py-px rounded border border-gray-200 dark:border-gray-700 font-mono text-[10px] leading-none text-gray-400 dark:text-gray-500 bg-gray-50 dark:bg-gray-800">@</kbd>
+              <%= t("glancer.chat.mention_tip") %>
+            </span>
+          <% end %>
+        </div>
+        <div class="flex items-center gap-2">
+          <span class="hidden sm:block text-[11px] text-gray-300 dark:text-gray-600 select-none"><%= t("glancer.chat.hint") %></span>
+          <button type="button"
+                  class="flex items-center justify-center w-8 h-8 rounded-xl text-gray-400 hover:text-primary-600 dark:hover:text-primary-400 hover:bg-primary-50 dark:hover:bg-primary-950 transition-colors"
+                  data-message-target="micBtn"
+                  data-action="click->message#toggleRecording"
+                  aria-label="<%= t('glancer.chat.record') %>">
+            <svg class="w-4 h-4" aria-hidden="true"><use href="#icon-mic"/></svg>
+          </button>
+          <%# Cancel button — visible only while processing %>
+          <button type="button"
+                  class="hidden flex items-center justify-center w-8 h-8 rounded-xl bg-gray-100 dark:bg-gray-700 hover:bg-red-50 dark:hover:bg-red-950 text-gray-500 dark:text-gray-400 hover:text-red-600 dark:hover:text-red-400 transition-colors"
+                  data-message-target="cancelBtn"
+                  data-action="click->message#cancelSubmit"
+                  aria-label="Cancel">
+            <svg class="w-3.5 h-3.5" aria-hidden="true"><use href="#icon-x"/></svg>
+          </button>
+          <button type="submit"
+                  class="flex items-center justify-center w-8 h-8 rounded-xl bg-primary-600 hover:bg-primary-700 active:bg-primary-800 disabled:opacity-40 disabled:cursor-not-allowed text-white transition-colors"
+                  data-message-target="submitBtn"
+                  aria-label="<%= t('glancer.chat.send') %>">
+            <svg class="w-3.5 h-3.5" aria-hidden="true"><use href="#icon-send"/></svg>
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</form>
+</div>

data/app/views/glancer/messages/create.turbo_stream.erb

@@ -0,0 +1,25 @@
+<%# Remove thinking indicator %>
+<%= turbo_stream.remove "thinking-indicator" %>
+
+<%# Replace temp user message with the real server-rendered one %>
+<%= turbo_stream.replace "temp-user-message" do %>
+  <%= render "glancer/messages/message", message: @message %>
+<% end %>
+
+<%# Append the assistant processing placeholder — polling fills it in when done %>
+<%= turbo_stream.append "messages-list" do %>
+  <%= render "glancer/messages/message", message: @response_message %>
+<% end %>
+
+<%= turbo_stream.replace "message-form" do %>
+  <%= render "glancer/messages/form", chat: @chat %>
+<% end %>
+
+<%= turbo_stream.replace "message-info" do %>
+  <%= render "glancer/messages/message_info", message_info: nil %>
+<% end %>
+
+<%# Refresh sidebar so title updates after first message %>
+<%= turbo_stream.replace "sidebar-chat-list" do %>
+  <%= render "glancer/chats/sidebar_chat_list", chats: @chats, chat: @chat %>
+<% end %>

data/app/views/glancer/schema/show.html.erb

@@ -0,0 +1,123 @@
+<% content_for :main_content do %>
+  <div class="flex flex-col h-full overflow-hidden">
+
+    <%# Header %>
+    <div class="flex items-center justify-between px-6 py-4 border-b border-gray-200 dark:border-gray-800 bg-white dark:bg-gray-900 flex-shrink-0">
+      <div class="flex items-center gap-3">
+        <%= link_to glancer.root_path,
+            class: "p-1.5 rounded-md text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors",
+            aria: { label: t("glancer.schema.back") },
+            data: { turbo: false } do %>
+          <svg class="w-4 h-4" aria-hidden="true"><use href="#icon-arrow-left"/></svg>
+        <% end %>
+        <div>
+          <h1 class="text-sm font-semibold text-gray-900 dark:text-white"><%= t("glancer.schema.title") %></h1>
+          <p class="text-xs text-gray-400 dark:text-gray-500"><%= t("glancer.schema.tables_count", count: @tables.size) %></p>
+        </div>
+      </div>
+
+    </div>
+
+    <div class="flex flex-col flex-1 overflow-hidden">
+      <%# Filter input %>
+      <div class="px-6 py-3 border-b border-gray-100 dark:border-gray-800 flex-shrink-0">
+        <div class="relative">
+          <svg class="absolute left-3 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-gray-400" aria-hidden="true">
+            <use href="#icon-filter"/>
+          </svg>
+          <input type="text"
+                 id="table-filter"
+                 placeholder="<%= t('glancer.schema.filter') %>"
+                 oninput="filterTables(this.value)"
+                 class="w-full pl-9 pr-4 py-2 text-sm bg-gray-50 dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg text-gray-900 dark:text-gray-100 placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent">
+        </div>
+      </div>
+
+      <%# Tables — CSS masonry via columns %>
+      <div class="flex-1 overflow-y-auto px-6 py-4">
+        <div id="tables-grid" style="columns: 320px; column-gap: 1rem;">
+          <% @tables.each do |table| %>
+            <div class="table-card rounded-xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900 overflow-hidden break-inside-avoid mb-4"
+                 data-table="<%= table[:name] %>">
+              <%# Card header %>
+              <div class="flex items-center justify-between px-4 py-3 bg-gray-50 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700">
+                <div class="flex items-center gap-2">
+                  <svg class="w-3.5 h-3.5 text-primary-500" aria-hidden="true"><use href="#icon-table"/></svg>
+                  <span class="text-sm font-semibold text-gray-800 dark:text-gray-100"><%= table[:name] %></span>
+                </div>
+                <span class="text-[11px] text-gray-400 dark:text-gray-500"><%= table[:columns].size %> <%= t("glancer.schema.cols") %></span>
+              </div>
+
+              <%# Column list %>
+              <div class="divide-y divide-gray-50 dark:divide-gray-800">
+                <% table[:columns].each_with_index do |col, idx| %>
+                  <div class="flex items-center justify-between px-4 py-2 <%= idx.even? ? '' : 'bg-gray-50/50 dark:bg-gray-800/30' %>">
+                    <div class="flex items-center gap-2">
+                      <% if col[:name] == "id" %>
+                        <span class="text-[9px] font-bold text-primary-500 bg-primary-50 dark:bg-primary-950 px-1.5 py-0.5 rounded uppercase">PK</span>
+                      <% elsif table[:foreign_keys].any? { |fk| fk[:from_column] == col[:name] } %>
+                        <span class="text-[9px] font-bold text-blue-500 bg-blue-50 dark:bg-blue-950 px-1.5 py-0.5 rounded uppercase">FK</span>
+                      <% else %>
+                        <span class="w-4"></span>
+                      <% end %>
+                      <span class="text-xs text-gray-700 dark:text-gray-300 font-mono"><%= col[:name] %></span>
+                    </div>
+                    <span class="text-[11px] text-gray-400 dark:text-gray-500 font-mono truncate max-w-[120px]"><%= col[:type] %></span>
+                  </div>
+                <% end %>
+              </div>
+
+              <%# FK relationships %>
+              <% if table[:foreign_keys].any? %>
+                <div class="px-4 py-2 bg-blue-50/50 dark:bg-blue-950/20 border-t border-blue-100 dark:border-blue-900">
+                  <% table[:foreign_keys].each do |fk| %>
+                    <p class="text-[11px] text-blue-600 dark:text-blue-400 font-mono">
+                      <%= fk[:from_column] %> → <%= fk[:to_table] %>.<%= fk[:to_column] %>
+                    </p>
+                  <% end %>
+                </div>
+              <% end %>
+            </div>
+          <% end %>
+        </div>
+
+        <div id="no-tables-msg" class="hidden py-12 text-center text-sm text-gray-400 dark:text-gray-500">
+          <%= t("glancer.schema.no_tables", term: "") %><span id="filter-term"></span>
+        </div>
+      </div>
+    </div>
+
+  </div>
+
+  <script>
+    function filterTables(query) {
+      var term = query.trim().toLowerCase();
+      var cards = document.querySelectorAll('.table-card');
+      var visible = 0;
+
+      cards.forEach(function(card) {
+        var name = card.dataset.table || '';
+        var match = !term || name.includes(term);
+        card.style.display = match ? '' : 'none';
+        if (match) visible++;
+      });
+
+      var noMsg = document.getElementById('no-tables-msg');
+      var filterTerm = document.getElementById('filter-term');
+      noMsg.classList.toggle('hidden', visible > 0 || !term);
+      if (filterTerm) filterTerm.textContent = query;
+    }
+
+    // Auto-apply filter from ?table= URL param (used by @mention links)
+    (function() {
+      var params = new URLSearchParams(location.search);
+      var table = params.get('table');
+      if (table) {
+        var input = document.getElementById('table-filter');
+        if (input) { input.value = table; filterTables(table); }
+        var card = document.querySelector('[data-table="' + table + '"]');
+        if (card) card.scrollIntoView({ behavior: 'smooth', block: 'start' });
+      }
+    })();
+  </script>
+<% end %>