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>
This commit is contained in:
John Mizerek 2026-03-03 19:53:44 -08:00
parent a67d225164
commit 9000fc91fe

View file

@ -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"/>