[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_605":606,"_607":608},"routes/_app.x.$handle.$name",{"_101":100,"_32":46,"_110":91,"_27":111,"_13":14,"_112":-5,"_11":113,"_114":115,"_116":117,"_118":119,"_120":121,"_20":-5,"_122":-5,"_123":-5,"_124":25,"_125":126,"_127":60,"_128":-5,"_129":-5,"_130":131},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_44":45,"_32":46,"_39":47,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":54,"_55":-5,"_18":56,"_57":58,"_59":60,"_61":-5,"_62":-5,"_63":64,"_65":66,"_67":68,"_69":70,"_71":72,"_73":-5,"_74":75,"_76":75,"_77":78,"_79":78,"_80":78,"_81":75,"_82":75,"_83":84,"_85":86,"_87":88,"_89":25},"version",349,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":33,"_34":35,"_36":38,"_39":40,"_41":14,"_42":43,"_24":25},"previous",{"_30":31,"_32":33,"_34":35,"_36":37},"deleted",false,"deletedHere","path","frontend/components/App.tsx","latestPath","fileId","01a058f0-c40d-736f-b689-bcad497d29b6","name","App.tsx","fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useMemo, useState } from \"https://esm.sh/react@18.2.0\";\nimport {\n bluetoothDisponible,\n conectarImpresora,\n desconectarImpresora,\n estadoImpresora,\n imprimirBluetooth,\n imprimirLogoBluetooth,\n reconectarSiEsPosible,\n suscribirseImpresora,\n} from \"../lib/impresora.ts\";\n\ntype MenuItem = { categoriaOriginal: string; variante: string; producto: string; precio: number; notas: string };\ntype MenuGrupo = { nombre: string; items: MenuItem[] };\ntype PedidoItem = { rowId: string; categoria: string; producto: string; cantidad: number; precioUnitario: number; subtotal: number };\ntype Pedido = { id: string; tipo: string; identificador: string; envio: number | null; items: PedidoItem[]; total: number };\n\nconst OPCIONES_ENVIO = [5, 10, 15, 20, 25, 30];\ntype Alerta = { insumo: string; actual: number; minima: number; unidad: string };\n\nconst MESAS = [\"Mesa 1\", \"Mesa 2\", \"Barra 1\", \"Barra 2\"];\nconst METODOS_PAGO = [\"Efectivo\", \"Tarjeta\", \"Transferencia\"];\nconst PERFILES_SUGERIDOS = [\"Noel\", \"Gustavo\", \"Nasa\", \"Sari\", \"Salma\", \"Renata\", \"Padilla\"];\n\n// El perfil de \"quién está atendiendo\" se guarda en este dispositivo/navegador (no en el\n// servidor) — cada celular/computadora recuerda el suyo, así no hay que elegirlo en cada venta.\nconst LLAVE_PERFIL = \"suchi_perfil\";\nfunction leerPerfilGuardado(): string {\n try {\n return localStorage.getItem(LLAVE_PERFIL) || \"\";\n } catch {\n return \"\";\n }\n}\nfunction guardarPerfil(nombre: string) {\n try {\n localStorage.setItem(LLAVE_PERFIL, nombre);\n } catch {\n // si el navegador bloquea localStorage no pasa nada grave, solo no se recuerda\n }\n}\n\nasync function api(path: string, opts: RequestInit = {}) {\n const res = await fetch(path, {\n ...opts,\n headers: { \"Content-Type\": \"application/json\", ...(opts.headers || {}) },\n });\n const data = await res.json();\n if (!data.ok) throw new Error(data.error || \"Error desconocido\");\n return data;\n}\n\n// Insignia grande y bien contrastada para el ID de pedido — se usa en la lista de\n// pedidos abiertos, en el carrito y en el modal de cobro para que nunca pase desapercibido.\nfunction BadgeId({ id, size = \"md\" }: { id: string; size?: \"sm\" | \"md\" | \"lg\" }) {\n const tam = size === \"lg\" ? \"text-2xl px-3 py-1\" : size === \"md\" ? \"text-base px-2.5 py-1\" : \"text-sm px-2 py-0.5\";\n return #{id};\n}\n\n// Abre una ventana de impresión con el formato de ticket térmico de 80mm. Se usa tanto para\n// imprimir la comanda EN CUALQUIER MOMENTO mientras el pedido sigue abierto (sin necesidad de\n// cobrar) como para reimprimir comanda/cuenta desde el modal de cobro.\n// La comanda (para cocina) se imprime más grande y en negritas que el ticket (para el cliente),\n// para que se pueda leer de un vistazo rápido mientras se está preparando el pedido.\nfunction imprimirTexto(texto: string, titulo: string, opts: { fontSize?: number; bold?: boolean; logo?: boolean } = {}) {\n const { fontSize = 13, bold = false, logo = false } = opts;\n const w = window.open(\"\", \"_blank\", \"width=380,height=600\");\n if (!w) return;\n // Cuando es un ticket para el cliente (logo:true), abajo del texto se imprime el logo real\n // (la imagen, no un dibujo hecho con caracteres) más \"SUCHI HOUSE\" centrado — igual que en la\n // impresión por Bluetooth (ver imprimirLogoBluetooth en impresora.ts).\n const pieLogo = logo\n ? `

`\n : \"\";\n w.document.write(`\n \n \n ${titulo}\n \n \n ${texto.replace(/\n \n `);\n w.document.close();\n w.focus();\n w.print();\n}\n\n// Punto único de impresión de toda la app: si hay una impresora Bluetooth conectada, manda los\n// datos directo por ahí (sin diálogos ni ventanas). Si no hay ninguna conectada, o si algo falla\n// al mandarle los datos, cae de regreso a la ventana de impresión normal del navegador (imprimirTexto)\n// para que nunca se quede uno sin poder imprimir.\n// opts.logo: true SOLO para el ticket del cliente — agrega el logo real de Suchi House al final\n// (por Bluetooth: imagen rasterizada + texto; en la ventana normal: + texto). La comanda\n// (para cocina) y el corte de caja no llevan logo.\nasync function imprimir(texto: string, titulo: string, opts: { fontSize?: number; bold?: boolean; alturaDoble?: boolean; logo?: boolean } = {}) {\n if (estadoImpresora().conectada) {\n try {\n if (opts.logo) {\n await imprimirBluetooth(texto, { bold: opts.bold, alturaDoble: opts.alturaDoble, cortar: false });\n try {\n await imprimirLogoBluetooth(\"/frontend/logo-wordmark.svg\");\n } catch (e) {\n console.error(\"No se pudo imprimir el logo (el ticket de texto ya se imprimió bien):\", e);\n // El texto ya se mandó sin cortar (queda pendiente) — cortamos el papel igual, para\n // no dejarlo pegado en la impresora aunque el logo haya fallado.\n await imprimirBluetooth(\"\", { cortar: true });\n }\n } else {\n await imprimirBluetooth(texto, { bold: opts.bold, alturaDoble: opts.alturaDoble });\n }\n return;\n } catch (e: any) {\n console.error(\"Falló la impresión por Bluetooth, se usará la ventana de impresión normal:\", e);\n alert(`No se pudo imprimir por Bluetooth (${e.message}). Se abrirá la impresión normal.`);\n }\n }\n imprimirTexto(texto, titulo, { fontSize: opts.fontSize, bold: opts.bold, logo: opts.logo });\n}\n\n// Extrae solo los dígitos de un texto de teléfono (quita espacios, guiones, paréntesis) para\n// armar un link de WhatsApp. Devuelve \"\" si no parece un número usable.\nfunction soloDigitos(texto: string): string {\n const digitos = (texto || \"\").replace(/\\D/g, \"\");\n return digitos.length >= 10 ? digitos : \"\";\n}\n\n// Comparte el texto del ticket por WhatsApp (u otra app) sin necesidad de ninguna cuenta ni\n// configuración extra: usa el share nativo del celular si está disponible (el usuario elige a\n// quién mandarlo), y si no, abre un link directo de WhatsApp — a un número específico cuando lo\n// tenemos (pedidos a domicilio), o al selector de contactos de WhatsApp cuando no.\nasync function compartirTicket(texto: string, telefono?: string) {\n if ((navigator as any).share) {\n try {\n await (navigator as any).share({ text: texto });\n return;\n } catch {\n // el usuario canceló el share nativo — no pasa nada, no hace falta plan B\n return;\n }\n }\n const numero = telefono ? soloDigitos(telefono) : \"\";\n const url = numero\n ? `https://wa.me/52${numero}?text=${encodeURIComponent(texto)}`\n : `https://wa.me/?text=${encodeURIComponent(texto)}`;\n window.open(url, \"_blank\");\n}\n\nexport function App() {\n const [menu, setMenu] = useState([]);\n const [pedidos, setPedidos] = useState([]);\n const [alertas, setAlertas] = useState([]);\n const [cargando, setCargando] = useState(true);\n const [error, setError] = useState(null);\n\n const [grupoActivo, setGrupoActivo] = useState(null);\n const [pedidoActivoId, setPedidoActivoId] = useState(null);\n\n const [modalNuevoPedido, setModalNuevoPedido] = useState(false);\n const [modalCantidad, setModalCantidad] = useState(null);\n const [modalCobro, setModalCobro] = useState<{ id: string; comanda: string; cuenta: string; total: number; telefono: string } | null>(\n null,\n );\n const [modalEnvio, setModalEnvio] = useState(false);\n const [modalHistorial, setModalHistorial] = useState(false);\n const [modalCorte, setModalCorte] = useState<{ resumen: any; texto: string } | null>(null);\n const [modalImpresora, setModalImpresora] = useState(false);\n const [impresora, setImpresora] = useState(estadoImpresora());\n const [modalMetodoPago, setModalMetodoPago] = useState(null); // guarda el id del pedido a cobrar\n const [modalPerfil, setModalPerfil] = useState(false);\n const [modalInsumos, setModalInsumos] = useState(false);\n const [modalVentas, setModalVentas] = useState(false);\n const [modalFondoCaja, setModalFondoCaja] = useState(false);\n const [fondoCajaHoy, setFondoCajaHoy] = useState(null);\n const [perfil, setPerfil] = useState(leerPerfilGuardado());\n\n // Al abrir la app, si el navegador ya recuerda un permiso de Bluetooth concedido antes,\n // se reconecta solo (sin volver a pedir emparejar). Y nos suscribimos para que el botón\n // del header refleje conectada/desconectada en cuanto cambie (incluyendo si se apaga la\n // impresora o se va de rango).\n useEffect(() => {\n const cancelar = suscribirseImpresora(() => setImpresora(estadoImpresora()));\n reconectarSiEsPosible().then(() => setImpresora(estadoImpresora()));\n return cancelar;\n }, []);\n\n async function cargarTodo() {\n try {\n const [m, p, a] = await Promise.all([\n api(\"/api/menu\"),\n api(\"/api/pedidos\"),\n api(\"/api/insumos/alertas\"),\n ]);\n setMenu(m.menu);\n setPedidos(p.pedidos);\n setAlertas(a.alertas);\n // Forma funcional: NO leer \"grupoActivo\" del cierre (closure) de esta función.\n // cargarTodo() se crea una sola vez (useEffect con deps []) y el intervalo de 8s\n // sigue llamando a esa misma copia vieja para siempre — su \"grupoActivo\" capturado\n // se quedó congelado en null desde el primer render. Por eso cada 8s se volvía a\n // \"Maki\": la condición \"!grupoActivo\" de afuera SIEMPRE era true. Usando la forma\n // funcional de setGrupoActivo, React nos da el valor actual de verdad, no el viejo.\n if (m.menu.length > 0) setGrupoActivo((actual) => actual || m.menu[0].nombre);\n setError(null);\n } catch (e: any) {\n setError(e.message);\n } finally {\n setCargando(false);\n }\n }\n\n useEffect(() => {\n cargarTodo();\n const t = setInterval(cargarTodo, 8000);\n return () => clearInterval(t);\n }, []);\n\n // Al abrir la app, revisa si ya se capturó el fondo de caja de HOY. Si no, abre el modal solo\n // (una vez) para pedirlo — así queda registrado desde temprano, sin depender de acordarse de\n // apretar el botón. Si el usuario lo cierra sin llenarlo, siempre puede volver a abrirlo con\n // el botón \"💰 Fondo de caja\" del menú de arriba.\n useEffect(() => {\n api(\"/api/caja/fondo\")\n .then((r) => {\n setFondoCajaHoy(r.monto);\n if (r.monto === null) setModalFondoCaja(true);\n })\n .catch(() => {\n // si falla la consulta no truena la app — el usuario igual puede abrir el modal a mano\n });\n }, []);\n\n const pedidoActivo = useMemo(() => pedidos.find((p) => p.id === pedidoActivoId) || null, [pedidos, pedidoActivoId]);\n const grupo = useMemo(() => menu.find((g) => g.nombre === grupoActivo) || null, [menu, grupoActivo]);\n\n async function crearPedido(tipo: string, identificador: string) {\n const r = await api(\"/api/pedidos\", { method: \"POST\", body: JSON.stringify({ tipo, identificador }) });\n setModalNuevoPedido(false);\n await cargarTodo();\n setPedidoActivoId(r.id);\n }\n\n async function agregarAlPedido(item: MenuItem, cantidad: number) {\n if (!pedidoActivoId) return;\n const r = await api(`/api/pedidos/${pedidoActivoId}/items`, {\n method: \"POST\",\n body: JSON.stringify({ categoria: item.categoriaOriginal, producto: item.producto, cantidad }),\n });\n setPedidos(r.pedidos);\n setModalCantidad(null);\n }\n\n async function quitarItem(rowId: string) {\n const r = await api(`/api/pedidos/items/${rowId}`, { method: \"DELETE\" });\n setPedidos(r.pedidos);\n }\n\n async function cancelarPedido(id: string) {\n if (!confirm(\"¿Cancelar este pedido? Se perderán los productos agregados.\")) return;\n const r = await api(`/api/pedidos/${id}`, { method: \"DELETE\" });\n setPedidos(r.pedidos);\n if (pedidoActivoId === id) setPedidoActivoId(null);\n }\n\n // Imprime la comanda del pedido activo TAL COMO ESTÁ AHORITA, sin cobrar ni cerrar el\n // pedido — para que cocina pueda empezar a preparar mientras el pedido sigue abierto y\n // se le pueden seguir agregando productos después.\n function imprimirComandaActiva() {\n if (!pedidoActivo) return;\n const ahora = new Date();\n const fecha = ahora.toLocaleDateString(\"es-MX\");\n const hora = ahora.toLocaleTimeString(\"es-MX\", { hour: \"2-digit\", minute: \"2-digit\" });\n const encabezado = pedidoActivo.tipo\n ? `${pedidoActivo.tipo}${pedidoActivo.identificador ? \": \" + pedidoActivo.identificador : \"\"}\\n`\n : \"\";\n const comanda = `COMANDA — Pedido #${pedidoActivo.id}\\n${encabezado}${fecha} ${hora}\\n------------------------\\n` +\n pedidoActivo.items.map((it) => `${it.cantidad}x ${it.producto}`).join(\"\\n\\n\");\n imprimir(comanda, \"Comanda\", { fontSize: 22, bold: true, alturaDoble: true });\n }\n\n async function confirmarEnvio(monto: number) {\n if (!pedidoActivoId) return;\n const r = await api(`/api/pedidos/${pedidoActivoId}/envio`, {\n method: \"POST\",\n body: JSON.stringify({ monto }),\n });\n setPedidos(r.pedidos);\n setModalEnvio(false);\n }\n\n async function abrirCorte() {\n if (!confirm(\"¿Generar el corte de caja de hoy? Se sumarán todos los pedidos cobrados del día.\")) return;\n try {\n const r = await api(\"/api/corte\");\n setModalCorte({ resumen: r.resumen, texto: r.texto });\n } catch (e: any) {\n alert(e.message);\n }\n }\n\n // El teléfono (para el botón de WhatsApp) se guarda ANTES de cobrar, porque en cuanto se cobra\n // el pedido se borra de \"activos\" — después de este punto ya no lo podemos volver a leer de ahí.\n async function cobrarPedido(id: string, metodoPago: string) {\n const pedido = pedidos.find((p) => p.id === id);\n const telefono = pedido?.tipo === \"Domicilio\" ? pedido.identificador : \"\";\n const r = await api(`/api/pedidos/${id}/cobrar`, {\n method: \"POST\",\n body: JSON.stringify({ metodoPago, atendioQuien: perfil }),\n });\n setModalCobro({ id, comanda: r.comanda, cuenta: r.cuenta, total: r.total, telefono });\n setModalMetodoPago(null);\n if (pedidoActivoId === id) setPedidoActivoId(null);\n await cargarTodo();\n }\n\n if (cargando) {\n return

Cargando Suchi House…

;\n }\n\n return (\n

\n $\"Suchi$ \n \n Pedidos\n \n

\n setModalPerfil(true)}\n >\n 👤 {perfil || \"Elegir quién atiende\"}\n \n setModalInsumos(true)}\n >\n 📦 Insumos\n \n setModalVentas(true)}\n >\n 📈 Ventas\n \n setModalFondoCaja(true)}\n >\n 💰 Fondo de caja{fondoCajaHoy != null ? \" (\" + \"$\" + fondoCajaHoy.toFixed(0) + \")\" : \"\"}\n \n \n 👨‍🍳 Cocina\n \n setModalImpresora(true)}\n >\n 🖨️ Impresora\n \n \n setModalHistorial(true)}\n >\n 🧾 Tickets\n \n \n 📊 Corte\n \n setModalNuevoPedido(true)}\n >\n + Nuevo pedido\n \n

\n\n {error &&

{error}

}\n\n {alertas.length > 0 && (\n

\n ⚠️ Insumos bajos: {alertas.map((a) => a.insumo).join(\", \")}\n

\n )}\n\n

\n {/* Pedidos abiertos */}\n \n\n {/* Menú */}\n

Menú

\n {menu.map((g) => (\n setGrupoActivo(g.nombre)}\n class={`px-4 py-2 rounded-full font-semibold whitespace-nowrap transition-colors ${\n grupoActivo === g.nombre\n ? \"bg-amber-500 text-[#0d1f1e] shadow-sm\"\n : \"bg-[#1a3d38] text-[#bcd6cf] hover:bg-[#234f48]\"\n }`}\n >\n {g.nombre}\n \n ))}\n

\n\n {!pedidoActivoId && (\n

\n Selecciona o crea un pedido a la izquierda antes de agregar productos.\n

\n )}\n\n

\n {grupo?.items.map((item, i) => (\n setModalCantidad(item)}\n class=\"bg-[#1a3d38] disabled:opacity-40 hover:bg-[#234f48] active:scale-[0.97] border border-[#2c5f56] rounded-xl p-3 text-left transition\"\n >\n

{item.producto}

${item.precio.toFixed(2)}

\n \n ))}\n

\n\n {/* Carrito del pedido activo */}\n

Pedido actual

\n {!pedidoActivo &&

Sin pedido seleccionado.

}\n {pedidoActivo && (\n

\n \n {pedidoActivo.tipo} {pedidoActivo.identificador}\n

\n {pedidoActivo.items.length === 0 &&

Sin productos todavía.

}\n {pedidoActivo.items.map((it) => (\n

\n {it.cantidad}x {it.producto}\n

${it.precioUnitario.toFixed(2)} c/u

${it.subtotal.toFixed(2)}

\n \n

\n ))}\n

\n {pedidoActivo.tipo === \"Domicilio\" && (\n

\n Envío\n \n {pedidoActivo.envio ? \"$\" + pedidoActivo.envio.toFixed(2) : \"Falta agregar\"}\n \n

\n )}\n

\n Total\n ${pedidoActivo.total.toFixed(2)}\n

\n {pedidoActivo.tipo === \"Domicilio\" && (\n setModalEnvio(true)}\n class={`w-full mb-2 py-2 rounded-lg font-semibold transition ${\n pedidoActivo.envio ? \"bg-[#234f48] hover:bg-[#2c5f56]\" : \"bg-amber-500 hover:bg-amber-400 text-[#0d1f1e]\"\n }`}\n >\n 🚚 {pedidoActivo.envio ? \"Cambiar envío\" : \"Agregar envío\"}\n \n )}\n

\n cancelarPedido(pedidoActivo.id)}\n class=\"flex-1 bg-[#234f48] hover:bg-[#2c5f56] py-2 rounded-lg font-semibold\"\n >\n Cancelar\n \n setModalMetodoPago(pedidoActivo.id)}\n class=\"flex-1 bg-green-600 hover:bg-green-500 active:scale-95 disabled:opacity-40 disabled:active:scale-100 py-2 rounded-lg font-semibold transition\"\n >\n Cobrar\n \n

\n \n 🖨️ Imprimir comanda\n \n

\n )}\n

\n\n {modalNuevoPedido && setModalNuevoPedido(false)} onCrear={crearPedido} />}\n {modalCantidad && (\n setModalCantidad(null)} onConfirmar={agregarAlPedido} />\n )}\n {modalCobro && setModalCobro(null)} />}\n {modalMetodoPago && (\n setModalMetodoPago(null)}\n onElegir={(metodo) => cobrarPedido(modalMetodoPago, metodo)}\n />\n )}\n {modalPerfil && (\n setModalPerfil(false)}\n onElegir={(nombre) => {\n setPerfil(nombre);\n guardarPerfil(nombre);\n setModalPerfil(false);\n }}\n />\n )}\n {modalInsumos && setModalInsumos(false)} />}\n {modalEnvio && pedidoActivo && (\n setModalEnvio(false)}\n onConfirmar={confirmarEnvio}\n />\n )}\n {modalHistorial && setModalHistorial(false)} />}\n {modalVentas && setModalVentas(false)} />}\n {modalFondoCaja && (\n setModalFondoCaja(false)}\n onGuardado={(monto) => {\n setFondoCajaHoy(monto);\n setModalFondoCaja(false);\n }}\n />\n )}\n {modalCorte && setModalCorte(null)} />}\n {modalImpresora && (\n setModalImpresora(false)}\n onCambio={() => setImpresora(estadoImpresora())}\n />\n )}\n

\n );\n}\n\nfunction ModalNuevoPedido({ onCerrar, onCrear }: { onCerrar: () => void; onCrear: (tipo: string, identificador: string) => void }) {\n const [tipo, setTipo] = useState<\"Mesa\" | \"Domicilio\" | \"ParaLlevar\">(\"Mesa\");\n const [mesa, setMesa] = useState(MESAS[0]);\n const [nombre, setNombre] = useState(\"\");\n const [telefono, setTelefono] = useState(\"\");\n\n return (\n

Nuevo pedido

\n\n

\n setTipo(\"Mesa\")}\n class={`py-2 rounded-lg font-semibold text-sm ${tipo === \"Mesa\" ? \"bg-red-600\" : \"bg-[#234f48]\"}`}\n >\n Mesa / Barra\n \n setTipo(\"Domicilio\")}\n class={`py-2 rounded-lg font-semibold text-sm ${tipo === \"Domicilio\" ? \"bg-red-600\" : \"bg-[#234f48]\"}`}\n >\n Domicilio\n \n setTipo(\"ParaLlevar\")}\n class={`py-2 rounded-lg font-semibold text-sm ${tipo === \"ParaLlevar\" ? \"bg-red-600\" : \"bg-[#234f48]\"}`}\n >\n Para llevar\n \n

\n\n {tipo === \"Mesa\" && (\n

\n {MESAS.map((m) => (\n setMesa(m)}\n class={`py-2 rounded-lg font-semibold ${mesa === m ? \"bg-red-600\" : \"bg-[#234f48]\"}`}\n >\n {m}\n \n ))}\n

\n )}\n\n {tipo === \"Domicilio\" && (\n

\n setNombre(e.target.value)}\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e]\"\n />\n setTelefono(e.target.value)}\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e]\"\n />\n

\n )}\n\n {tipo === \"ParaLlevar\" && (\n

Para clientes que piden directo en el mostrador, sin mesa.

\n setNombre(e.target.value)}\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e]\"\n />\n

\n )}\n\n

\n \n {\n if (tipo === \"Mesa\") {\n const [t, num] = mesa.split(\" \");\n onCrear(t, num);\n } else if (tipo === \"Domicilio\") {\n if (!nombre.trim()) return alert(\"Escribe el nombre del cliente\");\n onCrear(\"Domicilio\", `${nombre.trim()}${telefono.trim() ? \" — \" + telefono.trim() : \"\"}`);\n } else {\n onCrear(\"Para llevar\", nombre.trim());\n }\n }}\n class=\"flex-1 bg-green-600 py-2 rounded-lg font-semibold\"\n >\n Crear\n \n

\n );\n}\n\nfunction ModalCantidad(\n { item, onCerrar, onConfirmar }: { item: MenuItem; onCerrar: () => void; onConfirmar: (item: MenuItem, cantidad: number) => void },\n) {\n const [cantidad, setCantidad] = useState(1);\n return (\n

{item.producto}

${item.precio.toFixed(2)} c/u

\n\n

\n setCantidad((c) => Math.max(1, c - 1))}\n class=\"w-12 h-12 bg-[#234f48] rounded-full text-2xl font-bold\"\n >\n −\n \n

{cantidad}

\n \n

\n\n

Subtotal: ${(item.precio * cantidad).toFixed(2)}

\n\n

\n \n \n

\n );\n}\n\nfunction ModalCobro(\n { data, onCerrar }: { data: { id: string; comanda: string; cuenta: string; total: number; telefono: string }; onCerrar: () => void },\n) {\n return (\n

✅ Pedido cobrado

\n \n

${data.total.toFixed(2)}

\n\n

\n \n compartirTicket(data.cuenta, data.telefono)}\n class=\"bg-green-700 hover:bg-green-600 py-3 rounded-lg font-semibold\"\n >\n 📲 WhatsApp\n \n

\n\n

{data.cuenta}

\n\n \n

\n );\n}\n\n// Se abre al darle \"Cobrar\" — pide elegir el método de pago ANTES de registrar la venta, para\n// que el corte de caja pueda desglosar cuánto entró en efectivo vs. tarjeta/transferencia.\nfunction ModalMetodoPago({ onCerrar, onElegir }: { onCerrar: () => void; onElegir: (metodo: string) => void }) {\n const [enviando, setEnviando] = useState(null);\n\n async function elegir(metodo: string) {\n setEnviando(metodo);\n try {\n await onElegir(metodo);\n } finally {\n setEnviando(null);\n }\n }\n\n return (\n

💳 ¿Cómo pagó?

Elige el método de pago para registrar la venta.

\n\n

\n {METODOS_PAGO.map((m) => (\n elegir(m)}\n class=\"w-full bg-[#234f48] hover:bg-[#2c5f56] disabled:opacity-50 py-3 rounded-lg font-semibold text-left px-4\"\n >\n {enviando === m ? \"Cobrando...\" : m}\n \n ))}\n

\n\n \n

\n );\n}\n\n// Selector de \"quién está atendiendo\" — se guarda en este dispositivo (ver leerPerfilGuardado /\n// guardarPerfil) y se manda al cobrar cada pedido, para que quede en el ticket y (más adelante)\n// se pueda desglosar el corte de caja por persona.\nfunction ModalPerfil({ actual, onCerrar, onElegir }: { actual: string; onCerrar: () => void; onElegir: (nombre: string) => void }) {\n const [personalizado, setPersonalizado] = useState(\"\");\n\n return (\n

👤 ¿Quién está atendiendo?

Se queda guardado en este celular/computadora hasta que lo cambies.

\n\n

\n {PERFILES_SUGERIDOS.map((nombre) => (\n onElegir(nombre)}\n class={`py-3 rounded-lg font-semibold ${actual === nombre ? \"bg-amber-500 text-[#0d1f1e]\" : \"bg-[#234f48] hover:bg-[#2c5f56]\"}`}\n >\n {nombre}\n \n ))}\n

\n\n

\n setPersonalizado(e.target.value)}\n class=\"flex-1 bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e]\"\n />\n personalizado.trim() && onElegir(personalizado.trim())}\n class=\"bg-green-600 hover:bg-green-500 px-4 rounded-lg font-semibold\"\n >\n Usar\n \n

\n\n \n

\n );\n}\n\n// Registrar compra de un insumo: suma la cantidad comprada al stock actual en el Sheet, sin\n// tener que editar el Sheet a mano. No lleva historial de compras todavía — solo ajusta el\n// número de \"Cantidad actual\" (y su Estado OK/BAJO) del insumo elegido.\ntype ProductoReporte = { producto: string; cantidadVendida: number; ingresos: number; numPedidos: number };\ntype ReporteProductos = { desde: string; hasta: string; dias: number; porCantidad: ProductoReporte[]; porIngresos: ProductoReporte[] };\n\n// Muestra qué se vendió más (por piezas y por ingresos) en los últimos N días, para saber qué\n// reabastecer primero. Solo lectura — no modifica nada, a diferencia de ModalInsumos.\nfunction ModalVentas({ onCerrar }: { onCerrar: () => void }) {\n const [dias, setDias] = useState(7);\n const [reporte, setReporte] = useState(null);\n const [vista, setVista] = useState<\"cantidad\" | \"ingresos\">(\"cantidad\");\n const [cargando, setCargando] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n setCargando(true);\n setError(null);\n api(`/api/reportes/top-productos?dias=${dias}`)\n .then((r) => setReporte(r.reporte))\n .catch((e) => setError(e.message))\n .finally(() => setCargando(false));\n }, [dias]);\n\n const lista = reporte ? (vista === \"cantidad\" ? reporte.porCantidad : reporte.porIngresos) : [];\n\n return (\n

📈 Productos más vendidos

\n {reporte && (\n

\n Del {reporte.desde} al {reporte.hasta}\n

\n )}\n\n

\n {[7, 15, 30].map((d) => (\n setDias(d)}\n class={`px-3 py-1.5 rounded-lg text-sm font-semibold ${dias === d ? \"bg-amber-500 text-[#0d1f1e]\" : \"bg-[#234f48]\"}`}\n >\n {d} días\n \n ))}\n

\n setVista(\"cantidad\")}\n class={`flex-1 px-3 py-1.5 rounded-lg text-sm font-semibold ${vista === \"cantidad\" ? \"bg-[#356d63]\" : \"bg-[#1a3d38]\"}`}\n >\n Por piezas\n \n setVista(\"ingresos\")}\n class={`flex-1 px-3 py-1.5 rounded-lg text-sm font-semibold ${vista === \"ingresos\" ? \"bg-[#356d63]\" : \"bg-[#1a3d38]\"}`}\n >\n Por ingresos\n \n

\n\n {cargando &&

Cargando...

}\n {error &&

{error}

}\n\n {!cargando && !error && lista.length === 0 && (\n

No hay ventas registradas en este periodo.

\n )}\n\n {!cargando && lista.length > 0 && (\n

\n {lista.map((p, i) => (\n

\n {i + 1}.\n {p.producto}\n

\n {vista === \"cantidad\" ? `${p.cantidadVendida} pz` : \"$\" + p.ingresos.toFixed(0)}\n

\n {vista === \"cantidad\" ? \"$\" + p.ingresos.toFixed(0) : `${p.cantidadVendida} pz`}\n

\n ))}\n

\n )}\n\n \n

\n );\n}\n\nfunction ModalInsumos({ onCerrar }: { onCerrar: () => void }) {\n const [insumos, setInsumos] = useState<{ insumo: string; unidad: string; actual: number }[]>([]);\n const [cargando, setCargando] = useState(true);\n const [insumoElegido, setInsumoElegido] = useState(\"\");\n const [cantidad, setCantidad] = useState(\"\");\n const [guardando, setGuardando] = useState(false);\n const [mensaje, setMensaje] = useState(null);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n (async () => {\n try {\n const r = await api(\"/api/insumos/lista\");\n const lista = r.insumos as { insumo: string; unidad: string; actual: number }[];\n setInsumos(lista);\n if (lista.length > 0) setInsumoElegido(lista[0].insumo);\n } catch (e: any) {\n setError(e.message);\n } finally {\n setCargando(false);\n }\n })();\n }, []);\n\n async function registrar() {\n const n = parseFloat(cantidad);\n if (!insumoElegido) return setError(\"Elige un insumo\");\n if (isNaN(n) || n <= 0) return setError(\"Escribe una cantidad válida\");\n setError(null);\n setMensaje(null);\n setGuardando(true);\n try {\n const r = await api(\"/api/insumos/compra\", { method: \"POST\", body: JSON.stringify({ insumo: insumoElegido, cantidad: n }) });\n setMensaje(`Listo — ${insumoElegido} ahora tiene ${r.nuevoActual} disponibles.`);\n setCantidad(\"\");\n setInsumos((prev) => prev.map((i) => (i.insumo === insumoElegido ? { ...i, actual: r.nuevoActual } : i)));\n } catch (e: any) {\n setError(e.message);\n } finally {\n setGuardando(false);\n }\n }\n\n const actual = insumos.find((i) => i.insumo === insumoElegido);\n\n return (\n

📦 Registrar compra de insumo

Suma lo que acabas de comprar al stock actual.

\n\n {cargando &&

Cargando insumos...

}\n\n {!cargando && (\n <>\n setInsumoElegido(e.target.value)}\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none mb-2\"\n >\n {insumos.map((i) => )}\n \n {actual &&

Actualmente hay {actual.actual} {actual.unidad}.

}\n\n setCantidad(e.target.value)}\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e] mb-4\"\n />\n \n )}\n\n {mensaje &&

{mensaje}

}\n {error &&

{error}

}\n\n

\n \n \n {guardando ? \"Guardando...\" : \"Registrar\"}\n \n

\n );\n}\n\n// Conexión de la impresora térmica Bluetooth (ESC/POS directo, ver frontend/lib/impresora.ts).\n// Una vez conectada, todos los botones de imprimir de la app (comanda, ticket, reimpresiones,\n// corte) la usan automáticamente en vez de abrir la ventana de impresión del navegador.\nfunction ModalImpresora(\n { impresora, onCerrar, onCambio }: {\n impresora: { conectada: boolean; nombre: string | null };\n onCerrar: () => void;\n onCambio: () => void;\n },\n) {\n const [conectando, setConectando] = useState(false);\n const [error, setError] = useState(null);\n\n async function conectar() {\n setError(null);\n setConectando(true);\n try {\n await conectarImpresora();\n onCambio();\n } catch (e: any) {\n setError(e.message);\n } finally {\n setConectando(false);\n }\n }\n\n function desconectar() {\n desconectarImpresora();\n onCambio();\n }\n\n return (\n

🖨️ Impresora Bluetooth

\n\n

\n \n \n {impresora.conectada ? `Conectada: ${impresora.nombre || \"impresora\"}` : \"No conectada\"}\n \n

\n\n {!impresora.conectada && (\n

\n Enciende la impresora y activa su Bluetooth, luego dale \"Conectar\" y elígela de la lista. Solo se\n hace una vez — la próxima vez que abras la app se reconecta sola. (Funciona en Chrome, Android y\n computadora. No funciona en iPhone/Safari — ahí hay que usarla por USB.)\n

\n )}\n\n {error &&

{error}

}\n\n {!bluetoothDisponible() && (\n

\n Este navegador no soporta Bluetooth. Ábrela en Chrome (Android o computadora).\n

\n )}\n\n

\n \n {impresora.conectada\n ? (\n \n )\n : (\n \n {conectando ? \"Buscando...\" : \"Conectar\"}\n \n )}\n

\n );\n}\n\nfunction ModalEnvio(\n { envioActual, onCerrar, onConfirmar }: {\n envioActual: number | null;\n onCerrar: () => void;\n onConfirmar: (monto: number) => void;\n },\n) {\n const [personalizado, setPersonalizado] = useState(\"\");\n\n return (\n

🚚 Costo de envío

Este pedido es a domicilio. Elige el costo de envío antes de cobrar.

\n\n

\n {OPCIONES_ENVIO.map((monto) => (\n onConfirmar(monto)}\n class={`py-3 rounded-lg font-bold transition ${\n envioActual === monto ? \"bg-amber-500 text-[#0d1f1e]\" : \"bg-[#234f48] hover:bg-[#2c5f56]\"\n }`}\n >\n ${monto}\n \n ))}\n

\n\n

Otra cantidad (distancia larga)

\n setPersonalizado(e.target.value)}\n class=\"flex-1 bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e]\"\n />\n {\n const monto = parseFloat(personalizado);\n if (isNaN(monto) || monto < 0) return alert(\"Escribe un monto válido\");\n onConfirmar(monto);\n }}\n class=\"bg-green-600 hover:bg-green-500 px-4 rounded-lg font-semibold\"\n >\n Usar\n \n

\n\n \n

\n );\n}\n\n// Historial de pedidos ya cobrados, con buscador y opción de reimprimir el ticket de cualquiera\n// (por ID o nombre) — más un botón directo para reimprimir el último, por si se atoró el papel.\nfunction ModalHistorial({ onCerrar }: { onCerrar: () => void }) {\n const [busqueda, setBusqueda] = useState(\"\");\n const [lista, setLista] = useState([]);\n const [cargando, setCargando] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n (async () => {\n try {\n const r = await api(\"/api/pedidos/historial?limit=100\");\n setLista(r.pedidos);\n } catch (e: any) {\n setError(e.message);\n } finally {\n setCargando(false);\n }\n })();\n }, []);\n\n async function reimprimir(idPedido: string) {\n try {\n const r = await api(`/api/pedidos/${idPedido}/ticket`);\n imprimir(r.cuenta, `Ticket #${idPedido}`, { logo: true });\n } catch (e: any) {\n alert(e.message);\n }\n }\n\n async function reimprimirUltimo() {\n try {\n const r = await api(\"/api/pedidos/ultimo/ticket\");\n imprimir(r.cuenta, `Ticket #${r.idPedido}`, { logo: true });\n } catch (e: any) {\n alert(e.message);\n }\n }\n\n const q = busqueda.trim().toLowerCase();\n const filtrada = q ? lista.filter((p) => p.idPedido.toLowerCase().includes(q) || String(p.cliente || \"\").toLowerCase().includes(q)) : lista;\n\n return (\n

🧾 Historial de tickets

\n\n \n\n setBusqueda(e.target.value)}\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e] mb-3\"\n />\n\n

\n {cargando &&

Cargando...

}\n {error &&

{error}

}\n {!cargando && !error && filtrada.length === 0 &&

Sin resultados.

}\n {filtrada.map((p) => (\n

\n \n {p.canal}{p.cliente ? \" — \" + p.cliente : \"\"}\n

{p.fecha} {p.hora} · ${p.total.toFixed(2)}

\n \n

\n ))}\n

\n\n \n

\n );\n}\n\n// Corte de caja: suma todo lo cobrado hoy, desglosado por tipo de pedido, para que no haya que\n// sumar nada a mano al cerrar caja. Se abre solo tras confirmar (ver abrirCorte en App()).\n// Fondo de caja: el efectivo con el que se arranca el día (o que ya hay físicamente en la\n// caja). Se le pregunta al usuario solo (ver el useEffect en App()) si todavía no se ha\n// capturado hoy, y también se puede abrir/editar en cualquier momento con el botón del header.\nfunction ModalFondoCaja(\n { valorActual, onCerrar, onGuardado }: { valorActual: number | null; onCerrar: () => void; onGuardado: (monto: number) => void },\n) {\n const [monto, setMonto] = useState(valorActual != null ? String(valorActual) : \"\");\n const [guardando, setGuardando] = useState(false);\n const [error, setError] = useState(null);\n\n async function guardar() {\n const n = Number(monto);\n if (!isFinite(n) || n < 0) {\n setError(\"Escribe un monto válido.\");\n return;\n }\n setGuardando(true);\n setError(null);\n try {\n await api(\"/api/caja/fondo\", { method: \"POST\", body: JSON.stringify({ monto: n }) });\n onGuardado(n);\n } catch (e: any) {\n setError(e.message);\n } finally {\n setGuardando(false);\n }\n }\n\n return (\n

💰 Fondo de caja de hoy

\n ¿Con cuánto efectivo se arrancó la caja hoy? Con esto, el corte de caja te va a poder decir cuánto efectivo debería haber al cerrar.\n

\n setMonto(e.target.value)}\n placeholder=\"0.00\"\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 mb-3 text-lg\"\n />\n {error &&

{error}

}\n

\n \n \n {guardando ? \"Guardando...\" : \"Guardar\"}\n \n

\n );\n}\n\nfunction ModalCorte({ data, onCerrar }: { data: { resumen: any; texto: string }; onCerrar: () => void }) {\n const r = data.resumen;\n return (\n

📊 Corte de caja

{r.fecha} · {r.numPedidos} pedidos cobrados

\n\n

\n {r.porCanal.length === 0 &&

Todavía no hay pedidos cobrados hoy.

}\n {r.porCanal.map((c: any) => (\n

\n {c.canal} ({c.numPedidos})\n ${c.total.toFixed(2)}\n

\n ))}\n

\n\n {r.totalEnvios > 0 && (\n

Incluye ${r.totalEnvios.toFixed(2)} de envíos a domicilio.

\n )}\n\n {r.porMetodoPago && r.porMetodoPago.length > 0 && (\n

Por método de pago

\n {r.porMetodoPago.map((m: any) => (\n

\n {m.metodo} ({m.numPedidos})\n ${m.total.toFixed(2)}\n

\n ))}\n

\n )}\n\n

\n Total en caja\n ${r.totalVentas.toFixed(2)}\n

\n\n {r.fondoInicial != null ? (\n

\n Fondo inicial\n ${r.fondoInicial.toFixed(2)}\n

\n Efectivo esperado en caja\n ${r.efectivoEnCaja.toFixed(2)}\n

\n ) : (\n

\n No has capturado el fondo de caja de hoy — usa \"💰 Fondo de caja\" en el menú de arriba para poder ver cuánto efectivo debería haber.\n

\n )}\n\n

\n \n

\n\n \n

\n );\n}\n","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useMemo, useState } from \"https://esm.sh/react@18.2.0\";\nimport {\n bluetoothDisponible,\n conectarImpresora,\n desconectarImpresora,\n estadoImpresora,\n imprimirBluetooth,\n imprimirLogoBluetooth,\n reconectarSiEsPosible,\n suscribirseImpresora,\n} from \"../lib/impresora.ts\";\n\ntype MenuItem = { categoriaOriginal: string; variante: string; producto: string; precio: number; notas: string };\ntype MenuGrupo = { nombre: string; items: MenuItem[] };\ntype PedidoItem = { rowId: string; categoria: string; producto: string; cantidad: number; precioUnitario: number; subtotal: number };\ntype Pedido = { id: string; tipo: string; identificador: string; envio: number | null; items: PedidoItem[]; total: number };\n\nconst OPCIONES_ENVIO = [5, 10, 15, 20, 25, 30];\ntype Alerta = { insumo: string; actual: number; minima: number; unidad: string };\n\nconst MESAS = [\"Mesa 1\", \"Mesa 2\", \"Barra 1\", \"Barra 2\"];\nconst METODOS_PAGO = [\"Efectivo\", \"Tarjeta\", \"Transferencia\"];\nconst PERFILES_SUGERIDOS = [\"Noel\", \"Gustavo\", \"Nasa\", \"Sari\", \"Salma\", \"Renata\", \"Padilla\"];\n\n// El perfil de \"quién está atendiendo\" se guarda en este dispositivo/navegador (no en el\n// servidor) — cada celular/computadora recuerda el suyo, así no hay que elegirlo en cada venta.\nconst LLAVE_PERFIL = \"suchi_perfil\";\nfunction leerPerfilGuardado(): string {\n try {\n return localStorage.getItem(LLAVE_PERFIL) || \"\";\n } catch {\n return \"\";\n }\n}\nfunction guardarPerfil(nombre: string) {\n try {\n localStorage.setItem(LLAVE_PERFIL, nombre);\n } catch {\n // si el navegador bloquea localStorage no pasa nada grave, solo no se recuerda\n }\n}\n\nasync function api(path: string, opts: RequestInit = {}) {\n const res = await fetch(path, {\n ...opts,\n headers: { \"Content-Type\": \"application/json\", ...(opts.headers || {}) },\n });\n const data = await res.json();\n if (!data.ok) throw new Error(data.error || \"Error desconocido\");\n return data;\n}\n\n// Insignia grande y bien contrastada para el ID de pedido — se usa en la lista de\n// pedidos abiertos, en el carrito y en el modal de cobro para que nunca pase desapercibido.\nfunction BadgeId({ id, size = \"md\" }: { id: string; size?: \"sm\" | \"md\" | \"lg\" }) {\n const tam = size === \"lg\" ? \"text-2xl px-3 py-1\" : size === \"md\" ? \"text-base px-2.5 py-1\" : \"text-sm px-2 py-0.5\";\n return #{id};\n}\n\n// Abre una ventana de impresión con el formato de ticket térmico de 80mm. Se usa tanto para\n// imprimir la comanda EN CUALQUIER MOMENTO mientras el pedido sigue abierto (sin necesidad de\n// cobrar) como para reimprimir comanda/cuenta desde el modal de cobro.\n// La comanda (para cocina) se imprime más grande y en negritas que el ticket (para el cliente),\n// para que se pueda leer de un vistazo rápido mientras se está preparando el pedido.\nfunction imprimirTexto(texto: string, titulo: string, opts: { fontSize?: number; bold?: boolean; logo?: boolean } = {}) {\n const { fontSize = 13, bold = false, logo = false } = opts;\n const w = window.open(\"\", \"_blank\", \"width=380,height=600\");\n if (!w) return;\n // Cuando es un ticket para el cliente (logo:true), arriba de todo el texto se imprime el logo\n // real (la imagen, no un dibujo hecho con caracteres), del tamaño de un logo — no del ancho\n // completo del papel. El nombre \"SUCHI HOUSE\" espaciado ya va incluido como texto al final del\n // ticket (ver formatearTicket en backend/ticket.ts), así que aquí no hace falta repetirlo.\n const encabezadoLogo = logo\n ? `

Cargando Suchi House…

;\n }\n\n return (\n

\n $\"Suchi$ \n \n Pedidos\n \n

\n\n {error &&

{error}

}\n\n {alertas.length > 0 && (\n

\n ⚠️ Insumos bajos: {alertas.map((a) => a.insumo).join(\", \")}\n

\n )}\n\n

\n {/* Pedidos abiertos */}\n \n\n {/* Menú */}\n

Menú

\n\n {!pedidoActivoId && (\n

\n Selecciona o crea un pedido a la izquierda antes de agregar productos.\n

\n )}\n\n

{item.producto}

${item.precio.toFixed(2)}

\n \n ))}\n

\n\n {/* Carrito del pedido activo */}\n

Pedido actual

\n {!pedidoActivo &&

Sin pedido seleccionado.

}\n {pedidoActivo && (\n

\n \n {pedidoActivo.tipo} {pedidoActivo.identificador}\n

\n {pedidoActivo.items.length === 0 &&

Sin productos todavía.

}\n {pedidoActivo.items.map((it) => (\n

\n {it.cantidad}x {it.producto}\n

${it.precioUnitario.toFixed(2)} c/u

${it.subtotal.toFixed(2)}

\n \n

\n ))}\n

\n {pedidoActivo.tipo === \"Domicilio\" && (\n

\n Envío\n \n {pedidoActivo.envio ? \"$\" + pedidoActivo.envio.toFixed(2) : \"Falta agregar\"}\n \n

\n )}\n

\n Total\n ${pedidoActivo.total.toFixed(2)}\n

\n \n 🖨️ Imprimir comanda\n \n

\n )}\n

Nuevo pedido

\n\n

\n\n {tipo === \"Mesa\" && (\n

\n {MESAS.map((m) => (\n setMesa(m)}\n class={`py-2 rounded-lg font-semibold ${mesa === m ? \"bg-red-600\" : \"bg-[#234f48]\"}`}\n >\n {m}\n \n ))}\n

\n )}\n\n {tipo === \"Domicilio\" && (\n

\n )}\n\n {tipo === \"ParaLlevar\" && (\n

Para clientes que piden directo en el mostrador, sin mesa.

\n setNombre(e.target.value)}\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e]\"\n />\n

\n )}\n\n

{item.producto}

${item.precio.toFixed(2)} c/u

\n\n

\n setCantidad((c) => Math.max(1, c - 1))}\n class=\"w-12 h-12 bg-[#234f48] rounded-full text-2xl font-bold\"\n >\n −\n \n

{cantidad}

\n \n

\n\n

Subtotal: ${(item.precio * cantidad).toFixed(2)}

\n\n

\n \n \n

\n );\n}\n\nfunction ModalCobro(\n { data, onCerrar }: { data: { id: string; comanda: string; cuenta: string; total: number; telefono: string }; onCerrar: () => void },\n) {\n return (\n

✅ Pedido cobrado

\n \n

${data.total.toFixed(2)}

\n\n

\n \n compartirTicket(data.cuenta, data.telefono)}\n class=\"bg-green-700 hover:bg-green-600 py-3 rounded-lg font-semibold\"\n >\n 📲 WhatsApp\n \n

\n\n

{data.cuenta}

\n\n \n

💳 ¿Cómo pagó?

Elige el método de pago para registrar la venta.

\n\n

\n\n \n

👤 ¿Quién está atendiendo?

Se queda guardado en este celular/computadora hasta que lo cambies.

\n\n

\n\n \n

📈 Productos más vendidos

\n {reporte && (\n

\n Del {reporte.desde} al {reporte.hasta}\n

\n )}\n\n

\n {[7, 15, 30].map((d) => (\n setDias(d)}\n class={`px-3 py-1.5 rounded-lg text-sm font-semibold ${dias === d ? \"bg-amber-500 text-[#0d1f1e]\" : \"bg-[#234f48]\"}`}\n >\n {d} días\n \n ))}\n

\n\n {cargando &&

Cargando...

}\n {error &&

{error}

}\n\n {!cargando && !error && lista.length === 0 && (\n

No hay ventas registradas en este periodo.

\n )}\n\n {!cargando && lista.length > 0 && (\n

\n {lista.map((p, i) => (\n

\n {i + 1}.\n {p.producto}\n

\n {vista === \"cantidad\" ? `${p.cantidadVendida} pz` : \"$\" + p.ingresos.toFixed(0)}\n

\n {vista === \"cantidad\" ? \"$\" + p.ingresos.toFixed(0) : `${p.cantidadVendida} pz`}\n

\n ))}\n

\n )}\n\n \n

📦 Registrar compra de insumo

Suma lo que acabas de comprar al stock actual.

\n\n {cargando &&

Cargando insumos...

Actualmente hay {actual.actual} {actual.unidad}.

}\n\n setCantidad(e.target.value)}\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e] mb-4\"\n />\n \n )}\n\n {mensaje &&

{mensaje}

}\n {error &&

{error}

}\n\n

\n \n \n {guardando ? \"Guardando...\" : \"Registrar\"}\n \n

🖨️ Impresora Bluetooth

\n\n

\n \n \n {impresora.conectada ? `Conectada: ${impresora.nombre || \"impresora\"}` : \"No conectada\"}\n \n

\n\n {!impresora.conectada && (\n

\n )}\n\n {error &&

{error}

}\n\n {!bluetoothDisponible() && (\n

\n Este navegador no soporta Bluetooth. Ábrela en Chrome (Android o computadora).\n

\n )}\n\n

\n \n {impresora.conectada\n ? (\n \n )\n : (\n \n {conectando ? \"Buscando...\" : \"Conectar\"}\n \n )}\n

🚚 Costo de envío

Este pedido es a domicilio. Elige el costo de envío antes de cobrar.

\n\n

Otra cantidad (distancia larga)

\n\n \n

🧾 Historial de tickets

\n\n \n\n setBusqueda(e.target.value)}\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 outline-none placeholder-[#7fa99e] mb-3\"\n />\n\n

\n {cargando &&

Cargando...

}\n {error &&

{error}

}\n {!cargando && !error && filtrada.length === 0 &&

Sin resultados.

}\n {filtrada.map((p) => (\n

\n \n {p.canal}{p.cliente ? \" — \" + p.cliente : \"\"}\n

{p.fecha} {p.hora} · ${p.total.toFixed(2)}

\n \n

\n ))}\n

\n\n \n

💰 Fondo de caja de hoy

\n ¿Con cuánto efectivo se arrancó la caja hoy? Con esto, el corte de caja te va a poder decir cuánto efectivo debería haber al cerrar.\n

\n setMonto(e.target.value)}\n placeholder=\"0.00\"\n class=\"w-full bg-[#1a3d38] border border-[#356d63] rounded-lg px-3 py-2 mb-3 text-lg\"\n />\n {error &&

{error}

}\n

\n \n \n {guardando ? \"Guardando...\" : \"Guardar\"}\n \n

\n );\n}\n\nfunction ModalCorte({ data, onCerrar }: { data: { resumen: any; texto: string }; onCerrar: () => void }) {\n const r = data.resumen;\n return (\n

📊 Corte de caja

{r.fecha} · {r.numPedidos} pedidos cobrados

\n\n

\n {r.porCanal.length === 0 &&

Todavía no hay pedidos cobrados hoy.

}\n {r.porCanal.map((c: any) => (\n

\n {c.canal} ({c.numPedidos})\n ${c.total.toFixed(2)}\n

\n ))}\n

\n\n {r.totalEnvios > 0 && (\n

Incluye ${r.totalEnvios.toFixed(2)} de envíos a domicilio.

\n )}\n\n {r.porMetodoPago && r.porMetodoPago.length > 0 && (\n

Por método de pago

\n {r.porMetodoPago.map((m: any) => (\n

\n {m.metodo} ({m.numPedidos})\n ${m.total.toFixed(2)}\n

\n ))}\n

\n )}\n\n

\n Total en caja\n ${r.totalVentas.toFixed(2)}\n

\n\n {r.fondoInicial != null ? (\n

\n Fondo inicial\n ${r.fondoInicial.toFixed(2)}\n

\n Efectivo esperado en caja\n ${r.efectivoEnCaja.toFixed(2)}\n

\n ) : (\n

\n No has capturado el fondo de caja de hoy — usa \"💰 Fondo de caja\" en el menú de arriba para poder ver cuánto efectivo debería haber.\n

\n )}\n\n

\n \n

\n\n \n

\n );\n}\n","createdAt",["D",1788481220260],"branchVersion","branchId","8c0e03b9-4364-49a7-9f88-4b3a597ffffc","id","8f3a6802-82b2-4247-8cf7-f627cfe596c3","suchi-house-pedidos",["D",1788198568874],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Sistema de pedidos por botones + inventario para Suchi House","imageUrl","fb83bb5a-9aee-4548-804a-06dc8e5f8bba","pinnedFileId","01a058f0-c40d-736f-b689-e16a000d9213","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","01a058ef-c604-7433-a919-134dbc7b0e08","tursoName","8f3a680282b242478cf7f627cfe596c3","tursoHostname","8f3a680282b242478cf7f627cfe596c3-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789501878689],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_101":100,"_109":105},"org",{"_101":100,"_102":103,"_104":105,"_18":56,"_106":107,"_108":25},"branch",{"_13":90,"_32":91,"_44":43,"_92":45,"_93":-5,"_94":-5,"_95":-5,"_96":-5,"_97":-5,"_98":46,"_99":100},"isOwned",469,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","noelgonzalezsuchi","handle","displayName","Gonzalez Garcia Noel","avatar","https://lh3.googleusercontent.com/a/ACg8ocIrFrculUXpRQjUt_dP3J-Hz7IQ4pouMXM2lew629FNmup_Ecm8=s96-c","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_44":45,"_32":46,"_39":600,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":54,"_55":-5,"_18":56,"_57":58,"_59":60,"_61":-5,"_62":-5,"_63":64,"_65":66,"_67":68,"_69":70,"_71":601,"_73":-5,"_74":75,"_76":75,"_77":78,"_79":78,"_80":78,"_81":75,"_82":75,"_83":602,"_85":603,"_87":604,"_89":25},"tree",[440,446,457,458,459,460,461],"files",[440,441,442,443,444,445,446,447,448,449,450,451,452,453,454,455,456,457,458,459,460,461],"counts",{"_430":64,"_431":402,"_432":64,"_433":434,"_435":436},"contents",[373,374,375,376,377,378,379],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[132,133,134,135,136,137,138,139,140,141,142,143,144,145,146,147,148,149,150,151,152,153,154,155,156,157,158,159,160,161,162,163,164,165,166,167,168,169,170,171,172,173,174,175,176,177,178,179,180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197,198,199,200,201,202,203,204,205,206,207,208,209,210,211,212,213,214,215,216,217,218,219,220,221,222,223,224,225,226,227,228,229,230,231,232,233,234,235,236,237,238,239,240,241,242,243,244,245,246,247,248,249,250,251],"hasHttpFiles","grants","orgs","customDomains",{},{"_44":372,"_253":-5},{"_44":371,"_253":-5},{"_44":370,"_253":-5},{"_44":369,"_253":-5},{"_44":368,"_253":-5},{"_44":367,"_253":-5},{"_44":366,"_253":-5},{"_44":365,"_253":-5},{"_44":364,"_253":-5},{"_44":363,"_253":-5},{"_44":362,"_253":-5},{"_44":361,"_253":-5},{"_44":360,"_253":-5},{"_44":359,"_253":-5},{"_44":358,"_253":-5},{"_44":357,"_253":-5},{"_44":356,"_253":-5},{"_44":355,"_253":-5},{"_44":354,"_253":-5},{"_44":353,"_253":-5},{"_44":352,"_253":-5},{"_44":351,"_253":-5},{"_44":350,"_253":-5},{"_44":349,"_253":-5},{"_44":348,"_253":-5},{"_44":347,"_253":-5},{"_44":346,"_253":-5},{"_44":345,"_253":-5},{"_44":344,"_253":-5},{"_44":343,"_253":-5},{"_44":342,"_253":-5},{"_44":341,"_253":-5},{"_44":340,"_253":-5},{"_44":339,"_253":-5},{"_44":338,"_253":-5},{"_44":337,"_253":-5},{"_44":336,"_253":-5},{"_44":335,"_253":-5},{"_44":334,"_253":-5},{"_44":333,"_253":-5},{"_44":332,"_253":-5},{"_44":331,"_253":-5},{"_44":330,"_253":-5},{"_44":329,"_253":-5},{"_44":328,"_253":-5},{"_44":327,"_253":-5},{"_44":326,"_253":-5},{"_44":325,"_253":-5},{"_44":324,"_253":-5},{"_44":323,"_253":-5},{"_44":322,"_253":-5},{"_44":321,"_253":-5},{"_44":320,"_253":-5},{"_44":319,"_253":-5},{"_44":318,"_253":-5},{"_44":317,"_253":-5},{"_44":316,"_253":-5},{"_44":315,"_253":-5},{"_44":314,"_253":-5},{"_44":313,"_253":-5},{"_44":312,"_253":-5},{"_44":311,"_253":-5},{"_44":310,"_253":-5},{"_44":309,"_253":-5},{"_44":308,"_253":-5},{"_44":307,"_253":-5},{"_44":306,"_253":-5},{"_44":305,"_253":-5},{"_44":304,"_253":-5},{"_44":303,"_253":-5},{"_44":302,"_253":-5},{"_44":301,"_253":-5},{"_44":300,"_253":-5},{"_44":299,"_253":-5},{"_44":298,"_253":-5},{"_44":297,"_253":-5},{"_44":296,"_253":-5},{"_44":295,"_253":-5},{"_44":294,"_253":-5},{"_44":293,"_253":-5},{"_44":292,"_253":-5},{"_44":291,"_253":-5},{"_44":290,"_253":-5},{"_44":289,"_253":-5},{"_44":288,"_253":-5},{"_44":287,"_253":-5},{"_44":286,"_253":-5},{"_44":285,"_253":-5},{"_44":284,"_253":-5},{"_44":283,"_253":-5},{"_44":282,"_253":-5},{"_44":281,"_253":-5},{"_44":280,"_253":-5},{"_44":279,"_253":-5},{"_44":278,"_253":-5},{"_44":277,"_253":-5},{"_44":276,"_253":-5},{"_44":275,"_253":-5},{"_44":274,"_253":-5},{"_44":273,"_253":-5},{"_44":272,"_253":-5},{"_44":271,"_253":-5},{"_44":270,"_253":-5},{"_44":269,"_253":-5},{"_44":268,"_253":-5},{"_44":267,"_253":-5},{"_44":266,"_253":-5},{"_44":265,"_253":-5},{"_44":264,"_253":-5},{"_44":263,"_253":-5},{"_44":262,"_253":-5},{"_44":261,"_253":-5},{"_44":260,"_253":-5},{"_44":259,"_253":-5},{"_44":258,"_253":-5},{"_44":257,"_253":-5},{"_44":256,"_253":-5},{"_44":255,"_253":-5},{"_44":254,"_253":-5},{"_44":252,"_253":-5},"7a1e4986-950a-4e5f-8083-864b53a05f46","reporterId","7347b6e2-7431-49e5-8204-d0b1e9a63c38","ddd77f07-cff0-4eda-82a1-731b2e9a901d","bcd7ad27-afd7-4a82-929e-32b82dc089d0","6408933e-a06a-448f-a9e6-9cb6461b1e7e","a08090b3-b9ad-49ab-b571-bcbd8e0f1d80","efa893e7-eee5-4bb3-a147-058278426055","c8b81440-a3e2-4e11-86ed-fb542dbb05cb","ffa8b1d4-1a34-4b94-9f5d-b13498b25716","5ca8f8b7-ec99-4aee-8fd9-23d140d684db","a2e31a6d-1a7e-4a33-b51a-f234b6941ac3","716e822b-1eb9-4a19-a6d1-4954036b6c58","0ee1f30d-c78d-4fdb-9391-3df7d0ba9b45","8e64949a-339a-4541-b553-ad0b15990ec6","3483a97e-b0c6-4e12-8539-6130a8c1e90f","8248401b-a670-474c-940d-9c3e09427653","4078546d-c9bf-4934-a822-a932a5a30067","e751d08e-6e47-4cc3-bea7-24a9b38ffc8f","4d1489ec-e973-4fc9-bc5c-9b7050fdce1a","bbb5ccec-b09c-4a45-a3c6-2fd6f8a70d74","21563e62-1333-4217-bf5e-4918cd92df90","423b4c86-9e37-430a-9746-4a478653cc33","9d756400-73cf-4b13-9a9a-9bb43b7abe34","8454ea50-1518-44a5-a311-98bb6e3de480","41d082ec-211b-45ad-8de2-3792d85436f5","ca479534-6224-4c82-a9cf-4f82c9688231","b675b90a-5c1e-4d13-a77e-20425a20e274","527cd861-9608-4022-954a-7243c3323b23","928f2688-beb6-4298-8eda-48c3c9790bb0","de6a3943-2c09-4d4b-82da-2881a28f578c","7e53ffcc-bda8-48d3-a3ea-17db42f18c13","234eac3f-84ee-496f-a98f-dc4a30472158","9db39016-e51d-41a4-9617-02c0238c2dde","7925d5ef-1561-4938-919a-515c37a00777","05953647-e283-4609-ab6c-230d9bb0b636","94820812-7c23-41b9-a391-1860d2eb4364","6f7f6edc-c24a-4688-8896-c1eab8f0e7de","7231499b-5e12-4fe6-b7cd-85fdbd5e93e7","46acad21-4801-416b-a616-4013f1c35d38","15bc1384-b318-4191-bc36-15ab5adbc965","3e455f0e-6469-46e3-aac8-ec3869f59194","6f45bfd7-8882-4ea2-9cb6-93df2bd17afb","c2c240e2-a33c-4308-a8b3-40294039f976","0be2461a-7ee4-41e9-9ff7-396730dc22f2","ed4d3963-5cea-49aa-9faf-b35046a616cf","39b211c0-b9ba-456a-a33a-272205eed05b","b4cb08bc-3092-4dc1-8135-f786573365ec","9da9823f-f365-4207-8df7-8ba3b20394f2","4a852160-52bd-4d94-bd49-c44d5f2e3fa1","7892ef76-f9eb-45e1-a382-3dd65659524f","8a5680cc-a2a9-41e9-aac7-d697d3433302","c73d0ad0-cabe-4c0f-81ed-a6eed528e7f2","25b49700-9df3-4327-b71d-608598ab6f4b","8496a95f-f8ae-4dc9-bb26-f4d35010fce8","077b8837-8bb7-4412-b015-74909894fd5a","6e2d134f-93fe-4d99-85b7-b68448bdbb12","1b3a05a9-41a9-4147-a735-e096229df6f7","f0ef885a-23ae-4491-846e-ed60c8b921fc","81e11671-a950-4c8b-b559-040028783876","b4f76924-f266-4586-8eae-354537b0717b","33199bf7-c103-44eb-a4a2-d1b880c53a13","55ba750b-2ad7-4acf-bc28-c077fa14ec05","ce7f30cf-6a57-4f17-8297-b51deebfd3d1","72d2208d-ab12-428a-bd23-c097f8ee25b7","b0449823-4581-4fa5-92ad-2eec4688d0e5","21f284a6-fc61-49e6-a156-98f5e0afd2bf","a03cb57f-1199-442e-8740-9414e70b9186","28909152-0e50-4e94-b02c-a907fdee3f01","6f741908-8104-4c11-a555-f28da9c1538f","7a4e508f-fd8d-47e0-a7e8-0b9ed4278e67","68a07995-0a40-4184-b292-a325851df8cb","067ae9a2-2817-40d0-9bc8-8c55089b3d94","9975cf0f-0726-4520-98dc-6253194d3159","c1bb268c-f880-47ec-a5d6-21611adaa16a","f8d1f425-4a0b-442c-8132-f2b4a51ee3cf","e9218e1a-f5cf-4aec-95cb-03d14a13dc9d","2c64cb14-1821-43ff-a1df-517ea150708b","cfb254e8-102e-4e06-a92c-8311e647b8ab","f2e5bc83-66da-4141-8bbf-064456c4ca71","93266443-6215-4233-b0af-b70552fe6a3b","19e30d43-570d-45f2-b0fe-1a4d155b7b38","53a36473-2263-4e15-86ac-97f05b23e912","794db6d0-a6ef-48b9-b58c-84ec468901b8","5ee5d37f-f10f-40de-ab5a-1a95e494c6bb","4e97b23c-e5df-4b64-a56c-4456b43c1937","3e779f7a-2a4c-486e-b1d2-66869689a57a","c5e6dcec-60eb-4435-8c9f-7ca32f152155","44c5391e-0ad6-4273-8373-127f22fee37c","e4c4bd1b-60cd-4473-b144-46014c595343","82d522bf-7c8c-4d3a-8f2e-37208f2d6270","ac7ca542-65cd-4dbc-b57e-77fc85574d27","f77c3a06-6fe9-4c1d-b9ce-c6f541c37243","08034413-99b3-4b81-9779-7219de9e8725","7abf230d-4f62-4a63-8090-f16ccfda7d75","00af3b9c-67ed-4a86-b9b2-7793322dc825","a7450d76-a295-489a-9bf6-21ea94eb1b3a","6d043740-e6f3-413d-a20c-3042d4727ae7","452ee35f-f7e1-451d-9a36-0389f23c3355","5983df28-46e7-4a77-aee4-ee8aec6812b5","bdf61394-93b9-47e3-8a20-e3b9ad813ffb","7459ca1c-f201-4b02-901b-f2ccac82cec6","ae659c51-4cc1-41e8-9f18-5ae70f2d3cc5","d4a7821c-4ee8-4ab0-869c-2f757cfb1f71","d54b1a72-b377-47d0-8f45-c22d5092098f","7eda3fae-2c67-47a6-ac39-78c6ef0c82b8","2cac639e-071e-4593-b920-876a98793156","58689f14-f71a-4ad6-b91a-46b08a95d8f5","7bf96fe2-9a72-46ae-a930-94bcc58a6dda","07df9b2b-7f2a-4f81-bc81-bd88f669035d","4699cd21-c62e-438c-92ae-975ffb436b61","c1395981-a402-4f66-8c0c-98f63a57f98b","effb1211-c286-481a-be4f-348a917cd015","5858a53f-603b-4ed9-a278-edf11c04793c","8e59573d-6180-4544-b1ed-5414690c0235","d17c71ab-35c4-4341-9686-d0f6eb31bc67","ad82796c-58fb-41ea-8bdd-a0eebda0e3c9","8faa66bf-f4bc-456e-a104-98ddc316dd90","9405dadc-aefb-40fe-a0e3-c33dbf0936b2","78ac20dc-65f5-45f1-850b-04242c08d0b9","3893c820-3e45-47a3-8999-5f7eda5bd7d3",{"_44":424,"_32":425,"_30":426,"_382":-5,"_42":43,"_41":427,"_384":60,"_39":428,"_13":64,"_34":417,"_36":-5,"_24":25,"_389":-5,"_27":429},{"_44":419,"_32":420,"_30":421,"_382":-5,"_42":43,"_41":402,"_384":60,"_39":422,"_13":64,"_34":417,"_36":-5,"_24":25,"_389":-5,"_27":423},{"_44":412,"_32":413,"_30":414,"_382":-5,"_42":43,"_41":415,"_384":60,"_39":416,"_13":64,"_34":417,"_36":-5,"_24":25,"_389":-5,"_27":418},{"_44":406,"_32":407,"_30":408,"_382":-5,"_42":43,"_41":402,"_384":60,"_39":409,"_13":64,"_34":20,"_36":410,"_24":25,"_389":-5,"_27":411},{"_44":399,"_32":400,"_30":401,"_382":-5,"_42":43,"_41":402,"_384":60,"_39":403,"_13":64,"_34":20,"_36":404,"_24":25,"_389":-5,"_27":405},{"_44":391,"_32":392,"_30":393,"_382":-5,"_42":43,"_41":394,"_384":60,"_39":395,"_13":64,"_34":396,"_36":397,"_24":25,"_389":-5,"_27":398},{"_44":380,"_32":381,"_30":58,"_382":-5,"_42":43,"_41":383,"_384":25,"_39":385,"_13":386,"_34":387,"_36":388,"_24":25,"_389":-5,"_27":390},"5fd5ab44-ef27-491b-8641-fcfb45f65af7","index.ts","parentId",306,"latest",["D",1788370273002],46,"http","import { immutableFileUrl, parseVal, serveFile, serveImmutableFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { Root } from \"./frontend/root.tsx\";\nimport {\n getMenu,\n getAlertasInsumos,\n buscarPrecioProducto,\n descontarInsumos,\n enviarAlertaInsumos,\n registrarPedidoEnSheet,\n registrarResumenPedidoEnSheet,\n listarHistorialPedidos,\n buscarPedidoCobradoEnSheet,\n calcularCorte,\n listarInsumosParaSeleccion,\n registrarCompraInsumo,\n obtenerReporteProductos,\n} from \"./backend/negocio.ts\";\nimport {\n crearPedido,\n getPedidosAbiertos,\n agregarItem,\n quitarItem,\n cancelarPedido,\n obtenerPedido,\n eliminarPedidoActivo,\n setEnvio,\n} from \"./backend/pedidosActivos.ts\";\nimport { fechaHoyMX, formatearCorte, formatearTicket } from \"./backend/ticket.ts\";\nimport { obtenerFondoCaja, guardarFondoCaja } from \"./backend/caja.ts\";\n\nconst app = new Hono();\n\n// Serve the (never-cached) HTML shell at the root /\napp.get(\"/\", (c) => c.html(Root()));\n\n// Serve frontend files at the version-addressed URLs Root() stamps, cached immutably\napp.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path));\n\n// Logos: rutas simples (sin versionar) para que el componente cliente los pueda\n// referenciar directo con un

normal, sin depender de immutableFileUrl.\napp.get(\"/frontend/logo-wordmark.svg\", () => serveFile(\"/frontend/logo-wordmark.svg\"));\napp.get(\"/frontend/logo-icon.svg\", () => serveFile(\"/frontend/logo-icon.svg\"));\n\n// View source redirect\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// Pantalla de cocina: para dejar abierta en una tablet/celular en la cocina, mostrando los\n// pedidos abiertos en tiempo real (se refresca sola cada 5s). Es HTML+JS plano a propósito\n// (sin React) para que sea ligera y a prueba de fallos en cualquier dispositivo, por viejo que\n// sea, y para que nunca dependa de que la pantalla principal esté abierta en otro lado.\napp.get(\"/cocina\", (c) =>\n c.html(`\n\n\n\n\nSuchi House — Cocina\n\n\n\n

👨‍🍳 Suchi House — Cocina

\n\n\n\n`));\n\n// Manifest de PWA (para \"Agregar a pantalla de inicio\" en el celular). Se genera aquí\n// -no como archivo estático- para que el ícono siempre apunte a la versión actual del val.\napp.get(\"/manifest.json\", (c) =>\n c.json({\n name: \"Suchi House — Pedidos\",\n short_name: \"Suchi House\",\n description: \"Sistema de pedidos e inventario de Suchi House\",\n start_url: \"/\",\n scope: \"/\",\n display: \"standalone\",\n orientation: \"portrait\",\n background_color: \"#0d1f1e\",\n theme_color: \"#0d1f1e\",\n icons: [\n { src: immutableFileUrl(\"/frontend/logo-icon.svg\"), sizes: \"any\", type: \"image/svg+xml\", purpose: \"any maskable\" },\n ],\n }));\n\n/* ---------------- API ---------------- */\n\napp.get(\"/api/menu\", async (c) => {\n try {\n const menu = await getMenu();\n return c.json({ ok: true, menu });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.get(\"/api/insumos/alertas\", async (c) => {\n try {\n const alertas = await getAlertasInsumos();\n return c.json({ ok: true, alertas });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.get(\"/api/insumos/lista\", async (c) => {\n try {\n const insumos = await listarInsumosParaSeleccion();\n return c.json({ ok: true, insumos });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.post(\"/api/insumos/compra\", async (c) => {\n try {\n const { insumo, cantidad } = await c.req.json();\n const n = Number(cantidad);\n if (!insumo) return c.json({ ok: false, error: \"Falta el insumo\" }, 400);\n if (!isFinite(n) || n <= 0) return c.json({ ok: false, error: \"Cantidad inválida\" }, 400);\n const resultado = await registrarCompraInsumo(insumo, n);\n return c.json({ ok: true, ...resultado });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.get(\"/api/pedidos\", async (c) => {\n try {\n const pedidos = await getPedidosAbiertos();\n return c.json({ ok: true, pedidos });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.post(\"/api/pedidos\", async (c) => {\n try {\n const { tipo, identificador } = await c.req.json();\n if (!tipo) return c.json({ ok: false, error: \"Falta tipo\" }, 400);\n const id = await crearPedido(tipo, identificador || \"\");\n return c.json({ ok: true, id });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.post(\"/api/pedidos/:id/items\", async (c) => {\n try {\n const idPedido = c.req.param(\"id\");\n const { categoria, producto, cantidad } = await c.req.json();\n if (!producto) return c.json({ ok: false, error: \"Falta producto\" }, 400);\n const info = await buscarPrecioProducto(producto);\n if (!info) return c.json({ ok: false, error: `Producto no encontrado en el Menú: ${producto}` }, 404);\n const pedidos = await agregarItem(idPedido, categoria || info.categoria, producto, Number(cantidad) || 1, info.precio);\n return c.json({ ok: true, pedidos });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.delete(\"/api/pedidos/items/:rowId\", async (c) => {\n try {\n const rowId = c.req.param(\"rowId\");\n const pedidos = await quitarItem(rowId);\n return c.json({ ok: true, pedidos });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.post(\"/api/pedidos/:id/envio\", async (c) => {\n try {\n const idPedido = c.req.param(\"id\");\n const { monto } = await c.req.json();\n const n = Number(monto);\n if (!isFinite(n) || n < 0) return c.json({ ok: false, error: \"Monto de envío inválido\" }, 400);\n const pedido = await obtenerPedido(idPedido);\n if (!pedido) return c.json({ ok: false, error: \"Pedido no encontrado\" }, 404);\n if (pedido.tipo !== \"Domicilio\") return c.json({ ok: false, error: \"El envío solo aplica a pedidos a Domicilio\" }, 400);\n const pedidos = await setEnvio(idPedido, n);\n return c.json({ ok: true, pedidos });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.delete(\"/api/pedidos/:id\", async (c) => {\n try {\n const idPedido = c.req.param(\"id\");\n const pedidos = await cancelarPedido(idPedido);\n return c.json({ ok: true, pedidos });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.post(\"/api/pedidos/:id/cobrar\", async (c) => {\n try {\n const idPedido = c.req.param(\"id\");\n const body = await c.req.json().catch(() => ({}));\n const metodoPago: string = body.metodoPago || \"\";\n const atendioQuien: string = body.atendioQuien || \"\";\n if (!metodoPago) return c.json({ ok: false, error: \"Falta indicar el método de pago.\" }, 400);\n\n const pedido = await obtenerPedido(idPedido);\n if (!pedido) return c.json({ ok: false, error: \"Pedido no encontrado\" }, 404);\n if (pedido.items.length === 0) return c.json({ ok: false, error: \"Este pedido no tiene productos todavía.\" }, 400);\n if (pedido.tipo === \"Domicilio\" && (pedido.envio === null || pedido.envio === undefined)) {\n return c.json({ ok: false, error: \"Falta agregar el envío antes de cobrar este pedido a domicilio.\" }, 400);\n }\n\n const itemsPedido = pedido.items.map((it) => ({\n categoria: it.categoria,\n producto: it.producto,\n cantidad: it.cantidad,\n precioUnitario: it.precioUnitario,\n subtotal: it.subtotal,\n }));\n\n // El envío de domicilio se agrega como una línea más del pedido (sin receta, así que\n // descontarInsumos no le busca insumos) para que fluya solo por el registro en el Sheet,\n // el ticket y el total, sin duplicar lógica.\n if (pedido.tipo === \"Domicilio\" && pedido.envio) {\n itemsPedido.push({\n categoria: \"Envio\",\n producto: \"Envío a domicilio\",\n cantidad: 1,\n precioUnitario: pedido.envio,\n subtotal: pedido.envio,\n });\n }\n\n const total = itemsPedido.reduce((s, it) => s + it.subtotal, 0);\n\n const ahora = new Date();\n const fecha = ahora.toLocaleDateString(\"es-MX\", { timeZone: \"America/Mexico_City\" });\n const hora = ahora.toLocaleTimeString(\"es-MX\", { timeZone: \"America/Mexico_City\", hour: \"2-digit\", minute: \"2-digit\" });\n\n // 1) Registrar en Pedidos (Sheet) — el pedido activo NO se borra localmente\n // hasta que esto tenga éxito, para no perderlo si falla la escritura.\n await registrarPedidoEnSheet(idPedido, pedido.tipo, pedido.identificador, itemsPedido, fecha, hora, metodoPago, atendioQuien);\n\n // 1b) Registrar también en \"Pedidos Resumen\" (una sola fila por pedido, fácil de leer) —\n // si esto falla no debe tumbar el cobro, ya que \"Pedidos\" (arriba) es la fuente de\n // verdad real y ya quedó guardada.\n try {\n await registrarResumenPedidoEnSheet(idPedido, pedido.tipo, pedido.identificador, itemsPedido, fecha, hora, total, metodoPago, atendioQuien);\n } catch (e) {\n console.error(\"No se pudo escribir en Pedidos Resumen (el pedido ya se registró bien en Pedidos):\", e);\n }\n\n // Ya quedó registrado en el Sheet: ahora sí lo quitamos de \"activos\".\n await eliminarPedidoActivo(idPedido);\n\n // 2) Descontar insumos según Recetas y 3) enviar alerta por correo si algo quedó\n // BAJO (solo lo recién cruzado). El pedido YA quedó registrado en el Sheet arriba,\n // así que un problema aquí (Sheet lento, correo, etc.) nunca debe tumbar el cobro\n // ni impedir que aparezca la comanda/cuenta para imprimir.\n // El envío es una línea sin receta y sin empaque propio (no es un producto físico que se\n // sirva en un domo) — se excluye de descontarInsumos para no sumarle Domo/Estiquer de más.\n const itemsParaInsumos = itemsPedido.filter((it) => it.categoria !== \"Envio\");\n\n // El empaque (Domo + Estiquer / vaso-tapa de Ramen) aplica a todo lo que se va para llevar:\n // Domicilio y también \"Para llevar\" (mostrador). En Mesa/Barra se come en el local, sin empaque.\n const esParaLlevar = pedido.tipo === \"Domicilio\" || pedido.tipo === \"Para llevar\";\n\n let alertasNuevas: Awaited> = [];\n try {\n alertasNuevas = await descontarInsumos(itemsParaInsumos, esParaLlevar);\n if (alertasNuevas.length > 0) {\n await enviarAlertaInsumos(alertasNuevas);\n }\n } catch (e) {\n console.error(\"Error descontando insumos / enviando alerta (el pedido ya se registró bien):\", e);\n }\n\n // 4) Armar textos de Comanda y Cuenta\n const encabezado = pedido.tipo ? `${pedido.tipo}: ${pedido.identificador}\\n` : \"\";\n const comanda = `COMANDA — Pedido #${idPedido}\\n${encabezado}${fecha} ${hora}\\n------------------------\\n` +\n itemsPedido.map((it) => `${it.cantidad}x ${it.producto}`).join(\"\\n\");\n\n const cuenta = formatearTicket({ idPedido, pedido, itemsPedido, total, fecha, hora, metodoPago, atendioQuien });\n\n return c.json({ ok: true, comanda, cuenta, total, alertas: alertasNuevas });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\n/* ---------------- Historial, reimpresión de tickets y corte de caja ---------------- */\n\napp.get(\"/api/pedidos/historial\", async (c) => {\n try {\n const limit = Number(c.req.query(\"limit\")) || 50;\n const buscar = c.req.query(\"buscar\") || \"\";\n const pedidos = await listarHistorialPedidos(limit, buscar);\n return c.json({ ok: true, pedidos });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\n// IMPORTANTE: esta ruta va ANTES de \"/api/pedidos/:id/ticket\" — si no, Hono trataría \"ultimo\"\n// como si fuera el :id de la otra ruta y esta nunca se alcanzaría.\napp.get(\"/api/pedidos/ultimo/ticket\", async (c) => {\n try {\n const historial = await listarHistorialPedidos(1);\n if (historial.length === 0) {\n return c.json({ ok: false, error: \"Todavía no hay ningún pedido cobrado.\" }, 404);\n }\n const idPedido = historial[0].idPedido;\n const datos = await reconstruirTicketDesdeSheet(idPedido);\n if (!datos) return c.json({ ok: false, error: \"No se encontró el último pedido.\" }, 404);\n return c.json({ ok: true, ...datos });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.get(\"/api/pedidos/:id/ticket\", async (c) => {\n try {\n const idPedido = c.req.param(\"id\");\n const datos = await reconstruirTicketDesdeSheet(idPedido);\n if (!datos) return c.json({ ok: false, error: `No se encontró el pedido #${idPedido} (¿ya está cobrado?).` }, 404);\n return c.json({ ok: true, ...datos });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.get(\"/api/reportes/top-productos\", async (c) => {\n try {\n const dias = Number(c.req.query(\"dias\")) || 7;\n const reporte = await obtenerReporteProductos(dias);\n return c.json({ ok: true, reporte });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.get(\"/api/caja/fondo\", async (c) => {\n try {\n const fecha = c.req.query(\"fecha\") || fechaHoyMX();\n const monto = await obtenerFondoCaja(fecha);\n return c.json({ ok: true, fecha, monto });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.post(\"/api/caja/fondo\", async (c) => {\n try {\n const { fecha, monto } = await c.req.json();\n const n = Number(monto);\n if (!isFinite(n) || n < 0) return c.json({ ok: false, error: \"Monto de fondo de caja inválido\" }, 400);\n const fechaFinal = fecha || fechaHoyMX();\n await guardarFondoCaja(fechaFinal, n);\n return c.json({ ok: true, fecha: fechaFinal, monto: n });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\napp.get(\"/api/corte\", async (c) => {\n try {\n const fecha = c.req.query(\"fecha\") || fechaHoyMX();\n const resumen = await calcularCorte(fecha);\n const texto = formatearCorte(resumen);\n return c.json({ ok: true, resumen, texto });\n } catch (e) {\n return c.json({ ok: false, error: String(e) }, 500);\n }\n});\n\n/* ---------------- Ticket (para cliente, al cobrar) ---------------- */\n\n/** Reconstruye el ticket de un pedido YA COBRADO leyendo sus líneas directamente de la pestaña\n * Pedidos (no depende de la tabla local de pedidos activos, que ya se borró al cobrar). Se usa\n * para \"Reimprimir ticket\", tanto por ID como para el último cobrado. */\nasync function reconstruirTicketDesdeSheet(idPedido: string) {\n const pedido = await buscarPedidoCobradoEnSheet(idPedido);\n if (!pedido) return null;\n const cuenta = formatearTicket({\n idPedido: pedido.idPedido,\n pedido: { tipo: pedido.tipo, identificador: pedido.identificador },\n itemsPedido: pedido.itemsPedido,\n total: pedido.total,\n fecha: pedido.fecha,\n hora: pedido.hora,\n metodoPago: pedido.metodoPago,\n atendioQuien: pedido.atendioQuien,\n });\n return { idPedido: pedido.idPedido, cuenta, total: pedido.total };\n}\n\n// Unwrap and rethrow Hono errors as the original error\napp.onError((err) => Promise.reject(err));\n\nexport default app.fetch;\n","label",[381],"abf87f74-f1ea-4d74-adbd-a5c36bf7e192","corte-diario.ts","2a54411e-a6ba-11f1-afb1-1607ee4eb77e",265,["D",1788345392931],"interval","// Corte de caja automático diario: corre solo cada noche a la hora de cierre y le manda a\n// Noel por correo el corte del día, sin que tenga que abrir la app ni darle clic a nada.\n// Hora por defecto: 11:00pm hora CDMX (mañana Noel confirma la hora real de cierre y se\n// ajusta el cron con write_interval_settings — ver el comentario al fondo de este archivo).\nimport { email } from \"https://esm.town/v/std/email\";\nimport { calcularCorte } from \"./backend/negocio.ts\";\nimport { fechaHoyMX, formatearCorte } from \"./backend/ticket.ts\";\n\nexport default async function (interval: Interval) {\n const fecha = fechaHoyMX();\n const resumen = await calcularCorte(fecha);\n const texto = formatearCorte(resumen);\n\n // Si no hubo ningún pedido cobrado hoy, igual mandamos el correo (útil para confirmar que\n // el sistema sigue corriendo, y para detectar rápido si algo se quedó sin registrar).\n const asunto = resumen.numPedidos > 0\n ? `Suchi House — Corte de caja: $${resumen.totalVentas.toFixed(2)} (${resumen.numPedidos} pedidos)`\n : `Suchi House — Corte de caja: sin ventas hoy`;\n\n await email({\n subject: asunto,\n text: texto,\n });\n\n console.log(`Corte diario enviado para ${fecha}: $${resumen.totalVentas.toFixed(2)}, ${resumen.numPedidos} pedidos.`);\n}\n\n// Cron actual: \"0 5 * * *\" (05:00 UTC = 23:00 / 11pm hora CDMX, sin considerar horario de\n// verano — Val Town no lo ajusta solo). Para cambiar la hora, usar write_interval_settings\n// sobre este archivo con el nuevo cron expression en UTC.\n",[392],"79f1e00e-3a4b-4bc6-b2af-20c3e74f03d3","README.md","01a058f0-c40d-736f-b689-dd29e61e5e85",1,["D",1788198568874],"# React + Hono Starter\n\nA minimal starter template for building client-side React apps with a Hono\nbackend on Val Town. Click **Remix** to get your own copy.\n\n## Picking a starter\n\n| Starter | When to pick it |\n| --- | --- |\n| [`basic-html-starter`](https://www.val.town/x/templates/basic-html-starter) | Static HTML pages. Sprinkle of vanilla JS. No server-side rendering. |\n| [`hono-jsx-starter`](https://www.val.town/x/templates/hono-jsx-starter) | Dynamic server-rendered HTML with JSX. API routes. No React, no SPA. |\n| **[`react-hono-starter`](https://www.val.town/x/templates/react-hono-starter)** *(you're here)* | Client-side React SPA with a Hono API backend. |\n\n**Want to build UI?** Start writing React components in\n[`frontend/components/`](/frontend/components/). Import them into `App.tsx` and\nyou're good to go. Styling is [Twind](https://twind.style/) — just use Tailwind\nutility classes, zero config.\n\n**Want to add an API?** Add routes in [`index.ts`](/index.ts) (there's a\ncommented-out example). Fetch them from your React components.\n\n## Architecture\n\n```mermaid\ngraph LR\n Browser -->|\"GET /\"| Hono[\"index.ts
(Hono server)\"]\n Hono -->|serves| HTML[\"root.tsx\"]\n HTML -->|loads| Entry[\"index.tsx\"]\n Entry -->|renders| App[\"App.tsx\"]\n App -->|renders| Counter[\"Counter.tsx\"]\n```\n\n## File structure\n\n```\nindex.ts ← Hono backend (serves frontend + API routes)\nfrontend/\n root.tsx ← HTML shell (stamps immutable asset URLs)\n index.tsx ← React entrypoint (mounts )\n favicon.svg ← App icon\n components/\n App.tsx ← Root component (layout + view source link)\n Counter.tsx ← Example component with state\n```\n\n## How it works\n\n1. **`index.ts`** is the HTTP entrypoint — a Hono server that serves the\n frontend and any API routes you add.\n2. **`frontend/root.tsx`** is the HTML shell — it loads Twind and stamps\n immutable asset URLs for the favicon and React entrypoint.\n3. **`frontend/index.tsx`** mounts the React app.\n4. **`frontend/components/App.tsx`** is the root layout — add new components\n alongside it.\n5. **`frontend/components/Counter.tsx`** is an example stateful component —\n replace it with your own!\n\n## Next steps\n\n- Add API routes in `index.ts`\n- Add new components in `frontend/components/`\n- Add a SQLite database — see the\n [React Hono Example](https://www.val.town/x/stevekrouse/reactHonoExample) for\n a full-stack example with database, queries, and shared types\n\nTemplate updates and upgrade paths for existing remixes: [CHANGELOG.md](/CHANGELOG.md)\n",[400],"a81540c7-19be-49b2-bf27-9d4307e3abd0","CHANGELOG.md","01a058f0-c40d-736f-b689-da60c822ec3b",["D",1788198568874],"# Changelog\n\n## 2026-07-30 — Immutable asset caching\n\nFrontend files are now served at version-addressed URLs\n(`/__immutable/45/frontend/index.tsx`) with\n`Cache-Control: public, max-age=31536000, immutable`, so repeat visits load the\nwhole client graph from the browser cache — roughly 3× faster (~665ms → ~157ms\nmeasured). Publishing your val bumps its version, which changes every URL, so\ncaches invalidate automatically. Old-version URLs return 404 after a publish\n(like Next.js build assets); a reload picks up the new version.\n\nWhat changed in the template:\n\n- `frontend/index.html` → [`frontend/root.tsx`](/frontend/root.tsx): the HTML\n shell is now JSX and stamps asset URLs with `immutableFileUrl()`\n- [`index.ts`](/index.ts): serves `Root()` at `/`, and one\n `app.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path))` route\n serves all frontend files\n\n### Upgrading an existing remix\n\nYour copy of this template doesn't update automatically. Two options:\n\n**Minimal (most of the benefit):** point both routes at `serveImmutableFile` —\nyour existing bare URLs redirect into versioned space, the new route serves\nthem, and the whole module graph gets cached (costs one redirect per page view):\n\n```ts\nimport { serveImmutableFile } from \"https://esm.town/v/std/utils/index.ts\";\n\napp.get(\"/__immutable/*\", (c) => serveImmutableFile(c.req.path));\napp.get(\"/frontend/**/*\", (c) => serveImmutableFile(c.req.path)); // was serveFile\n```\n\n**Full upgrade (also removes the redirect):** three self-contained steps —\nno other files needed. Adjust the ``, favicon, and body of `Root()` to\nmatch your app's existing `index.html`, and stamp anything else your shell\nreferences directly (images, css) with `immutableFileUrl()`.\n\n1. Create `frontend/root.tsx`:\n\n```tsx\n/** @jsxImportSource npm:hono@4/jsx */\nimport { raw } from \"npm:hono@4/html\";\nimport { immutableFileUrl } from \"https://esm.town/v/std/utils/index.ts\";\n\n// The HTML shell for the app. It is never cached, so immutableFileUrl can stamp\n// the current val version into each asset URL — the browser caches those\n// immutably, and publishing the val changes the URLs, refetching exactly once.\nexport function Root() {\n return (\n <>\n {raw(\"<!DOCTYPE html>\")}\n <html lang=\"en\">\n <head>\n <meta charSet=\"UTF-8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n <title>React Hono Val Town Starter\n

Diff · v349