[IMP] survey_extra_fields : handle file question on page navigation

* Show a stored file (after navigating back) the same way as a freshly
  selected one: a "filename + Remove file" chip, input hidden until removal.
* Keep the stored file when a page is re-submitted without a new selection
  (instead of overwriting it with a skipped answer).
* "Remove file" now sends a sentinel to actually delete the stored file,
  so the removal persists across navigation.

survey_extra_fields/static/src/js/survey_form.js

@@ -5,6 +5,76 @@ import { _t } from "@web/core/l10n/translation";
 import { rpc } from "@web/core/network/rpc";
 
 publicWidget.registry.SurveyFormWidget.include({
+    /**
+     * @override
+     * Bind delegated listeners on the form root so they keep working after each
+     * page is re-rendered (the inner content is replaced on navigation, but the
+     * root element persists). They let the user clear a selected file before
+     * submitting the form.
+     */
+    start: function () {
+        return this._super.apply(this, arguments).then(() => {
+            this.$el.on(
+                "change.surveyExtraFile",
+                'input[data-question-type="file"]',
+                this._onFileInputChange.bind(this)
+            );
+            this.$el.on(
+                "click.surveyExtraFile",
+                ".o_survey_file_clear",
+                this._onFileClearClick.bind(this)
+            );
+        });
+    },
+
+    /**
+     * On selection, show the file "chip" (filename + remove button) and hide the
+     * raw input, so a freshly selected file looks exactly like an already stored
+     * one (rendered server-side when navigating back).
+     */
+    _onFileInputChange: function (ev) {
+        const input = ev.currentTarget;
+        const container = input.closest(".o_survey_comment_container");
+        if (!container || !(input.files && input.files.length > 0)) {
+            return;
+        }
+        const chip = container.querySelector(".o_survey_file_selected");
+        const nameEl = container.querySelector(".o_survey_file_name");
+        if (nameEl) {
+            nameEl.textContent = input.files[0].name;
+        }
+        if (chip) {
+            chip.classList.remove("d-none");
+        }
+        delete input.dataset.fileCleared;
+        input.classList.add("d-none");
+    },
+
+    /**
+     * Discard the current file: hide the chip and bring back the input so the
+     * user can pick a new one. A file already stored server-side is only really
+     * replaced once a new file is submitted (see _save_lines).
+     */
+    _onFileClearClick: function (ev) {
+        ev.preventDefault();
+        const container = ev.currentTarget.closest(".o_survey_comment_container");
+        if (!container) {
+            return;
+        }
+        const input = container.querySelector('input[data-question-type="file"]');
+        const chip = container.querySelector(".o_survey_file_selected");
+        if (input) {
+            input.value = "";
+            // Flag the explicit removal so the submit tells the server to drop
+            // any previously stored file (instead of preserving it).
+            input.dataset.fileCleared = "1";
+            input.classList.remove("d-none");
+        }
+        if (chip) {
+            chip.classList.add("d-none");
+        }
+    },
+
     _readFileAsDataURL: function (file) {
         return new Promise(function (resolve, reject) {
             const reader = new FileReader();
@@ -27,11 +97,13 @@ publicWidget.registry.SurveyFormWidget.include({
      */
     _submitForm: async function (options) {
         const fileInputs = this.el.querySelectorAll('input[data-question-type="file"]');
-        const hasFiles = Array.from(fileInputs).some(
-            (input) => input.files && input.files.length > 0
+        // A file action is either a new selection or an explicit removal of a
+        // previously stored file (which must be communicated to the server).
+        const hasFileAction = Array.from(fileInputs).some(
+            (input) => (input.files && input.files.length > 0) || input.dataset.fileCleared
         );
 
-        if (!hasFiles || this.options.isStartScreen) {
+        if (!hasFileAction || this.options.isStartScreen) {
             return this._super(options);
         }
 
@@ -53,6 +125,8 @@ publicWidget.registry.SurveyFormWidget.include({
         this._prepareSubmitValues(formData, params);
 
         // Read all selected files as base64 and add them to the submit params.
+        // Explicitly cleared inputs (no new file) send a "cleared" sentinel so
+        // the server removes the previously stored file.
         const filePromises = [];
         for (const input of fileInputs) {
             if (input.files && input.files.length > 0) {
@@ -66,6 +140,8 @@ publicWidget.registry.SurveyFormWidget.include({
                         });
                     })
                 );
+            } else if (input.dataset.fileCleared) {
+                params[input.name] = JSON.stringify({ cleared: true });
             }
         }
 
@@ -108,7 +184,15 @@ publicWidget.registry.SurveyFormWidget.include({
                 $questionWrapper.data("constrErrorMsg") ||
                 _t("This question requires an answer.");
             if (questionRequired && !(this.files && this.files.length > 0)) {
-                errors[questionId] = constrErrorMsg;
+                // A file may already be stored server-side (e.g. uploaded then
+                // navigating back): the chip is visible even though the input is
+                // empty. Treat that as a valid answer.
+                const container = this.closest(".o_survey_comment_container");
+                const chip = container && container.querySelector(".o_survey_file_selected");
+                const hasExistingFile = chip && !chip.classList.contains("d-none");
+                if (!hasExistingFile) {
+                    errors[questionId] = constrErrorMsg;
+                }
                 return;
             }
             if (this.files && this.files.length > 0) {