From 1f440475ed5917c87eefaf018a0b39a93a5c0266 Mon Sep 17 00:00:00 2001
From: mdashlw <mdashlw@gmail.com>
Date: Sun, 24 Mar 2024 18:44:48 +0300
Subject: [PATCH] fix sources block not updating properly after saving (#216)

---
 assets/js/misc.js                                |  3 +--
 assets/js/sources.js                             | 16 +++++++++++++++-
 .../templates/image/_source.html.slime           |  2 +-
 3 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/assets/js/misc.js b/assets/js/misc.js
index 283201e2..5733e954 100644
--- a/assets/js/misc.js
+++ b/assets/js/misc.js
@@ -11,8 +11,7 @@ function formResult({target, detail}) {
 
   const elements = {
     '#description-form': '.image-description',
-    '#uploader-form': '.image_uploader',
-    '#source-form': '#image-source'
+    '#uploader-form': '.image_uploader'
   };
 
   function showResult(resultEl, formEl, response) {
diff --git a/assets/js/sources.js b/assets/js/sources.js
index 210382fc..bb4ae3ad 100644
--- a/assets/js/sources.js
+++ b/assets/js/sources.js
@@ -1,6 +1,6 @@
 import { inputDuplicatorCreator } from './input-duplicator';
 
-function imageSourcesCreator() {
+function setupInputs() {
   inputDuplicatorCreator({
     addButtonSelector: '.js-image-add-source',
     fieldSelector: '.js-image-source',
@@ -9,4 +9,18 @@ function imageSourcesCreator() {
   });
 }
 
+function imageSourcesCreator() {
+  setupInputs();
+  document.addEventListener('fetchcomplete', ({ target, detail }) => {
+    const sourceSauce = document.querySelector('.js-sourcesauce');
+
+    if (target.matches('#source-form')) {
+      detail.text().then(text => {
+        sourceSauce.outerHTML = text;
+        setupInputs();
+      });
+    }
+  });
+}
+
 export { imageSourcesCreator };
diff --git a/lib/philomena_web/templates/image/_source.html.slime b/lib/philomena_web/templates/image/_source.html.slime
index f1be8bcc..2d39b306 100644
--- a/lib/philomena_web/templates/image/_source.html.slime
+++ b/lib/philomena_web/templates/image/_source.html.slime
@@ -1,4 +1,4 @@
-.block
+.js-sourcesauce
   - has_sources = Enum.any?(@image.sources)
   = form_for @changeset, Routes.image_source_path(@conn, :update, @image), [method: "put", class: "hidden", id: "source-form", data: [remote: "true"]], fn f ->
     = if can?(@conn, :edit_metadata, @image) and !@conn.assigns.current_ban do