collavre 0.24.0 → 0.25.0

data/app/views/collavre/agent_gateways/index.html.erb

@@ -0,0 +1,54 @@
+<div class="flex-row-center-between">
+  <div>
+    <h1 class="no-top-margin"><%= t("collavre.agent_gateways.title") %></h1>
+    <p class="text-muted"><%= t("collavre.agent_gateways.description") %></p>
+  </div>
+  <%= link_to t("collavre.agent_gateways.add"), collavre.new_agent_gateway_path, class: "primary-action-button" %>
+</div>
+
+<div class="table-responsive" data-controller="gateway-check"
+     data-gateway-check-checking-value="<%= t('collavre.agent_gateways.checking') %>"
+     data-gateway-check-success-value="<%= t('collavre.agent_gateways.connected') %>"
+     data-gateway-check-failed-value="<%= t('collavre.agent_gateways.connection_failed') %>">
+  <table class="settings-table" style="width: 100%; min-width: 760px;">
+    <thead>
+      <tr>
+        <th><%= t("collavre.agent_gateways.name") %></th>
+        <th><%= t("collavre.agent_gateways.base_url") %></th>
+        <th><%= t("collavre.agent_gateways.workspace_mode.label") %></th>
+        <th><%= t("collavre.agent_gateways.agents") %></th>
+        <th><%= t("collavre.agent_gateways.actions") %></th>
+      </tr>
+    </thead>
+    <tbody>
+      <% @agent_gateways.each do |gateway| %>
+        <tr>
+          <td>
+            <strong><%= gateway.name %></strong>
+            <% unless gateway.active? %><span class="badge"><%= t("collavre.agent_gateways.inactive") %></span><% end %>
+          </td>
+          <td><code><%= gateway.base_url %></code></td>
+          <td><span class="badge"><%= t("collavre.agent_gateways.workspace_mode.#{gateway.workspace_mode}") %></span></td>
+          <td><%= gateway.agents.count %></td>
+          <td>
+            <button type="button" class="btn btn-sm btn-secondary"
+                    data-action="gateway-check#check"
+                    data-gateway-check-url-param="<%= collavre.check_agent_gateway_path(gateway) %>">
+              <%= t("collavre.agent_gateways.check") %>
+            </button>
+            <span data-gateway-check-target="result" class="small text-muted"></span>
+            <%= link_to t("collavre.agent_gateways.edit"), collavre.edit_agent_gateway_path(gateway), class: "btn btn-sm btn-secondary" %>
+            <%= button_to t("collavre.agent_gateways.delete"), collavre.agent_gateway_path(gateway), method: :delete,
+                          class: "btn btn-sm btn-danger",
+                          form: { style: "display:inline", data: { turbo_confirm: t("collavre.agent_gateways.confirm_delete") } } %>
+          </td>
+        </tr>
+      <% end %>
+      <% if @agent_gateways.empty? %>
+        <tr><td colspan="5" class="text-muted"><%= t("collavre.agent_gateways.empty") %></td></tr>
+      <% end %>
+    </tbody>
+  </table>
+</div>
+
+<p><%= link_to t("app.back_to_profile"), collavre.user_path(Current.user) %></p>

data/app/views/collavre/agent_gateways/new.html.erb

@@ -0,0 +1,2 @@
+<h1 class="no-top-margin"><%= t("collavre.agent_gateways.new_title") %></h1>
+<%= render "form", agent_gateway: @agent_gateway %>

data/app/views/collavre/comments/_comments_popup.html.erb

@@ -1,14 +1,21 @@
 
 <% fullscreen = local_assigns.fetch(:fullscreen, false) %>
 <% auto_fullscreen = local_assigns.fetch(:auto_fullscreen, false) %>
+<% docked = local_assigns.fetch(:docked, false) %>
 <% creative = local_assigns[:creative] %>
 <div id="comments-popup" data-controller="comments--popup comments--list comments--form comments--presence comments--mention-menu comments--topics comments--contexts comments--drop-trigger share-modal" class="popup-box"
      data-fullscreen="<%= fullscreen %>"
+     data-docked="<%= docked %>"
+     data-docked-empty-text="<%= t('collavre.creatives.workspace.select_chat') %>"
+     data-default-title="<%= t('collavre.comments.comments') %>"
+     data-close-label="<%= t('collavre.comments.close') %>"
+     data-collapse-docked-label="<%= t('collavre.creatives.workspace.collapse_chat') %>"
+     data-expand-docked-label="<%= t('collavre.creatives.workspace.expand_chat') %>"
      <% if auto_fullscreen %>data-auto-fullscreen="true"<% end %>
      data-fullscreen-label="<%= t('collavre.comments.fullscreen', default: 'Full screen') %>"
      data-exit-fullscreen-label="<%= t('collavre.comments.exit_fullscreen', default: 'Exit full screen') %>"
      <% popup_creative = creative || (@parent_creative if auto_fullscreen) %>
-     <% if (fullscreen || auto_fullscreen) && popup_creative.present? %>
+     <% if (fullscreen || auto_fullscreen || docked) && popup_creative.present? %>
      data-creative-id="<%= popup_creative.id %>"
      data-creative-snippet="<%= popup_creative.creative_snippet %>"
      data-can-comment="<%= popup_creative.has_permission?(Current.user, :feedback) %>"
@@ -49,6 +56,7 @@
      data-add-participant-text="<%= t('collavre.comments.add_participant') %>"
      data-no-permission-text="<%= t('collavre.creatives.errors.no_permission') %>"
      data-review-button-text="<%= t('collavre.comments.review_button') %>"
+     data-chat-input-hint="<%= t('collavre.comments.chat_input_hint') %>"
      data-review-feedback-placeholder="<%= t('collavre.comments.review_feedback_placeholder') %>"
      data-review-summary-placeholder="<%= t('collavre.comments.review_summary_placeholder') %>"
      data-review-add-quote="<%= t('collavre.comments.review_add_quote') %>"
@@ -59,22 +67,18 @@
      data-review-type-review-label="<%= t('collavre.comments.review_type_review') %>"
      data-review-type-question-label="<%= t('collavre.comments.review_type_question') %>"
      data-remove-from-history-label="<%= t('collavre.comments.remove_from_history') %>"
+     data-topic-set-agent-error="<%= t('collavre.comments.topic_set_agent_error') %>"
+     data-topic-agent-assigned-title="<%= t('collavre.comments.topic_agent_assigned_title', name: '%{name}') %>"
+     data-topic-clear-agent-confirm="<%= t('collavre.comments.topic_clear_agent_confirm', name: '%{name}') %>"
+     data-topic-create-error="<%= t('collavre.comments.topic_create_error') %>"
+     data-topic-update-error="<%= t('collavre.comments.topic_update_error') %>"
+     data-topic-delete-error="<%= t('collavre.comments.topic_delete_error') %>"
+     data-topic-archive-error="<%= t('collavre.comments.topic_archive_error') %>"
+     data-topic-restore-error="<%= t('collavre.comments.topic_restore_error') %>"
      data-inbox-reply-button="<%= t('collavre.comments.inbox_reply_button') %>"
      data-table-download-csv-text="<%= t('collavre.comments.table_download.csv') %>"
      data-table-download-excel-text="<%= t('collavre.comments.table_download.excel') %>"
-     <% if Current.user %>
-     data-typo-enabled="<%= Current.user.typo_correction_enabled %>"
-     data-typo-threshold="<%= Current.user.typo_correction_threshold %>"
-     data-typo-on-voice="<%= Current.user.typo_correction_on_voice %>"
-     data-typo-on-soft-keyboard="<%= Current.user.typo_correction_on_soft_keyboard %>"
-     data-typo-on-physical-keyboard="<%= Current.user.typo_correction_on_physical_keyboard %>"
-     data-typo-in-chat="<%= Current.user.typo_correction_in_chat %>"
-     data-typo-in-editor="<%= Current.user.typo_correction_in_editor %>"
-     data-typo-endpoint="<%= collavre.typo_corrections_path %>"
-     data-typo-keep-label="<%= t('collavre.comments.typo_keep_label') %>"
-     data-typo-custom-label="<%= t('collavre.comments.typo_custom_label') %>"
-     data-typo-input-label="<%= t('collavre.comments.typo_input_label') %>"
-     <% end %>>
+     >
   <div class="resize-handle resize-handle-left" data-comments--popup-target="leftHandle"></div>
   <div class="resize-handle resize-handle-right" data-comments--popup-target="rightHandle"></div>
   <div class="comments-popup-header" data-comments--popup-target="header">
@@ -115,7 +119,14 @@
           <%= svg_tag "exit-fullscreen.svg", class: "comments-popup-action-icon" %>
         </span>
       </button>
-      <button id="close-comments-btn" data-comments--popup-target="closeButton" class="popup-close-btn" type="button">&times;</button>
+      <button id="close-comments-btn" data-comments--popup-target="closeButton" class="comments-popup-action popup-close-btn" type="button" aria-label="<%= t('collavre.comments.close') %>" title="<%= t('collavre.comments.close') %>">
+        <span data-comments--popup-target="closeIcon" aria-hidden="true">
+          <%= svg_tag "close.svg", class: "comments-popup-action-icon" %>
+        </span>
+        <span data-comments--popup-target="expandDockedIcon" aria-hidden="true" style="display:none;">
+          <%= svg_tag "chevron-left.svg", class: "comments-popup-action-icon" %>
+        </span>
+      </button>
     </div>
   </div>
   <div id="comment-contexts" data-comments--contexts-target="list" class="comment-contexts-list" style="display:none;"
@@ -129,10 +140,14 @@
     <div id="comment-topics" data-comments--topics-target="list" class="comment-topics-list"
          data-confirm-delete-text="<%= t('collavre.topics.delete_confirm') %>"
          data-new-topic-placeholder="<%= t('collavre.topics.new_placeholder') %>"></div>
+    <span class="topic-creation-container" data-comments--topics-target="creationContainer" hidden
+          data-action="dragover->comments--topics#handleAddButtonDragOver dragleave->comments--topics#handleDragLeave drop->comments--topics#handleAddButtonDrop"></span>
     <button type="button" class="topic-list-btn"
-            data-action="click->comments--topics#openTopicListPopup"
+			data-comments--topics-target="topicListButton"
+			data-action="pointerdown->comments--topics#prepareTopicListToggle pointerup->comments--topics#finishTopicListToggle pointercancel->comments--topics#cancelTopicListToggle click->comments--topics#openTopicListPopup"
             title="<%= t('collavre.comments.topic_list') %>"
-            aria-label="<%= t('collavre.comments.topic_list') %>">
+			aria-label="<%= t('collavre.comments.topic_list') %>"
+			aria-expanded="false">
       <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/><line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/></svg>
     </button>
   </div>

data/app/views/collavre/comments/_empty_state.html.erb

@@ -0,0 +1,33 @@
+<%
+  dismissed = (Current.user.dismissed_notices || []).map(&:to_s)
+  inbox_system = creative.inbox? && topic&.name == Collavre::Creative::SYSTEM_TOPIC_NAME
+  cards = Collavre::FeatureCardRegistry.for(creative: creative, topic: topic)
+  visible_cards = cards.reject { |card| dismissed.include?(card.key.to_s) }
+  title_key = inbox_system ? "collavre.comments.empty_state.inbox_system_title" : "collavre.comments.empty_state.title"
+  prompt_key = inbox_system ? "collavre.comments.empty_state.inbox_system_minimal_prompt" : "collavre.comments.empty_state.minimal_prompt"
+  unless creative.has_permission?(Current.user, :admin)
+    visible_cards = visible_cards.reject { |card| card.action&.dig(:type) == :share_modal }
+  end
+  # A command is submitted as a comment, so the card only leads somewhere when
+  # CommentsController#create would accept one: it rejects an archived Creative
+  # outright, and a viewer without :feedback after that.
+  if creative.archived? || !creative.has_permission?(Current.user, :feedback)
+    visible_cards = visible_cards.reject { |card| card.action&.dig(:type) == :command_menu }
+  end
+%>
+<div id="no-comments" class="comments-placeholder" data-controller="comments--feature-cards comments--placeholder">
+  <template data-comments--feature-cards-target="minimalTemplate">
+    <%= render partial: "collavre/comments/empty_state_minimal", locals: { prompt_key: prompt_key } %>
+  </template>
+
+  <% if visible_cards.any? %>
+    <p class="feature-cards-title"><%= t(title_key) %></p>
+    <div class="feature-card-grid" data-comments--feature-cards-target="grid">
+      <% visible_cards.each do |card| %>
+        <%= render partial: "collavre/comments/feature_card", locals: { creative: creative, card: card } %>
+      <% end %>
+    </div>
+  <% else %>
+    <%= render partial: "collavre/comments/empty_state_minimal", locals: { prompt_key: prompt_key } %>
+  <% end %>
+</div>

data/app/views/collavre/comments/_empty_state_minimal.html.erb

@@ -0,0 +1,7 @@
+<div class="chat-empty-minimal">
+  <p><%= t(prompt_key) %></p>
+  <button type="button" class="chat-empty-restore-btn"
+          data-action="click->comments--feature-cards#restoreAll"
+          title="<%= t("collavre.comments.empty_state.restore_cards") %>"
+          aria-label="<%= t("collavre.comments.empty_state.restore_cards") %>">?</button>
+</div>

data/app/views/collavre/comments/_feature_card.html.erb

@@ -0,0 +1,35 @@
+<div class="feature-card" data-key="<%= card.key %>" data-comments--feature-cards-target="card">
+  <button type="button" class="feature-card-dismiss"
+          data-action="click->comments--feature-cards#dismiss"
+          data-key="<%= card.key %>"
+          title="<%= t("collavre.comments.empty_state.dismiss") %>"
+          aria-label="<%= t("collavre.comments.empty_state.dismiss") %>">&times;</button>
+  <div class="feature-card-icon" aria-hidden="true"><%= card.icon %></div>
+  <div class="feature-card-title"><%= t(card.title_key) %></div>
+  <p class="feature-card-description"><%= t(card.description_key) %></p>
+  <% if card.action.present? %>
+    <% case card.action[:type]
+    when :command_menu %>
+      <button type="button" class="feature-card-action" data-action="click->comments--feature-cards#openCommandMenu">
+        <%= t(card.action[:label_key]) %>
+      </button>
+    <% when :topic_list %>
+      <button type="button" class="feature-card-action" data-action="click->comments--topics#openTopicListPopup">
+        <%= t(card.action[:label_key]) %>
+      </button>
+    <% when :share_modal %>
+      <button type="button" class="feature-card-action"
+              data-action="click->share-modal#open"
+              data-share-modal-url-param="<%= collavre.creative_creative_shares_path(creative) %>">
+        <%= t(card.action[:label_key]) %>
+      </button>
+    <% end %>
+  <% end %>
+  <% if card.guide_link? %>
+    <%# `collavre` is the bare engine route helper, so pass the request's mount
+        prefix explicitly. A vendor URL is used verbatim because it may be external. %>
+    <%= link_to t("collavre.comments.empty_state.learn_more"),
+                card.guide_url.presence || collavre.feature_path(card.key, locale: I18n.locale, script_name: request.script_name),
+                class: "feature-card-guide-link" %>
+  <% end %>
+</div>

data/app/views/collavre/comments/_list.html.erb

@@ -4,7 +4,8 @@
   <% comments.each do |comment| %>
     <%= render partial: 'collavre/comments/comment', locals: { comment: comment, read_by_users: read_receipts&.[](comment.id), present_user_ids: present_user_ids, current_topic_id: current_topic_id } %>
   <% end %>
+<% elsif local_assigns[:search].present? %>
+  <%= render partial: 'collavre/comments/no_search_results' %>
 <% else %>
-  <div id="no-comments"><%= t('collavre.comments.no_comments') %></div>
+  <%= render partial: 'collavre/comments/empty_state', locals: { creative: creative, topic: local_assigns[:current_topic] } %>
 <% end %>
-

data/app/views/collavre/comments/_no_search_results.html.erb

@@ -0,0 +1,3 @@
+<div id="no-search-results" class="comments-placeholder" data-controller="comments--placeholder">
+  <p><%= t("collavre.comments.empty_state.no_search_results") %></p>
+</div>

data/app/views/collavre/creatives/_add_button.html.erb

@@ -1,20 +1,18 @@
-<% if @parent_creative %>
-  <%= button_tag(
-        type: 'button',
-        class: 'creative-header-outline-btn add-creative-btn',
-        data: { parent_id: @parent_creative.id },
-        aria: { label: t('collavre.creatives.index.new_creative') },
-        title: t('collavre.creatives.index.new_creative_shortcut')
-      ) do %>
-    <span aria-hidden="true"><%= svg_tag 'add.svg', class: 'icon-add', width: 16, height: 16 %></span>
-  <% end %>
-<% else %>
-  <%= button_tag(
-        type: 'button',
-        class: 'creative-header-outline-btn new-root-creative-btn',
-        aria: { label: t('collavre.creatives.index.new_creative') },
-        title: t('collavre.creatives.index.new_creative_shortcut')
-      ) do %>
-    <span aria-hidden="true"><%= svg_tag 'add.svg', class: 'icon-add', width: 16, height: 16 %></span>
-  <% end %>
+<%
+  label = local_assigns[:label]
+  shortcut_hint = local_assigns[:shortcut_hint]
+  base_class = @parent_creative ? 'add-creative-btn' : 'new-root-creative-btn'
+  css_class = label ? "btn btn-primary #{base_class} add-creative-btn--cta" : "creative-header-outline-btn #{base_class}"
+  data_attrs = @parent_creative ? { parent_id: @parent_creative.id } : {}
+%>
+<%= button_tag(
+      type: 'button',
+      class: css_class,
+      data: data_attrs,
+      aria: { label: t('collavre.creatives.index.new_creative') },
+      title: t('collavre.creatives.index.new_creative_shortcut')
+    ) do %>
+  <span aria-hidden="true"><%= svg_tag 'add.svg', class: 'icon-add', width: 16, height: 16 %></span>
+  <% if label %><span class="add-creative-btn-label"><%= label %></span><% end %>
+  <% if shortcut_hint %><kbd class="add-creative-btn-kbd"><%= shortcut_hint %></kbd><% end %>
 <% end %>

data/app/views/collavre/creatives/_empty_state.html.erb

@@ -0,0 +1,109 @@
+<%
+  # Locals:
+  #   root:     Boolean — true for the root-level "no creatives" case, false for a
+  #             specific parent's "no sub-creatives" case.
+  #   can_add:  Boolean — same write-gate used for the header Add/Import controls
+  #             (see index.html.erb). Decides whether the writable CTAs or the
+  #             read-only "request write access" variant is shown.
+  #   creative: The Collavre::Creative to request write access on (nil at root,
+  #             where can_add is always true for authenticated users so this
+  #             branch never needs it).
+  heading = root ? t('collavre.creatives.index.empty_state_heading_root') : t('collavre.creatives.index.empty_state_heading_sub')
+  add_label = root ? t('collavre.creatives.index.empty_state_add_creative') : t('collavre.creatives.index.empty_state_add_sub_creative')
+%>
+<div class="creative-empty-state">
+  <div class="creative-empty-state-icon" aria-hidden="true">
+    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
+      <rect x="3" y="3" width="7" height="5" rx="1"/>
+      <rect x="14" y="10" width="7" height="5" rx="1"/>
+      <rect x="14" y="17.5" width="7" height="5" rx="1" opacity="0.45"/>
+      <%# Trunk plus the elbow into the lower node. The elbow has to land on the
+          node's vertical centre (y=20 for a rect at y=17.5, height 5) — ending
+          at y=19 ran the connector into the node's rounded top-left corner,
+          which at this icon's 28px render size reads as a folded corner. %>
+      <path d="M6.5 8v10a2 2 0 0 0 2 2H14"/>
+      <%# Elbow into the upper node. It starts at the branch point instead of
+          re-drawing the trunk from y=8: two separately antialiased strokes over
+          the same pixels leave a visible step where the overlap ends. %>
+      <path d="M6.5 10.5a2 2 0 0 0 2 2H14"/>
+    </svg>
+  </div>
+  <h3 class="creative-empty-state-heading"><%= heading %></h3>
+
+  <div class="creative-empty-state-concept">
+    <div class="creative-empty-state-concept-title"><%= t('collavre.creatives.index.empty_state_concept_title') %></div>
+    <div class="creative-empty-state-concept-diagram">
+      <div class="creative-empty-state-facet">
+        <div class="creative-empty-state-facet-chip" aria-hidden="true">
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/><path d="M8 13h8M8 17h5"/></svg>
+        </div>
+        <div class="creative-empty-state-facet-label"><%= t('collavre.creatives.index.empty_state_facet_doc') %></div>
+      </div>
+      <%# Each operator is grouped with the term it introduces, so when the
+          diagram is too narrow for one row it breaks *before* an operator
+          rather than stranding one at the end of a row. %>
+      <div class="creative-empty-state-term">
+        <span class="creative-empty-state-op" aria-hidden="true">+</span>
+        <div class="creative-empty-state-facet">
+          <div class="creative-empty-state-facet-chip" aria-hidden="true">
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="3"/><path d="M8 12l3 3 5-6"/></svg>
+          </div>
+          <div class="creative-empty-state-facet-label"><%= t('collavre.creatives.index.empty_state_facet_task') %></div>
+        </div>
+      </div>
+      <div class="creative-empty-state-term">
+        <span class="creative-empty-state-op" aria-hidden="true">+</span>
+        <div class="creative-empty-state-facet">
+          <div class="creative-empty-state-facet-chip" aria-hidden="true">
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-8.5 8.3 8.9 8.9 0 0 1-3.9-.9L3 20l1.1-4.4a8.1 8.1 0 0 1-1-3.9A8.38 8.38 0 0 1 11.6 3.4a8.38 8.38 0 0 1 9.4 8.1z"/></svg>
+          </div>
+          <div class="creative-empty-state-facet-label"><%= t('collavre.creatives.index.empty_state_facet_chat') %></div>
+        </div>
+      </div>
+      <div class="creative-empty-state-term creative-empty-state-result">
+        <span class="creative-empty-state-op" aria-hidden="true">=</span>
+        <div class="creative-empty-state-block">
+          <div class="creative-empty-state-block-icons" aria-hidden="true">
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/><path d="M8 13h8M8 17h5"/></svg>
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="3"/><path d="M8 12l3 3 5-6"/></svg>
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-8.5 8.3 8.9 8.9 0 0 1-3.9-.9L3 20l1.1-4.4a8.1 8.1 0 0 1-1-3.9A8.38 8.38 0 0 1 11.6 3.4a8.38 8.38 0 0 1 9.4 8.1z"/></svg>
+          </div>
+          <div class="creative-empty-state-block-label"><%= t('collavre.creatives.index.empty_state_block_label') %></div>
+        </div>
+      </div>
+    </div>
+    <p class="creative-empty-state-concept-caption"><%= t('collavre.creatives.index.empty_state_concept_caption') %></p>
+  </div>
+
+  <% if can_add %>
+    <div class="creative-empty-state-actions">
+      <div class="creative-empty-state-actions-row">
+        <%= render 'add_button', label: add_label, shortcut_hint: t('collavre.creatives.index.empty_state_add_shortcut') %>
+        <button type="button" class="btn btn-secondary" data-action="click->creatives--import#toggle">
+          <span aria-hidden="true"><%= svg_tag 'arrow-down.svg', width: 14, height: 14 %></span>
+          <%= t('collavre.creatives.index.import_markdown') %>
+        </button>
+      </div>
+    </div>
+  <% elsif !authenticated? %>
+    <div class="creative-empty-state-loggedout">
+      <p class="creative-empty-state-loggedout-message"><%= t('collavre.creatives.index.empty_state_loggedout_message') %></p>
+      <div class="creative-empty-state-actions-row">
+        <%= link_to t('collavre.users.new.sign_up'), collavre.new_user_path, class: 'btn btn-primary' %>
+        <%= link_to t('app.sign_in'), collavre.new_session_path, class: 'btn btn-secondary' %>
+      </div>
+    </div>
+  <% elsif creative %>
+    <div class="creative-empty-state-readonly" data-controller="creatives--write-access-request" data-creatives--write-access-request-url-value="<%= request_permission_creative_path(creative) %>" data-creatives--write-access-request-failure-message-value="<%= t('collavre.creatives.index.empty_state_request_failed') %>">
+      <p class="creative-empty-state-readonly-message"><%= t('collavre.creatives.index.empty_state_readonly_message') %></p>
+      <button type="button" class="btn btn-primary" data-creatives--write-access-request-target="button" data-action="click->creatives--write-access-request#request">
+        <span aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="10" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg></span>
+        <%= t('collavre.creatives.index.request_permission') %>
+      </button>
+      <span class="creative-empty-state-request-pending" data-creatives--write-access-request-target="pending" hidden>
+        <span class="creative-empty-state-request-pending-dot" aria-hidden="true"></span>
+        <%= t('collavre.creatives.index.empty_state_request_pending') %>
+      </span>
+    </div>
+  <% end %>
+</div>

data/app/views/collavre/creatives/_inline_edit_form.html.erb

@@ -1,5 +1,6 @@
 <div id="inline-edit-form" class="inline-edit-form-shell" style="display:none;">
-  <form id="inline-edit-form-element" method="post">
+  <form id="inline-edit-form-element" method="post"
+        data-save-failed-message="<%= t('collavre.creatives.index.save_failed_alert') %>">
     <input type="hidden" id="inline-method" name="_method" value="patch" />
     <input type="hidden" name="authenticity_token" value="<%= form_authenticity_token %>" />
     <input type="hidden" id="inline-creative-description" name="creative[description]" />
@@ -94,7 +95,9 @@
                   data-confirm="<%= t('collavre.creatives.index.archive_confirm') %>"
                   data-archive-label="<%= t('collavre.creatives.index.archive') %>"
                   data-restore-label="<%= t('collavre.creatives.index.unarchive') %>"
-                  data-restore-confirm="<%= t('collavre.creatives.index.unarchive_confirm', default: 'Restore this creative?') %>">
+                  data-restore-confirm="<%= t('collavre.creatives.index.unarchive_confirm', default: 'Restore this creative?') %>"
+                  data-failure-message="<%= t('collavre.creatives.index.archive_failed_alert') %>"
+                  data-restore-failure-message="<%= t('collavre.creatives.index.unarchive_failed_alert') %>">
             <%= t('collavre.creatives.index.archive') %>
           </button>
           <button type="button"
@@ -131,8 +134,6 @@
           &nbsp;<%= svg_tag 'close.svg',class: 'icon-svg', width: 24, height: 24 %>
         </button>
       </div>
-      <button type="button" id="inline-recommend-parent" class="creative-action-btn" style="margin-top:0.5em;" title="<%= t('collavre.creatives.index.recommend_parent') %>">✨<%= t('collavre.creatives.index.recommend_parent') %></button>
-      <select id="parent-suggestions" size="5" style="display:none;margin-top:0.5em;width:100%;"></select>
       <div id="metadata-popup" style="display:none;" class="metadata-popup">
         <div class="metadata-popup-header">
           <span><%= t('collavre.creatives.index.metadata_title') %></span>
@@ -146,4 +147,3 @@
     </div>
   </form>
 </div>
-

data/app/views/collavre/creatives/_tree_loading_placeholder.html.erb

@@ -0,0 +1,16 @@
+<%# Server-rendered twin of tree_controller#showLoadingIndicator's markup.
+    Rendered inside #creatives so the very first paint already shows "loading"
+    instead of the empty state; tree_controller adopts this exact node when it
+    boots (see data-creatives-tree-loading), so nothing is torn down and
+    rebuilt. Keep the markup in sync with showLoadingIndicator(). %>
+<%= tag.div(
+      tag.span(
+        safe_join(Array.new(3) { tag.span('.', class: 'creative-loading-dot') }),
+        class: 'creative-loading-indicator',
+        aria: { hidden: true }
+      ),
+      class: 'creative-tree-loading-placeholder',
+      role: 'status',
+      aria: { live: 'polite', label: t('collavre.creatives.index.loading_creatives') },
+      data: { creatives_tree_loading: '' }
+    ) %>

data/app/views/collavre/creatives/_workspace_tree.html.erb

@@ -0,0 +1,33 @@
+<section class="creative-workspace-tree-region"
+         data-controller="workspace-tree"
+         data-workspace-tree-url-value="<%= creatives_path(format: :json, workspace_tree: 1) %>"
+         data-workspace-tree-last-visited-creative-url-value="<%= creatives_path %>"
+         data-workspace-tree-last-visited-creative-visit-token-value="<%= @last_visited_creative_token %>"
+         data-workspace-tree-last-visited-creative-visit-sequence-value="<%= @last_visited_creative_visit_sequence %>"
+         data-workspace-tree-current-path-value="<%= @workspace_path_ids.to_json %>"
+         data-workspace-tree-loading-text-value="<%= t('app.loading') %>"
+         data-workspace-tree-empty-text-value="<%= t('collavre.creatives.workspace.empty') %>"
+         data-workspace-tree-error-text-value="<%= t('collavre.creatives.workspace.load_error') %>">
+  <%# Keep the stream source inside the tree region: as a direct child of the
+      grid shell it would become a grid item with its own implicit row and
+      push all three columns down. %>
+  <%= turbo_stream_from Current.user, :creative_tree %>
+  <button type="button"
+          class="creative-workspace-tree-toggle"
+          data-workspace-tree-target="panelToggle"
+          data-action="workspace-tree#togglePanel"
+          aria-expanded="false"
+          aria-controls="creative-workspace-tree"
+          aria-label="<%= t('collavre.creatives.workspace.toggle_tree') %>"
+          title="<%= t('collavre.creatives.workspace.toggle_tree') %>">
+    <%= svg_tag "chevron-right.svg", class: "creative-workspace-tree-toggle-icon", width: 18, height: 18 %>
+  </button>
+  <aside id="creative-workspace-tree" aria-label="<%= t('collavre.creatives.workspace.tree_label') %>">
+    <header class="creative-workspace-tree-header">
+      <h2><%= t('collavre.creatives.workspace.tree_title') %></h2>
+    </header>
+    <nav class="creative-workspace-tree-nav" data-workspace-tree-target="tree">
+      <p class="creative-workspace-tree-status"><%= t('app.loading') %></p>
+    </nav>
+  </aside>
+</section>