Update query_runner.html

resources/views/query_runner.html

@@ -229,8 +229,11 @@
                                     </label>
                                     <input x-model="updateBuilder.value"
                                         class="w-full border rounded px-2 py-1 font-mono focus:outline-none focus:ring-1 focus:ring-[#8eb02f]"
-                                        :placeholder="updateBuilder.op === '$inc' ? '1' : updateBuilder.op === '$rename' ? 'nuevo_nombre' : '&quot;valor&quot;'"
+                                        :placeholder="updateBuilder.op === '$inc' ? '1' : updateBuilder.op === '$rename' ? 'nuevo_nombre' : 'Admin2026!'"
                                         x-show="updateBuilder.op !== '$unset'">
+                                    <p x-show="updateBuilder.op !== '$unset'" class="text-[9px] text-gray-400 mt-0.5 leading-tight">
+                                        Los strings se auto-encierran en comillas. Para JSON explícito usa <span class="font-mono">"valor"</span>, <span class="font-mono">123</span>, <span class="font-mono">true</span>, <span class="font-mono">{}</span>.
+                                    </p>
                                     <span x-show="updateBuilder.op === '$unset'" class="text-[10px] text-gray-400 block py-1.5 italic">El campo será eliminado del documento.</span>
                                 </div>
                                 <div>
@@ -568,14 +571,32 @@ document.addEventListener('alpine:init', () => {
             document.getElementById('sql-editor')?.focus();
         },
 
+        // Convierte un valor crudo ingresado por el usuario a JSON válido.
+        // Si ya es un literal JSON (num, bool, null, string entre comillas, objeto/array)
+        // lo deja intacto; de lo contrario lo trata como string y lo envuelve en comillas.
+        toJsonValue(raw) {
+            const s = (raw || '').trim();
+            if (s === '') return '""';
+            // Ya es string JSON, número, bool, null, objeto o array
+            if (/^".*"$/.test(s)) return s;
+            if (s === 'true' || s === 'false' || s === 'null') return s;
+            if (/^-?\d+(\.\d+)?([eE][+-]?\d+)?$/.test(s)) return s;
+            if ((s.startsWith('{') && s.endsWith('}')) || (s.startsWith('[') && s.endsWith(']'))) return s;
+            // Bare string → escapar y envolver en comillas
+            const escaped = s.replace(/\\/g, '\\\\').replace(/"/g, '\\"');
+            return `"${escaped}"`;
+        },
+
         generateUpdate() {
             const col = this.updateBuilder.collection || this.selectedCollection || 'coleccion';
             const field = this.updateBuilder.field || 'campo';
-            const value = this.updateBuilder.value || '"nuevo_valor"';
+            const rawValue = this.updateBuilder.value || '"nuevo_valor"';
             const filterField = this.updateBuilder.filterField || '_id';
-            const filterValue = this.updateBuilder.filterValue || '""';
+            const rawFilter = this.updateBuilder.filterValue || '""';
             const op = this.updateBuilder.op || '$set';
             const method = this.updateBuilder.multi === 'many' ? 'updateMany' : 'updateOne';
+            const value = this.toJsonValue(rawValue);
+            const filterValue = this.toJsonValue(rawFilter);
             let updateDoc;
             if (op === '$unset') updateDoc = `{ "${field}": "" }`;
             else updateDoc = `{ "${field}": ${value} }`;