From 9000fc91fedb8e2109d9de6f11b4955860cf4e08 Mon Sep 17 00:00:00 2001
From: John Mizerek <mizerek@gmail.com>
Date: Tue, 3 Mar 2026 19:53:44 -0800
Subject: [PATCH] Fix Show Modifiers button not rendering in template literal

Move the conditional out of the nested template literal to avoid
parsing issues with arrow functions inside backtick strings. Also
skip empty mod-groups divs on items without modifiers.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 portal/setup-wizard.html | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/portal/setup-wizard.html b/portal/setup-wizard.html
index 84ab8e1..a65a4d1 100644
--- a/portal/setup-wizard.html
+++ b/portal/setup-wizard.html
@@ -2905,7 +2905,7 @@
                     <td>
                       <strong>${item.name}</strong>
                       ${item.description ? `<br><small style="color:var(--gray-500);">${item.description}</small>` : ''}
-                      <div class="item-mod-groups">${modGroupsHtml}</div>
+                      ${modGroupsHtml ? `<div class="item-mod-groups">${modGroupsHtml}</div>` : ''}
                     </td>
                     <td>$${parseFloat(item.price || 0).toFixed(2)}</td>
                     <td>
@@ -2935,6 +2935,9 @@
         itemsHtml += renderCategoryItems(catName, false);
       }
 
+      const hasAnyMods = items.some(it => (it.modifiers || []).length > 0);
+      const modsBtn = hasAnyMods ? '<button class="btn btn-outline" id="toggleModsBtn" onclick="toggleItemModifiers()">Show Modifiers</button>' : '';
+
       addMessage('ai', `
         <p>I found <strong>${items.length} menu items</strong> across your categories:</p>
         <div class="items-section" id="itemsList">
@@ -2942,7 +2945,7 @@
         </div>
         <p>Uncheck any items you don't want to include.</p>
         <div class="action-buttons">
-          ${items.some(it => (it.modifiers || []).length > 0) ? `<button class="btn btn-outline" id="toggleModsBtn" onclick="toggleItemModifiers()">Show Modifiers</button>` : ''}
+          ${modsBtn}
           <button class="btn btn-success" onclick="confirmItems()">
             <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
               <polyline points="20 6 9 17 4 12"/>