diff --git a/src/app/page.tsx b/src/app/page.tsx index e34994d..2eacb90 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -7,7 +7,10 @@ import { getModuleMeta, getStatusInfo, moduleUrl, + sectionOf, + SECTIONS, type ApiResponse, + type ModuleState, } from "@/lib/sam"; // Store externo: evita setState en efectos (regla react-hooks) @@ -69,6 +72,63 @@ export default function Home() { const modules = data?.modules ?? []; const backend = data?.backend; + const bySection: Record = {}; + modules.forEach((m) => { + const s = sectionOf(m.name); + if (!bySection[s]) bySection[s] = []; + bySection[s].push(m); + }); + + const renderModuleCard = (m: ModuleState) => { + const meta = getModuleMeta(m.name); + const status = getStatusInfo(m); + const url = moduleUrl(m); + const name = displayName(m.name); + return ( +
+
+ + + + + + + + +
+ + + + {name} + +
+ + + {status.label} · :{m.port} · {m.branch} + +
+ 		+ + + +
+
+
+ ); + }; + return ( <>
@@ -126,18 +186,7 @@ export default function Home() { {!loading && !error && (
-
-
- - Selección de Aplicación - - - {modules.length} módulo{modules.length !== 1 ? "s" : ""} - -
-
- - {modules.length === 0 ? ( + {modules.length === 0 && (
@@ -149,117 +198,90 @@ export default function Home() {
- ) : ( - modules.map((m) => { - const meta = getModuleMeta(m.name); - const status = getStatusInfo(m); - const url = moduleUrl(m); - const name = displayName(m.name); - return ( -
-
- - - - - - - - -
- - - - {name} - -
- - - {status.label} · :{m.port} · {m.branch} - -
- 		- - - -
-
-
- ); - }) )} - {backend && ( - <> -
-
- Backend & Sistema + {SECTIONS.map((section) => { + const list = bySection[section.id] ?? []; + const isSystem = section.id === "system"; + if (!isSystem && list.length === 0) return null; + return ( +
+
+
+
+ + {" "} + {section.title} + + {list.length > 0 && ( + + {list.length} módulo + {list.length !== 1 ? "s" : ""} + + )} +
+
+ + {list.map(renderModuleCard)} + + {isSystem && backend && ( + <> +
+
+ + + + + + + +
+ + + + API Backend + + + {backend.container ? "Activo" : "Detenido"} · {backend.branch} + +
+
+
+
+
+ + + + + + + +
+ + + + Gestionar Módulos + + + Subir / actualizar proyectos + +
+
+
+ + )}
-
-
- - - - - - - -
- - - - API Backend - - - {backend.container ? "Activo" : "Detenido"} · {backend.branch} - -
-
-
-
-
- - - - - - - -
- - - - Gestionar Módulos - - - Subir / actualizar proyectos - -
-
-
- - )} + ); + })}
diff --git a/src/lib/sam.ts b/src/lib/sam.ts index 3e1bd59..20b828e 100644 --- a/src/lib/sam.ts +++ b/src/lib/sam.ts @@ -167,3 +167,37 @@ export function displayName(name: string) { export function moduleUrl(m: ModuleState) { return `https://${m.subdomain}.devops.norteamericano.cl`; } + +// ============================================================ +// Secciones del índice: dónde aparece cada módulo. +// - Todo módulo nuevo cae en "apps" (Aplicaciones) automáticamente. +// - Para mover un módulo a otra sección, agrégalo a MODULE_SECTION. +// - Para crear una sección futura: agrega una entrada en SECTIONS +// (id, título, icono) y la regla en MODULE_SECTION o en +// sectionOf(). El índice la renderiza sola si tiene módulos. +// ============================================================ + +export interface Section { + id: string; + title: string; + icon: string; +} + +export const SECTIONS: Section[] = [ + { id: "apps", title: "Selección de Aplicación", icon: "bx-grid-alt" }, + { id: "system", title: "Backend & Sistema", icon: "bx-server" }, +]; + +const MODULE_SECTION: Record = { + // Ejemplos: + // contabilidad: "system", + // pagos: "system", +}; + +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"; +}