diff --git a/app/javascript/controllers/distribution_confirmation_controller.js b/app/javascript/controllers/distribution_confirmation_controller.js index a89334af44..7c3de5b74d 100644 --- a/app/javascript/controllers/distribution_confirmation_controller.js +++ b/app/javascript/controllers/distribution_confirmation_controller.js @@ -5,11 +5,13 @@ import { Controller } from "@hotwired/stimulus" * Displays a confirmation modal with the details of the Distribution form. * Launched when the user clicks Save from the Distribution Form. - * First runs a "pre-check" on the form data to a validation endpoint. - * If the pre-check passes, it shows the modal. + * First runs a "pre-check" on the form data to a validation endpoint, + * which is specified in the controller's `preCheckPathValue` property. + * If the pre-check passes, it shows the modal. Because the confirmation modal should only be shown + * when the form data can pass initial validation. * If the pre-check fails, it submits the form to the server for full validation and render with the errors. - * Shows the user what they're about to submit, including items and quantities to distribute. + * The modal shows the user what they're about to submit, including items and quantities to distribute. * If the user clicks the "Yes..." button from the modal, it submits the form. * If the user clicks the "No..." button from the modal, it closes and user remains on the same url. */ @@ -26,6 +28,10 @@ export default class extends Controller { "tbody" ] + static values = { + preCheckPath: String + } + openModal(event) { event.preventDefault(); this.debugFormData(); @@ -34,7 +40,7 @@ export default class extends Controller { const formObject = this.buildNestedObject(formData); // TODO: #3090 - does fetch work in FF and Safari? - fetch("/distributions/validate.json", { + fetch(this.preCheckPathValue, { method: "POST", headers: { "Content-Type": "application/json", @@ -57,6 +63,7 @@ export default class extends Controller { .catch((error) => { // Something went wrong trying to talk to server validation endpoint // In this case, just submit the form as if the user had clicked Save. + // NICE TO HAVE: Send to bugsnag but need to install/configure https://www.npmjs.com/package/@bugsnag/js console.log(`=== DistributionConfirmationController ERROR ${error}`); this.formTarget.requestSubmit(); }); diff --git a/app/views/distributions/new.html.erb b/app/views/distributions/new.html.erb index 807b15696d..dd513f926c 100644 --- a/app/views/distributions/new.html.erb +++ b/app/views/distributions/new.html.erb @@ -33,7 +33,9 @@