From 419034255a7ce4c09a1f1cc2e33771f1e868142c Mon Sep 17 00:00:00 2001
From: Jared Miller <jared@smell.flowers>
Date: Wed, 28 Jan 2026 13:02:45 -0500
Subject: [PATCH] Fix QuestionPrompt to iterate questions array

QuestionPrompt has a questions array, not flat fields. Updated rendering
to iterate over each question item with its own header, question text,
and options.
---
 public/index.html | 51 ++++++++++++++++++++++++++++-------------------
 1 file changed, 30 insertions(+), 21 deletions(-)

diff --git a/public/index.html b/public/index.html
index cf8663b..72f7d8e 100644
--- a/public/index.html
+++ b/public/index.html
@@ -621,36 +621,45 @@
 
     function renderQuestionPrompt(p) {
       const json = p.json;
-      const header = json.header || '';
-      const question = json.question || p.text;
-      const options = json.options || [];
-      const multiSelect = json.multi_select || false;
-      const allowsOther = json.allows_other || false;
-      const inputType = multiSelect ? 'checkbox' : 'radio';
+      const questions = json.questions || [];
 
-      const optionsHtml = options.map((opt, idx) => `
-        <label class="prompt-option" onclick="selectOption('${p.id}', ${idx})">
-          <input type="${inputType}" name="prompt-${p.id}" value="${escapeHtml(opt)}">
-          <span class="prompt-option-label">${escapeHtml(opt)}</span>
-        </label>
-      `).join('');
+      const questionsHtml = questions.map((q, qIdx) => {
+        const header = q.header || '';
+        const question = q.question || '';
+        const options = q.options || [];
+        const multiSelect = q.multi_select || false;
+        const allowsOther = q.allows_other || false;
+        const inputType = multiSelect ? 'checkbox' : 'radio';
+        const inputName = `prompt-${p.id}-${qIdx}`;
 
-      const otherHtml = allowsOther ? `
-        <label class="prompt-option">
-          <input type="${inputType}" name="prompt-${p.id}" value="__other__" onclick="enableOtherInput('${p.id}')">
-          <span class="prompt-option-label">Other</span>
-        </label>
-        <input type="text" class="prompt-other-input" id="other-${p.id}" placeholder="Enter your answer..." disabled>
-      ` : '';
+        const optionsHtml = options.map((opt, idx) => `
+          <label class="prompt-option" onclick="selectOption('${p.id}', ${idx})">
+            <input type="${inputType}" name="${inputName}" value="${escapeHtml(opt.value)}">
+            <span class="prompt-option-label">${escapeHtml(opt.label)}</span>
+          </label>
+        `).join('');
 
-      return `
-        <div class="prompt" data-prompt="${p.id}">
+        const otherHtml = allowsOther ? `
+          <label class="prompt-option">
+            <input type="${inputType}" name="${inputName}" value="__other__" onclick="enableOtherInput('${p.id}-${qIdx}')">
+            <span class="prompt-option-label">Other</span>
+          </label>
+          <input type="text" class="prompt-other-input" id="other-${p.id}-${qIdx}" placeholder="Enter your answer..." disabled>
+        ` : '';
+
+        return `
           ${header ? `<div class="prompt-header">${escapeHtml(header)}</div>` : ''}
           <div class="prompt-question">${escapeHtml(question)}</div>
           <div class="prompt-options">
             ${optionsHtml}
             ${otherHtml}
           </div>
+        `;
+      }).join('');
+
+      return `
+        <div class="prompt" data-prompt="${p.id}">
+          ${questionsHtml}
           <div class="prompt-actions">
             <button class="btn btn-submit" onclick="submitRichPrompt('${p.id}')">Submit</button>
           </div>