Entur partner micro-frontend components

This package contains components, hooks and helpers for Entur partner micro-frontends.

Installation

npm install @entur-partner/micro-frontend

# or if you are using Yarn:
yarn add @entur-partner/micro-frontend

Usage

Register a micro-frontend

registerMicroFrontend listens for mount and unmount events on window. It calls mount and unmount when the event ID starts with microFrontendId. mount gets the element to render into and the payload from the app shell. The function returns another function that removes the listeners.

React:

import { registerMicroFrontend } from "@entur-partner/micro-frontend";
import { createRoot, type Root } from "react-dom/client";

let root: Root | undefined;

registerMicroFrontend({
	microFrontendId: "PermissionAdmin",
	mount: (mountPoint, payload) => {
		root = createRoot(mountPoint);
		root.render(<App {...payload} />);
	},
	unmount: () => {
		root?.unmount();
		root = undefined;
	},
});

Use registerPublicMicroFrontend in the same way for a micro-frontend that users can open without logging in. Its payload may not have user, getToken, organisationId or logout.