From 66ed0270438615158a0969d0a332567287607196 Mon Sep 17 00:00:00 2001
From: Nurfog <juan.allende@gmail.com>
Date: Tue, 8 Sep 2026 16:29:01 -0300
Subject: [PATCH] feat: categorias de integracion
 (pagina-web/sam/profesores/otras-apps) + badge prod/dev

---
 src/app/page.tsx        | 13 +++++++++----
 src/app/upload/page.tsx | 32 ++++++++++++++++++++++++++++++--
 src/lib/sam.ts          | 33 ++++++++++++++++++++-------------
 3 files changed, 59 insertions(+), 19 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 2eacb90..05a2ed0 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -4,6 +4,7 @@ import { useSyncExternalStore } from "react";
 import Link from "next/link";
 import {
   displayName,
+  envOf,
   getModuleMeta,
   getStatusInfo,
   moduleUrl,
@@ -74,7 +75,7 @@ export default function Home() {
 
   const bySection: Record<string, ModuleState[]> = {};
   modules.forEach((m) => {
-    const s = sectionOf(m.name);
+    const s = sectionOf(m.name, m.category);
     if (!bySection[s]) bySection[s] = [];
     bySection[s].push(m);
   });
@@ -82,6 +83,7 @@ export default function Home() {
   const renderModuleCard = (m: ModuleState) => {
     const meta = getModuleMeta(m.name);
     const status = getStatusInfo(m);
+    const env = envOf(m.branch);
     const url = moduleUrl(m);
     const name = displayName(m.name);
     return (
@@ -107,6 +109,9 @@ export default function Home() {
                     <small className="text-muted" style={{ fontSize: "0.75rem" }}>
                       {status.label} · :{m.port} · {m.branch}
                     </small>
+                    <span className={`badge ${env.cls} badge-respaldo`}>
+                      {env.label}
+                    </span>
                   </div>
                 </td>
                 <td className="text-end pe-3" style={{ width: 40 }}>
@@ -202,8 +207,8 @@ export default function Home() {
 
                 {SECTIONS.map((section) => {
                   const list = bySection[section.id] ?? [];
-                  const isSystem = section.id === "system";
-                  if (!isSystem && list.length === 0) return null;
+                  const isReview = section.id === "otras-apps";
+                  if (!isReview && list.length === 0) return null;
                   return (
                     <div className="col-12" key={section.id}>
                       <div className="row row-cards">
@@ -224,7 +229,7 @@ export default function Home() {
 
                         {list.map(renderModuleCard)}
 
-                        {isSystem && backend && (
+                        {isReview && backend && (
                           <>
                             <div className="col-md-6">
                               <div className="app-card p-2">
diff --git a/src/app/upload/page.tsx b/src/app/upload/page.tsx
index 9b7ed61..a219330 100644
--- a/src/app/upload/page.tsx
+++ b/src/app/upload/page.tsx
@@ -10,11 +10,14 @@ export default function UploadPage() {
     branch: "main",
     port: "",
     subdomain: "",
+    category: "otras-apps",
   });
   const [loading, setLoading] = useState(false);
   const [result, setResult] = useState<{ ok: boolean; message: string } | null>(null);
 
-  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const handleChange = (
+    e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>
+  ) => {
     setForm({ ...form, [e.target.name]: e.target.value });
   };
 
@@ -27,6 +30,7 @@ export default function UploadPage() {
       name: form.name.trim().toLowerCase(),
       repoUrl: form.repoUrl.trim(),
       branch: form.branch.trim() || "main",
+      category: form.category,
     };
     if (form.port) payload.port = parseInt(form.port, 10);
     if (form.subdomain) payload.subdomain = form.subdomain.trim();
@@ -43,7 +47,7 @@ export default function UploadPage() {
           ok: true,
           message: `Módulo "${payload.name}" registrado. Deploy: ${data.webhook ? "webhook creado" : "sin webhook"}${data.deployLog ? " · " + data.deployLog.slice(0, 80) : ""}`,
         });
-        setForm({ name: "", repoUrl: "", branch: "main", port: "", subdomain: "" });
+        setForm({ name: "", repoUrl: "", branch: "main", port: "", subdomain: "", category: "otras-apps" });
       } else {
         setResult({ ok: false, message: data.error || `Error HTTP ${res.status}` });
       }
@@ -188,6 +192,27 @@ export default function UploadPage() {
                     </div>
                   </details>
 
+                  <div className="col-md-6">
+                    <label className="form-label fw-semibold">
+                      ¿A qué corresponde? <span className="text-danger">*</span>
+                    </label>
+                    <select
+                      name="category"
+                      value={form.category}
+                      onChange={handleChange}
+                      required
+                      className="form-select"
+                    >
+                      <option value="pagina-web">Página Web</option>
+                      <option value="sam">SAM</option>
+                      <option value="profesores">Profesores</option>
+                      <option value="otras-apps">Otras Aplicaciones</option>
+                    </select>
+                    <div className="form-text">
+                      Define en qué sección del índice SAM aparece el módulo.
+                    </div>
+                  </div>
+
                   <div className="col-md-6">
                     <label className="form-label fw-semibold">Rama</label>
                     <input
@@ -197,6 +222,9 @@ export default function UploadPage() {
                       placeholder="main"
                       className="form-control"
                     />
+                    <div className="form-text">
+                      main = producción, otra rama = desarrollo.
+                    </div>
                   </div>
 
                   <div className="col-12 mt-2">
diff --git a/src/lib/sam.ts b/src/lib/sam.ts
index 20b828e..b6532f6 100644
--- a/src/lib/sam.ts
+++ b/src/lib/sam.ts
@@ -19,6 +19,7 @@ export interface ModuleState {
   subdomain: string;
   port: number;
   active: boolean;
+  category?: string;
   lastDeploy?: LastDeploy;
   container?: string | null;
 }
@@ -184,20 +185,26 @@ export interface Section {
 }
 
 export const SECTIONS: Section[] = [
-  { id: "apps", title: "Selección de Aplicación", icon: "bx-grid-alt" },
-  { id: "system", title: "Backend & Sistema", icon: "bx-server" },
+  { id: "pagina-web", title: "Página Web", icon: "bx-globe" },
+  { id: "sam", title: "SAM", icon: "bx-layer" },
+  { id: "profesores", title: "Profesores", icon: "bx-pencil" },
+  { id: "otras-apps", title: "Otras Aplicaciones", icon: "bx-cube" },
 ];
 
-const MODULE_SECTION: Record<string, string> = {
-  // Ejemplos:
-  // contabilidad: "system",
-  // pagos: "system",
-};
+// Categoría que pregunta la integración (default del deployer: otras-apps).
+// "Otras Aplicaciones" concentra la revisión prod/dev: módulos
+// integrados + backend + gestión.
+export function sectionOf(name: string, category?: string): string {
+  const c = (category || "").trim().toLowerCase();
+  if (c && SECTIONS.some((s) => s.id === c)) return c;
+  void name;
+  return "otras-apps";
+}
 
-export function sectionOf(name: string): string {
-  const key = name.toLowerCase();
-  if (MODULE_SECTION[key]) return MODULE_SECTION[key];
-  const known = SECTIONS.some((s) => s.id === key);
-  if (known) return key;
-  return "apps";
+// Rama main/master = producción, resto = desarrollo.
+export function envOf(branch: string) {
+  const b = (branch || "").trim().toLowerCase();
+  return b === "main" || b === "master" || b === "prod" || b === "production"
+    ? { label: "Prod", cls: "bg-success" }
+    : { label: "Dev", cls: "bg-warning text-dark" };
 }