feat: al agregar uno nuevo, cerrar el modal y abrir el formulario

app/controllers/posts_controller.rb

@@ -53,6 +53,13 @@ class PostsController < ApplicationController
         site.posts(lang: locale).build(layout: params.require(:layout))
       end
 
+    triggers = {}
+    params.permit(:show, :hide).each_pair do |key, value|
+      triggers["modal:#{key}"] = { id: value }
+    end
+
+    headers['HX-Trigger-After-Swap'] = triggers.to_json if triggers.present?
+
     render layout: false
   end
 

app/views/posts/attributes/_new_has_many.haml

@@ -1,11 +1,21 @@
 -#
-  Genera un listado de checkboxes entre los que se puede elegir para guardar
+  Genera un listado de checkboxes entre los que se puede elegir para
+  guardar.  Podemos elegir entre los artículos ya cargados o agregar uno
+  nuevo.
+
+  Al agregar uno nuevo, se abre un segundo modal que carga el formulario
+  correspondiente vía HTMX. El formulario tiene que cargarse por fuera
+  del formulario principal porque no se pueden anidar.
+
 :ruby
   id = "#{base}_#{attribute}"
   name = "#{base}[#{attribute}][]"
   form_id = "form-#{Nanoid.generate}"
   modal_id = "modal-#{Nanoid.generate}"
+  post_id = "post-#{Nanoid.generate}"
   post_form_id = "post-form-#{Nanoid.generate}"
+  post_modal_id = "post-modal-#{Nanoid.generate}"
+  post_form_loaded_id = "post-loaded-#{Nanoid.generate}"
 
 %div{ id: modal_id, data: { controller: 'modal array', 'array-original-value': metadata.value.to_json, 'array-new-array-value': site_posts_new_related_post_path(site) } }
   .form-group
@@ -63,5 +73,15 @@
       = render 'bootstrap/btn', content: t('.accept'), action: 'array#accept modal#hide', class: 'm-0 mr-1'
       = render 'bootstrap/btn', content: t('.cancel'), action: 'array#cancel modal#hide', class: 'm-0'
 
+-#
+  Este segundo modal es el que carga los formularios de
+  creación/modificación de artículos relacionados. Se envía a post_form
+  para que sea externo al formulario actual.
 - content_for :post_form do
-  %form{ id: post_form_id }
+  %form{ id: post_form_id, 'hx-get': site_posts_form_path(site), 'hx-target': "##{post_form_loaded_id}" }
+    %input{ type: 'hidden', name: 'show', value: post_modal_id }
+    %input{ type: 'hidden', name: 'hide', value: modal_id }
+  %div{ id: post_modal_id, data: { controller: 'modal' } }
+    = render 'bootstrap/modal', id: post_id, modal_content_attributes: { class: 'h-100' } do
+      - content_for :"#{post_id}_body" do
+        %div{ id: post_form_loaded_id }