RouteManager - MastermindCMS Documentation

RouteManager is a small helper for client-side routing.

Export

routeManager

What it does

keeps a map of routes and the currently active route
navigates via history.pushState
resolves dynamic routes using URLPattern

Initialize and register routes

Register routes before calling loadRouteByCurrentUrl():

import { routeManager } from "msm-components/dist/services.js";

routeManager.init("My application");
routeManager.addRoute("/dashboard", "dashboard", "Dashboard");
routeManager.addRoute("/users/:id.html", "user", "User");
routeManager.loadRouteByCurrentUrl();

The route consists of a URL pattern, a panel key, and a translation key for the title.

routeManager.navigate("dashboard");
routeManager.navigate("user", "42.html");

const activeRoute = routeManager.getActiveRoute();
console.log(activeRoute.props.id); // "42"

Navigation uses history.pushState and handles browser back/forward through popstate. To resolve a URL before navigating:

const route = routeManager.getRouteByUrl(
  `${window.location.origin}/users/42.html`
);
if (route) console.log(route.panel, route.props);

Use disable() to temporarily disable navigation. removeActiveRoute() clears the saved route from sessionStorage.