1 files changed, 2 insertions, 55 deletions
diff --git a/webmentions_ssg/templates/received.html b/webmentions_ssg/templates/received.html
index a44b706..525e811 100644
--- a/webmentions_ssg/templates/received.html
+++ b/webmentions_ssg/templates/received.html
@@ -84,65 +84,12 @@
     {% if webmentions.pages > 1 %}
       <div class="mt-3">{{ render_pagination(webmentions) }}</div>
     {% endif %}
-    <div class="modal fade"
-         id="confirmation-modal"
-         tabindex="-1"
-         aria-labelledby="confirmation-modal-title"
-         aria-hidden="true">
-      <div class="modal-dialog modal-dialog-centered">
-        <div class="modal-content">
-          <div class="modal-header">
-            <h1 class="modal-title fs-5" id="confirmation-modal-title"></h1>
-            <button type="button"
-                    class="btn-close"
-                    data-bs-dismiss="modal"
-                    aria-label="Close"></button>
-          </div>
-          <div class="modal-body">
-            <p id="confirmation-modal-message" class="mb-0"></p>
-          </div>
-          <div class="modal-footer">
-            {{ render_form(action_form,
-                        id="confirmation-modal-form",
-                        button_style="primary",
-                        form_group_classes="mb-0") }}
-            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
-          </div>
-        </div>
-      </div>
-    </div>
+    {% include "includes/confirmation_modal.html" %}
   {% else %}
     <p class="text-body-secondary">No Webmentions have been received yet.</p>
   {% endif %}
 {% endblock %}
 {% block scripts %}
   {{ super() }}
-  <script>
-    const confirmationModal = document.getElementById(
-      "confirmation-modal"
-    );
-
-    confirmationModal.addEventListener("show.bs.modal", (event) => {
-      const button = event.relatedTarget;
-
-      const form = confirmationModal.querySelector(
-        "#confirmation-modal-form"
-      );
-      const title = confirmationModal.querySelector(
-        "#confirmation-modal-title"
-      );
-      const message = confirmationModal.querySelector(
-        "#confirmation-modal-message"
-      );
-      const submit = form.querySelector("#submit");
-
-      form.action = button.dataset.action;
-
-      title.textContent = button.dataset.title;
-      message.textContent = button.dataset.message;
-
-      submit.value = button.dataset.confirmLabel;
-      submit.className = `btn ${button.dataset.confirmClass}`;
-    });
-  </script>
+  <script src="{{ url_for('static', filename='js/confirmation-modal.js') }}"></script>
 {% endblock %}