fix: set explicit form action URLs for Turbo Frame modal forms

When a form has no explicit action, Symfony renders action="" which the
browser resolves to the page URL, not the URL the Turbo Frame was
fetched from. This caused edits submitted via the modal to POST to the
wrong route and silently discard changes.

assets/controllers/bo/question_list_controller.js

@@ -8,9 +8,11 @@ export default class extends Controller {
     canModify: Boolean,
     savedLabel: String,
     errorLabel: String,
+    errorHint: String,
   };
 
   connect() {
+    this._locked = false;
     if (this.canModifyValue) {
       this._setupDrag();
     }
@@ -66,7 +68,7 @@ export default class extends Controller {
 
     this.listTarget.addEventListener('drop', async (e) => {
       e.preventDefault();
-      if (!this._dragging || !this._placeholder) return;
+      if (!this._dragging || !this._placeholder || this._locked) return;
       this.listTarget.insertBefore(this._dragging, this._placeholder);
       this._removePlaceholder();
       await this._persistOrder();
@@ -107,15 +109,26 @@ export default class extends Controller {
       if (numberEl) numberEl.textContent = String(i + 1);
     });
 
-    try {
+    for (let attempt = 0; attempt < 2; attempt++) {
-      const res = await fetch(this.reorderUrlValue, {method: 'POST', body: params});
+      try {
-      if (res.ok) {
+        const res = await fetch(this.reorderUrlValue, {method: 'POST', body: params});
-        this._setStatus('saved');
+        if (res.ok) {
-      } else {
+          this._setStatus('saved');
-        this._setStatus('error');
+          return;
+        }
+      } catch {
+        // network error — retry on first attempt
       }
-    } catch {
-      this._setStatus('error');
     }
+
+    this._locked = true;
+    this._setStatus('error');
+
+    const alert = document.createElement('div');
+    alert.className = 'alert alert-danger alert-dismissible mt-3';
+    alert.setAttribute('role', 'alert');
+    const hint = this.errorHintValue || 'Refresh the page to try again.';
+    alert.innerHTML = `${this.errorLabelValue || 'Error saving order'} &mdash; ${hint} <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>`;
+    this.listTarget.after(alert);
   }
 }

src/Controller/Backoffice/QuestionBankController.php

@@ -90,7 +90,10 @@ class QuestionBankController extends AbstractController
 
         $isTurboFrame = $request->headers->has('Turbo-Frame');
 
-        $form = $this->createForm(BankQuestionFormType::class, $bankQuestion, ['season' => $season]);
+        $form = $this->createForm(BankQuestionFormType::class, $bankQuestion, [
+            'season' => $season,
+            'action' => $this->generateUrl('tvdt_backoffice_question_bank_new', ['seasonCode' => $season->seasonCode]),
+        ]);
         $form->handleRequest($request);
 
         if ($form->isSubmitted() && $form->isValid()) {
@@ -138,7 +141,13 @@ class QuestionBankController extends AbstractController
 
         $isTurboFrame = $request->headers->has('Turbo-Frame');
 
-        $form = $this->createForm(BankQuestionFormType::class, $bankQuestion, ['season' => $season]);
+        $form = $this->createForm(BankQuestionFormType::class, $bankQuestion, [
+            'season' => $season,
+            'action' => $this->generateUrl('tvdt_backoffice_question_bank_edit', [
+                'seasonCode' => $season->seasonCode,
+                'bankQuestion' => $bankQuestion->id,
+            ]),
+        ]);
         $form->handleRequest($request);
 
         if ($form->isSubmitted() && $form->isValid()) {

src/Controller/Backoffice/QuizQuestionController.php

@@ -46,7 +46,13 @@ class QuizQuestionController extends AbstractController
 
         $isTurboFrame = $request->headers->has('Turbo-Frame');
 
-        $form = $this->createForm(QuestionFormType::class, $question);
+        $form = $this->createForm(QuestionFormType::class, $question, [
+            'action' => $this->generateUrl('tvdt_backoffice_quiz_question_edit', [
+                'seasonCode' => $season->seasonCode,
+                'quiz' => $quiz->id,
+                'question' => $question->id,
+            ]),
+        ]);
         $form->handleRequest($request);
 
         if ($form->isSubmitted() && $form->isValid()) {
@@ -83,6 +89,7 @@ class QuizQuestionController extends AbstractController
         return $response;
     }
 
+    #[IsGranted(SeasonVoter::EDIT, subject: 'season')]
     #[Route(
         '/backoffice/season/{seasonCode:season}/quiz/{quiz}/question/{question}/view',
         name: 'tvdt_backoffice_quiz_question_view',
@@ -127,6 +134,10 @@ class QuizQuestionController extends AbstractController
             }
         }
 
+        if (\count(array_unique($ordering)) !== \count($questionsById)) {
+            throw new BadRequestHttpException('Ordering must include every question exactly once');
+        }
+
         $position = 1;
         foreach ($ordering as $questionId) {
             $questionsById[$questionId]->ordering = $position++;

templates/backoffice/partials/answer_row.html.twig

@@ -4,7 +4,7 @@
         <span class="text-muted" data-drag-handle style="cursor: grab" title="{{ 'Drag to reorder'|trans }}"><i class="bi bi-grip-vertical"></i></span>
         <div class="flex-grow-1">{{ form_widget(answerForm.text) }}</div>
         <div class="d-none">{{ form_widget(answerForm.isRightAnswer) }}</div>
-        <button type="button" tabindex="-1"
+        <button type="button"
                 class="btn btn-sm {{ answerForm.isRightAnswer.vars.checked ? 'btn-success' : 'btn-danger' }}"
                 title="{{ 'Toggle correct answer'|trans }}"
                 onclick="var cb=this.closest('[data-collection-item]').querySelector('input[type=checkbox]');cb.checked=!cb.checked;this.classList.toggle('btn-success',cb.checked);this.classList.toggle('btn-danger',!cb.checked);this.querySelector('i').className=cb.checked?'bi bi-check-lg':'bi bi-x-lg'">

templates/backoffice/quiz/tab_overview.html.twig

@@ -91,7 +91,8 @@
          data-bo--question-list-csrf-value="{{ csrf_token('question_reorder') }}"
          data-bo--question-list-can-modify-value="{{ is_granted('QUIZ_MODIFY_CONTENT', quiz) ? 'true' : 'false' }}"
          data-bo--question-list-saved-label-value="{{ 'Order saved'|trans }}"
-         data-bo--question-list-error-label-value="{{ 'Error saving order'|trans }}">
+         data-bo--question-list-error-label-value="{{ 'Error saving order'|trans }}"
+         data-bo--question-list-error-hint-value="{{ 'Refresh the page to try again.'|trans }}">
 
         <h4 class="mb-3 d-flex align-items-center gap-2">
             {{ 'Questions'|trans }}
@@ -135,7 +136,7 @@
                     </div>
                 </div>
             {% else %}
-                {{ 'EMPTY'|trans }}
+                {{ 'No questions have been added to this quiz yet.'|trans }}
             {% endfor %}
         </div>
 

templates/backoffice/season/tab_question_bank.html.twig

@@ -129,6 +129,7 @@
                             <button type="button" class="btn btn-outline-secondary"
                                     data-action="click->bo--modal#open"
                                     data-src="{{ path('tvdt_backoffice_question_bank_edit', {seasonCode: season.seasonCode, bankQuestion: bankQuestion.id}) }}"
+                                    data-modal-title="{{ 'Edit question'|trans }}"
                                     title="{{ 'Edit'|trans }}"><i class="bi bi-pencil"></i></button>
                             <button type="button" class="btn btn-outline-danger" data-bs-toggle="modal"
                                     data-bs-target="#deleteBankQuestion-{{ bankQuestion.id }}"

translations/messages+intl-icu.nl.xliff

@@ -259,7 +259,7 @@
       </trans-unit>
       <trans-unit id="NXU7HO." resname="Error saving order">
         <source>Error saving order</source>
-        <target>Fout bij opslaan volgorde</target>
+        <target>Fout bij het opslaan van de volgorde</target>
       </trans-unit>
       <trans-unit id="bgWPQMg" resname="Export to XLSX">
         <source>Export to XLSX</source>
@@ -423,7 +423,7 @@
       </trans-unit>
       <trans-unit id="PywqOf4" resname="Owner(s)">
         <source>Owner(s)</source>
-        <target>Eigena(a)r(en)</target>
+        <target>Eigenaar/Eigenaren</target>
       </trans-unit>
       <trans-unit id="GqmFSHc" resname="Password">
         <source>Password</source>