routes updated

public/lib/router.js

@@ -0,0 +1,120 @@
+import { emit } from "./bus.js";
+
+// Mapeo de rutas a vistas
+const ROUTES = [
+  { pattern: /^\/$/, view: "chat", 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: [] },
+];
+
+// Mapeo de vistas a rutas base (para navegación sin parámetros)
+const VIEW_TO_PATH = {
+  chat: "/chat",
+  conversations: "/conversaciones",
+  users: "/usuarios",
+  products: "/productos",
+  aliases: "/equivalencias",
+  crosssell: "/crosssell",
+  quantities: "/cantidades",
+  orders: "/pedidos",
+  test: "/test",
+};
+
+/**
+ * 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 chat si no matchea ninguna ruta
+  return { view: "chat", 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,
+};