From f17214f76c402a23b5fba8f773375a56ebd625d8 Mon Sep 17 00:00:00 2001
From: Chuck <chuck@example.com>
Date: Thu, 8 Jan 2026 13:51:21 -0500
Subject: [PATCH] fix: Use indexed names for checkbox-group to work with
 existing parser

Change checkbox-group widget to use indexed field names instead of bracket
notation, so the existing indexed field parser correctly handles multiple
selected values.

Problem:
- checkbox-group uses name="{{ full_key }}[]" which requires bracket
  notation handling in backend
- While bracket notation handler exists, using indexed names is more robust
  and leverages existing well-tested indexed field parser
- Indexed field parser already handles fields like "field_name.0",
  "field_name.1" correctly

Solution:
- Template: Change name="{{ full_key }}[]" to name="{{ full_key }}.{{
  loop.index0 }}"
- JavaScript: Update checkbox-group rendering to use name="."
- Backend indexed field parser (lines 3364-3388) already handles this pattern:
  - Detects fields ending with numeric indices (e.g., ".0", ".1")
  - Groups them by base_path and sorts by index
  - Combines into array correctly

This ensures checkbox-group values are properly preserved when multiple
options are selected, working with the existing schema-based parsing system.
---
 web_interface/static/v3/plugins_manager.js             | 4 ++--
 web_interface/templates/v3/partials/plugin_config.html | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/web_interface/static/v3/plugins_manager.js b/web_interface/static/v3/plugins_manager.js
index 631a9c36..f6a43057 100644
--- a/web_interface/static/v3/plugins_manager.js
+++ b/web_interface/static/v3/plugins_manager.js
@@ -3002,7 +3002,7 @@ function generateFieldHtml(key, prop, value, prefix = '') {
             const labels = xOptions.labels || {};
             
             html += `<div class="mt-1 space-y-2">`;
-            enumItems.forEach(option => {
+            enumItems.forEach((option, index) => {
                 const isChecked = arrayValue.includes(option);
                 const label = labels[option] || option.replace(/_/g, ' ').replace(/\b\w/g, l => l.toUpperCase());
                 const checkboxId = `${fullKey.replace(/\./g, '_')}_${option}`;
@@ -3010,7 +3010,7 @@ function generateFieldHtml(key, prop, value, prefix = '') {
                     <label class="flex items-center">
                         <input type="checkbox" 
                                id="${checkboxId}" 
-                               name="${fullKey}[]" 
+                               name="${fullKey}.${index}" 
                                value="${option}" 
                                ${isChecked ? 'checked' : ''} 
                                class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded">
diff --git a/web_interface/templates/v3/partials/plugin_config.html b/web_interface/templates/v3/partials/plugin_config.html
index 516089f2..b237b51d 100644
--- a/web_interface/templates/v3/partials/plugin_config.html
+++ b/web_interface/templates/v3/partials/plugin_config.html
@@ -168,7 +168,7 @@
                     <label class="flex items-center cursor-pointer">
                         <input type="checkbox" 
                                id="{{ checkbox_id }}"
-                               name="{{ full_key }}[]" 
+                               name="{{ full_key }}.{{ loop.index0 }}" 
                                value="{{ option }}"
                                {% if is_checked %}checked{% endif %}
                                class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded">