Make redirects from edit and new routes work with turbo frame

In order to make redirects to the index route from an edit or new form and being able to re-display the form with errors in case of failed validation, we need to explicitely set the request format to html, otherwise turbo will refresh the edit/new page. Co-authored-by: Martin Meyerhoff <[email protected]>
solidusio · Jan 10, 2025 · c771be0 · c771be0
1 parent c6f32b7
commit c771be0
Show file tree

Hide file tree

Showing 13 changed files with 76 additions and 89 deletions.
diff --git a/admin/app/components/solidus_admin/base_component.rb b/admin/app/components/solidus_admin/base_component.rb
@@ -37,5 +37,6 @@ def self.stimulus_id
     end
 
     delegate :stimulus_id, to: :class
+    delegate :search_filter_params, to: :helpers
   end
 end
diff --git a/admin/app/components/solidus_admin/return_reasons/edit/component.html.erb b/admin/app/components/solidus_admin/return_reasons/edit/component.html.erb
@@ -1,6 +1,6 @@
-<%= turbo_frame_tag :edit_return_reason_modal do %>
-  <%= render component("ui/modal").new(title: t(".title")) do |modal| %>
-    <%= form_for @return_reason, url: solidus_admin.return_reason_path(@return_reason), html: { id: form_id } do |f| %>
+<%= turbo_frame_tag :edit_return_reason_modal, target: "_top" do %>
+  <%= render component("ui/modal").new(title: t(".title"), closable: closable?) do |modal| %>
+    <%= form_for @return_reason, url: form_url, html: { id: form_id } do |f| %>
       <div class="flex flex-col gap-6 pb-4">
         <%= render component("ui/forms/field").text_field(f, :name, class: "required") %>
         <label class="flex gap-2 items-center">
@@ -15,9 +15,18 @@
         </label>
       </div>
       <% modal.with_actions do %>
-        <form method="dialog">
-          <%= render component("ui/button").new(scheme: :secondary, text: t('.cancel')) %>
-        </form>
+        <% if closable? %>
+          <form method="dialog">
+            <%= render component("ui/button").new(scheme: :secondary, text: t('.cancel')) %>
+          </form>
+        <% else %>
+          <%= render component("ui/button").new(
+            tag: :a,
+            href: back_url,
+            scheme: :secondary,
+            text: t('.cancel')
+          ) %>
+        <% end %>
         <%= render component("ui/button").new(form: form_id, type: :submit, text: t('.submit')) %>
       <% end %>
     <% end %>

diff --git a/admin/app/components/solidus_admin/return_reasons/edit/component.rb b/admin/app/components/solidus_admin/return_reasons/edit/component.rb
@@ -1,11 +1,8 @@
 # frozen_string_literal: true
 
-class SolidusAdmin::ReturnReasons::Edit::Component < SolidusAdmin::BaseComponent
+class SolidusAdmin::ReturnReasons::Edit::Component < SolidusAdmin::Resources::Edit::Component
   def initialize(return_reason:)
     @return_reason = return_reason
-  end
-
-  def form_id
-    dom_id(@return_reason, "#{stimulus_id}_edit_return_reason_form")
+    super(return_reason)
   end
 end
diff --git a/admin/app/components/solidus_admin/return_reasons/index/component.rb b/admin/app/components/solidus_admin/return_reasons/index/component.rb
@@ -14,7 +14,7 @@ def search_key
   end
 
   def edit_path(return_reason)
-    spree.edit_admin_return_reason_path(return_reason)
+    spree.edit_admin_return_reason_path(return_reason, **search_filter_params)
   end
 
   def turbo_frames
@@ -28,7 +28,7 @@ def page_actions
     render component("ui/button").new(
       tag: :a,
       text: t('.add'),
-      href: solidus_admin.new_return_reason_path,
+      href: solidus_admin.new_return_reason_path(**search_filter_params),
       data: { turbo_frame: :new_return_reason_modal, turbo_prefetch: false },
       icon: "add-line",
       class: "align-self-end w-full",

diff --git a/admin/app/components/solidus_admin/return_reasons/new/component.html.erb b/admin/app/components/solidus_admin/return_reasons/new/component.html.erb
@@ -1,6 +1,6 @@
-<%= turbo_frame_tag :new_return_reason_modal do %>
-  <%= render component("ui/modal").new(title: t(".title")) do |modal| %>
-    <%= form_for @return_reason, url: solidus_admin.return_reasons_path, html: { id: form_id } do |f| %>
+<%= turbo_frame_tag :new_return_reason_modal, target: "_top" do %>
+  <%= render component("ui/modal").new(title: t(".title"), closable: closable?) do |modal| %>
+    <%= form_for @return_reason, url: form_url, html: { id: form_id } do |f| %>
       <div class="flex flex-col gap-6 pb-4">
         <%= render component("ui/forms/field").text_field(f, :name, class: "required") %>
         <label class="flex gap-2 items-center">
@@ -15,9 +15,18 @@
         </label>
       </div>
       <% modal.with_actions do %>
-        <form method="dialog">
-          <%= render component("ui/button").new(scheme: :secondary, text: t('.cancel')) %>
-        </form>
+        <% if closable? %>
+          <form method="dialog">
+            <%= render component("ui/button").new(scheme: :secondary, text: t('.cancel')) %>
+          </form>
+        <% else %>
+          <%= render component("ui/button").new(
+            tag: :a,
+            href: back_url,
+            scheme: :secondary,
+            text: t('.cancel')
+          ) %>
+        <% end %>
         <%= render component("ui/button").new(form: form_id, type: :submit, text: t('.submit')) %>
       <% end %>
     <% end %>

diff --git a/admin/app/components/solidus_admin/return_reasons/new/component.rb b/admin/app/components/solidus_admin/return_reasons/new/component.rb
@@ -1,11 +1,5 @@
 # frozen_string_literal: true
 
-class SolidusAdmin::ReturnReasons::New::Component < SolidusAdmin::BaseComponent
-  def initialize(return_reason:)
-    @return_reason = return_reason
-  end
+class SolidusAdmin::ReturnReasons::New::Component < SolidusAdmin::Resources::New::Component
 
-  def form_id
-    dom_id(@return_reason, "#{stimulus_id}_new_return_reason_form")
-  end
 end
diff --git a/admin/app/components/solidus_admin/tax_categories/edit/component.html.erb b/admin/app/components/solidus_admin/tax_categories/edit/component.html.erb
@@ -1,4 +1,4 @@
-<%= turbo_frame_tag :edit_tax_category_modal do %>
+<%= turbo_frame_tag :edit_tax_category_modal, target: :_top do %>
   <%= render component("ui/modal").new(title: t(".title")) do |modal| %>
     <%= form_for @tax_category, url: solidus_admin.tax_category_path(@tax_category), html: { id: form_id } do |f| %>
       <div class="flex flex-col gap-6 pb-4">

diff --git a/admin/app/components/solidus_admin/tax_categories/index/component.rb b/admin/app/components/solidus_admin/tax_categories/index/component.rb
@@ -18,7 +18,7 @@ def page_actions
       tag: :a,
       text: t('.add'),
       href: solidus_admin.new_tax_category_path, data: {
-        turbo_frame: :new_tax_category_modal,
+        turbo_frame: :new_tax_category,
         turbo_prefetch: false,
       },
       icon: "add-line",
@@ -28,7 +28,7 @@ def page_actions
 
   def turbo_frames
     %w[
-      new_tax_category_modal
+      new_tax_category
       edit_tax_category_modal
     ]
   end

diff --git a/admin/app/components/solidus_admin/tax_categories/new/component.html.erb b/admin/app/components/solidus_admin/tax_categories/new/component.html.erb
@@ -1,4 +1,4 @@
-<%= turbo_frame_tag :new_tax_category_modal do %>
+<%= turbo_frame_tag :new_tax_category, target: :_top do %>
   <%= render component("ui/modal").new(title: t(".title")) do |modal| %>
     <%= form_for @tax_category, url: solidus_admin.tax_categories_path(page: params[:page], q: params[:q]), html: { id: form_id } do |f| %>
       <div class="flex flex-col gap-6 pb-4">

diff --git a/admin/app/components/solidus_admin/ui/pages/index/component.html.erb b/admin/app/components/solidus_admin/ui/pages/index/component.html.erb
@@ -39,6 +39,6 @@
   <% end %>
 
   <% turbo_frames.each do |frame| %>
-    <%= turbo_frame_tag frame %>
+    <%= turbo_frame_tag frame, target: "_top" %>
   <% end %>
 <% end %>
diff --git a/admin/app/controllers/solidus_admin/base_controller.rb b/admin/app/controllers/solidus_admin/base_controller.rb
@@ -20,8 +20,14 @@ class BaseController < ApplicationController
     helper 'solidus_admin/components'
     helper 'solidus_admin/layout'
 
+    helper_method :search_filter_params
+
     private
 
+    def search_filter_params
+      request.params.slice(:q, :page)
+    end
+
     def set_layout
       if turbo_frame_request?
         false

diff --git a/admin/app/controllers/solidus_admin/return_reasons_controller.rb b/admin/app/controllers/solidus_admin/return_reasons_controller.rb
@@ -16,62 +16,45 @@ def index
 
     def new
       @return_reason = Spree::ReturnReason.new
-
-      respond_to do |format|
-        format.html { render component('return_reasons/new').new(return_reason: @return_reason) }
-      end
+      render component('return_reasons/new').new(@return_reason, closable: turbo_frame_request?)
     end
 
     def create
       @return_reason = Spree::ReturnReason.new(return_reason_params)
 
       if @return_reason.save
-        respond_to do |format|
-          flash[:notice] = t('.success')
-
-          format.html do
-            redirect_to solidus_admin.return_reasons_path, status: :see_other
-          end
-
-          format.turbo_stream do
-            render turbo_stream: '<turbo-stream action="refresh" />'
-          end
-        end
+        flash[:notice] = t('.success')
+        redirect_to solidus_admin.return_reasons_path(**search_filter_params), status: :see_other
       else
         respond_to do |format|
+          page_component = component('return_reasons/new').new(@return_reason, closable: turbo_frame_request?)
           format.html do
-            page_component = component('return_reasons/new').new(return_reason: @return_reason)
             render page_component, status: :unprocessable_entity
           end
+          format.turbo_stream do
+            render turbo_stream: turbo_stream.replace(:new_return_reason_modal, page_component), status: :unprocessable_entity
+          end
         end
       end
     end
 
     def edit
-      respond_to do |format|
-        format.html { render component('return_reasons/edit').new(return_reason: @return_reason) }
-      end
+      render component('return_reasons/edit').new(return_reason: @return_reason)
     end
 
     def update
       if @return_reason.update(return_reason_params)
-        respond_to do |format|
-          flash[:notice] = t('.success')
-
-          format.html do
-            redirect_to solidus_admin.return_reasons_path, status: :see_other
-          end
-
-          format.turbo_stream do
-            render turbo_stream: '<turbo-stream action="refresh" />'
-          end
-        end
+        flash[:notice] = t('.success')
+        redirect_to solidus_admin.return_reasons_path(**search_filter_params), status: :see_other
       else
         respond_to do |format|
+          page_component = component('return_reasons/edit').new(@return_reason, closable: turbo_frame_request?)
           format.html do
-            page_component = component('return_reasons/edit').new(return_reason: @return_reason)
             render page_component, status: :unprocessable_entity
           end
+          format.turbo_stream do
+            render turbo_stream: turbo_stream.replace(:edit_return_reason_modal, page_component), status: :unprocessable_entity
+          end
         end
       end
     end
@@ -82,7 +65,7 @@ def destroy
       Spree::ReturnReason.transaction { @return_reason.destroy }
 
       flash[:notice] = t('.success')
-      redirect_back_or_to return_reasons_path, status: :see_other
+      redirect_back_or_to return_reasons_path(**search_filter_params), status: :see_other
     end
 
     private

diff --git a/admin/app/controllers/solidus_admin/tax_categories_controller.rb b/admin/app/controllers/solidus_admin/tax_categories_controller.rb
@@ -26,48 +26,36 @@ def create
       @tax_category = Spree::TaxCategory.new(tax_category_params)
 
       if @tax_category.save
-        respond_to do |format|
-          flash[:notice] = t('.success')
-
-          format.html do
-            redirect_to solidus_admin.tax_categories_path, status: :see_other
-          end
-
-          format.turbo_stream do
-            # we need to explicitly write the refresh tag for now.
-            # See https://github.com/hotwired/turbo-rails/issues/579
-            render turbo_stream: '<turbo-stream action="refresh" />'
-          end
-        end
+        flash[:notice] = t('.success')
+        redirect_to solidus_admin.tax_categories_path, status: :see_other
       else
+        page_component = component('tax_categories/new').new(tax_category: @tax_category)
+
         respond_to do |format|
           format.html do
-            page_component = component('tax_categories/new').new(tax_category: @tax_category)
             render page_component, status: :unprocessable_entity
           end
+          format.turbo_stream do
+            render turbo_stream: turbo_stream.replace(@tax_category, page_component), status: :unprocessable_entity
+          end
         end
       end
     end
 
     def update
       if @tax_category.update(tax_category_params)
-        respond_to do |format|
-          flash[:notice] = t('.success')
-
-          format.html do
-            redirect_to solidus_admin.tax_categories_path, status: :see_other
-          end
-
-          format.turbo_stream do
-            render turbo_stream: '<turbo-stream action="refresh" />'
-          end
-        end
+        flash[:notice] = t('.success')
+        redirect_to solidus_admin.tax_categories_path, status: :see_other
       else
+        page_component = component('tax_categories/edit').new(tax_category: @tax_category)
+
         respond_to do |format|
           format.html do
-            page_component = component('tax_categories/edit').new(tax_category: @tax_category)
             render page_component, status: :unprocessable_entity
           end
+          format.turbo_stream do
+            render turbo_stream: turbo_stream.replace(:edit_tax_category_modal, page_component), status: :unprocessable_entity
+          end
         end
       end
     end
-Original file line number
+Diff line change
@@ Expand Up / @@ -37,5 +37,6 @@ def self.stimulus_id @@
         end
         delegate :stimulus_id, to: :class
+        delegate :search_filter_params, to: :helpers
       end
     end