@newfold/mfe-provider

<MFEProvider /> is a React Library for Jarvis Micro-Frontend (MFE) Applications that is designed to streamline the technology stack and solution architecture as the number of MFE applications grows.

Features

• MUI
• Error Boundary
• i18n and l10n support
• React Query
• DataDog (RUM and Logging)
• Host application & MFE context provider

Using the Library

Installation

$ yarn add "@newfold/mfe-provider"
# installing...

Wrapping your React application

import MFEProvider from '@newfold/mfe-provider';

const MyApp = () => (
  <MFEProvider>
    <App />
  </MFEProvider>
);

Using context

import { useMFEContext } from '@newfold/mfe-provider';

const Component = () => {
  const mfeContext = useMFEContext();

  // log context to see what values are available
  console.log('mfeContext', mfeContext);

  return (
    <h1>Hello world!</h1>
  );

Configuration

| Prop | Type | Description | | -------------------- | ----------------------- | ----------- | | children | oneOfType([node, func]) | | | history | shape({}) | | | hostingId | number | | | basename | string | | | hasErrorBoundary | bool | | | errorBoundaryConfig | shape({}) | | | hasI18N | bool | | | i18nConfig | shape({}) | | | hasDataDog | bool | | | dataDogConfig | shape({}) | | | hasReactQuery | bool | | | reactQueryConfig | shape({}) | | | hasMUI | bool | | | muiConfig | shape({}) | | | hasReactSuspense | bool | | | reactSuspenseConfig | shape({}) | | | hasReactRouterDom | bool | | | reactRouterDomConfig | shape({}) | |

Developing and contributing to MFE Provider

Building

Run nx build mfe-provider to build the lib into /dist/libs/mfe-provider.

Publishing

Navigate to the /dist/libs/mfe-provider directory, then use yarn publish to publish. Ensure the correct version is provided and that the repo is up-to-date with the correct version as well in the package.json file.

Running unit tests

Run nx test mfe-provider to execute the unit tests via Jest.