Files
botino/public/lib/router.js
Lucas Tettamanti df9420b954 dashboard
2026-01-27 02:41:39 -03:00

129 lines
3.5 KiB
JavaScript

import { emit } from "./bus.js";
// Mapeo de rutas a vistas
const ROUTES = [
{ pattern: /^\/$/, view: "home", params: [] },
{ pattern: /^\/home$/, view: "home", params: [] },
{ pattern: /^\/chat$/, view: "chat", params: [] },
{ pattern: /^\/conversaciones$/, view: "conversations", params: [] },
{ pattern: /^\/usuarios$/, view: "users", params: [] },
{ pattern: /^\/usuarios\/([^/]+)$/, view: "users", params: ["id"] },
{ pattern: /^\/productos$/, view: "products", params: [] },
{ pattern: /^\/productos\/([^/]+)$/, view: "products", params: ["id"] },
{ pattern: /^\/equivalencias$/, view: "aliases", params: [] },
{ pattern: /^\/crosssell$/, view: "crosssell", params: [] },
{ pattern: /^\/crosssell\/([^/]+)$/, view: "crosssell", params: ["id"] },
{ pattern: /^\/cantidades$/, view: "quantities", params: [] },
{ pattern: /^\/pedidos$/, view: "orders", params: [] },
{ pattern: /^\/pedidos\/([^/]+)$/, view: "orders", params: ["id"] },
{ pattern: /^\/test$/, view: "test", params: [] },
{ pattern: /^\/config-prompts$/, view: "prompts", params: [] },
{ pattern: /^\/atencion-humana$/, view: "takeovers", params: [] },
{ pattern: /^\/configuracion$/, view: "settings", params: [] },
];
// Mapeo de vistas a rutas base (para navegación sin parámetros)
const VIEW_TO_PATH = {
home: "/home",
chat: "/chat",
conversations: "/conversaciones",
users: "/usuarios",
products: "/productos",
aliases: "/equivalencias",
crosssell: "/crosssell",
quantities: "/cantidades",
orders: "/pedidos",
test: "/test",
prompts: "/config-prompts",
takeovers: "/atencion-humana",
settings: "/configuracion",
};
/**
* Parsea el pathname y devuelve { view, params }
*/
export function parseRoute(pathname) {
const path = pathname || "/";
for (const route of ROUTES) {
const match = path.match(route.pattern);
if (match) {
const params = {};
route.params.forEach((name, i) => {
params[name] = match[i + 1];
});
return { view: route.view, params };
}
}
// Fallback a home si no matchea ninguna ruta
return { view: "home", params: {} };
}
/**
* Obtiene la ruta actual del browser
*/
export function getCurrentRoute() {
return parseRoute(window.location.pathname);
}
/**
* Navega a una nueva ruta sin recargar la página
*/
export function navigate(path, { replace = false } = {}) {
if (replace) {
history.replaceState(null, "", path);
} else {
history.pushState(null, "", path);
}
const route = parseRoute(path);
emit("router:change", route);
}
/**
* Navega a una vista (sin parámetros)
*/
export function navigateToView(view) {
const path = VIEW_TO_PATH[view] || "/";
navigate(path);
}
/**
* Navega a una vista con un ID específico
*/
export function navigateToItem(view, id) {
const basePath = VIEW_TO_PATH[view];
if (!basePath) return;
const path = id ? `${basePath}/${encodeURIComponent(id)}` : basePath;
navigate(path);
}
/**
* Inicializa el router - debe llamarse después de que los componentes estén listos
*/
export function initRouter() {
// Escuchar popstate (botón atrás/adelante del browser)
window.addEventListener("popstate", () => {
const route = getCurrentRoute();
emit("router:change", route);
});
// Emitir la ruta inicial
const route = getCurrentRoute();
emit("router:change", route);
return route;
}
export const router = {
parseRoute,
getCurrentRoute,
navigate,
navigateToView,
navigateToItem,
initRouter,
VIEW_TO_PATH,
};