diff --git a/Gemfile.lock b/Gemfile.lock index 243cc1489..17fd617d1 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -608,7 +608,7 @@ GEM tiktoken_ruby (0.0.12-x86_64-linux) timeout (0.4.3) tsort (0.2.0) - turbo-rails (2.0.16) + turbo-rails (2.0.17) actionpack (>= 7.1.0) railties (>= 7.1.0) tzinfo (2.0.6) diff --git a/app/controllers/columns/cards/drops/closures_controller.rb b/app/controllers/columns/cards/drops/closures_controller.rb index fc31ee553..ba0dc67df 100644 --- a/app/controllers/columns/cards/drops/closures_controller.rb +++ b/app/controllers/columns/cards/drops/closures_controller.rb @@ -4,6 +4,6 @@ class Columns::Cards::Drops::ClosuresController < ApplicationController def create @card.close - render turbo_stream: turbo_stream.replace("closed-cards", partial: "collections/show/closed", locals: { collection: @card.collection }) + render turbo_stream: turbo_stream.replace("closed-cards", partial: "collections/show/closed", method: :morph, locals: { collection: @card.collection }) end end diff --git a/app/controllers/columns/cards/drops/columns_controller.rb b/app/controllers/columns/cards/drops/columns_controller.rb index e0fb77efa..cb2c3b4a8 100644 --- a/app/controllers/columns/cards/drops/columns_controller.rb +++ b/app/controllers/columns/cards/drops/columns_controller.rb @@ -5,6 +5,6 @@ class Columns::Cards::Drops::ColumnsController < ApplicationController column = @card.collection.columns.find(params[:column_id]) @card.triage_into(column) - render turbo_stream: turbo_stream.replace(dom_id(column), partial: "collections/show/column", locals: { column: column }) + render turbo_stream: turbo_stream.replace(dom_id(column), partial: "collections/show/column", method: :morph, locals: { column: column }) end end diff --git a/app/controllers/columns/cards/drops/streams_controller.rb b/app/controllers/columns/cards/drops/streams_controller.rb index 981ad7853..d9141af7a 100644 --- a/app/controllers/columns/cards/drops/streams_controller.rb +++ b/app/controllers/columns/cards/drops/streams_controller.rb @@ -5,6 +5,6 @@ class Columns::Cards::Drops::StreamsController < ApplicationController @card.send_back_to_triage set_page_and_extract_portion_from @collection.cards.awaiting_triage.reverse_chronologically - render turbo_stream: turbo_stream.replace("the-stream", partial: "collections/show/stream", locals: { collection: @card.collection, page: @page }) + render turbo_stream: turbo_stream.replace("the-stream", partial: "collections/show/stream", method: :morph, locals: { collection: @card.collection, page: @page }) end end diff --git a/app/helpers/cards_helper.rb b/app/helpers/cards_helper.rb index 7a826d197..0a2faf3b8 100644 --- a/app/helpers/cards_helper.rb +++ b/app/helpers/cards_helper.rb @@ -72,7 +72,7 @@ module CardsHelper def cards_expander(title, count) tag.header class: "cards__expander btn btn--plain", data: { action: "click->collapsible-columns#toggle" }, style: "--card-count: #{[count, 20].min}", aria: { role: "button" } do - concat(tag.span count > 99 ? "99+" : count, class: "cards__expander-count") + concat(tag.span count > 99 ? "99+" : count, class: "cards__expander-count", "data-drag-and-drop-counter": true) concat(tag.h2 title, class: "cards__expander-title") end end diff --git a/app/javascript/application.js b/app/javascript/application.js index dbac91d0a..bdafb95b0 100644 --- a/app/javascript/application.js +++ b/app/javascript/application.js @@ -6,4 +6,3 @@ import "controllers" import "lexxy" import "@rails/actiontext" -window.fetch = Turbo.fetch // TODO: We need to make @rails/request.js use Turbo's fetch when it's present. diff --git a/app/javascript/controllers/drag_and_drop_controller.js b/app/javascript/controllers/drag_and_drop_controller.js index 62358cb08..aea151c0c 100644 --- a/app/javascript/controllers/drag_and_drop_controller.js +++ b/app/javascript/controllers/drag_and_drop_controller.js @@ -37,8 +37,10 @@ export default class extends Controller { if (!container || container === this.sourceContainer) { return } this.wasDropped = true - + this.#decreaseCounter(this.sourceContainer) + const sourceContainer = this.sourceContainer await this.#submitDropRequest(this.dragItem, container) + this.#reloadSourceFrame(sourceContainer); } dragEnd() { @@ -66,8 +68,6 @@ export default class extends Controller { this.containerTargets.forEach(container => container.classList.remove(this.hoverContainerClass)) } - // Private - async #submitDropRequest(item, container) { const body = new FormData() const id = item.dataset.id @@ -75,4 +75,31 @@ export default class extends Controller { return post(url, { body, headers: { Accept: "text/vnd.turbo-stream.html" } }) } + + #reloadSourceFrame(sourceContainer) { + const frame = sourceContainer.querySelector("[data-drag-and-drop-refresh]") + if (frame) { + frame.addEventListener("turbo:before-frame-render", ({ detail }) => { + detail.render = function (currentElement, newElement) { + Turbo.morphChildren(currentElement, newElement) + } + }, { once: true }) + + frame.reload() + } + } + + #decreaseCounter(sourceContainer) { + const counterElement = sourceContainer.querySelector("[data-drag-and-drop-counter]") + if (counterElement) { + const currentValue = counterElement.textContent.trim() + + if (!/^\d+$/.test(currentValue)) return + + const count = parseInt(currentValue) + if (count > 0) { + counterElement.textContent = count - 1 + } + } + } } diff --git a/app/views/collections/show/_closed.html.erb b/app/views/collections/show/_closed.html.erb index ff074db66..ff8132206 100644 --- a/app/views/collections/show/_closed.html.erb +++ b/app/views/collections/show/_closed.html.erb @@ -7,5 +7,5 @@ <%= cards_expander "Done", collection.cards.closed.count %> - <%= turbo_frame_tag :closed_column, src: collection_columns_closed_path(collection) %> + <%= turbo_frame_tag :closed_column, src: collection_columns_closed_path(collection), "data-drag-and-drop-refresh": true, refresh: :morph %> diff --git a/app/views/collections/show/_column.html.erb b/app/views/collections/show/_column.html.erb index ce917f14d..7d9fae634 100644 --- a/app/views/collections/show/_column.html.erb +++ b/app/views/collections/show/_column.html.erb @@ -1,11 +1,11 @@ diff --git a/app/views/collections/show/_not_now.html.erb b/app/views/collections/show/_not_now.html.erb index 62ff7e0d5..1d8e39a25 100644 --- a/app/views/collections/show/_not_now.html.erb +++ b/app/views/collections/show/_not_now.html.erb @@ -7,5 +7,5 @@ <%= cards_expander "Not Now", collection.cards.postponed.count %> - <%= turbo_frame_tag :not_now_column, src: collection_columns_not_now_path(collection) %> + <%= turbo_frame_tag :not_now_column, src: collection_columns_not_now_path(collection), "data-drag-and-drop-refresh": true, refresh: :morph %>