Warning

You're browsing the documentation for an old version of Webiny. Consider upgrading your project to Webiny 5.40.x.

Admin Area > Extending Functionality

Custom Providers

Learn how to add new React context providers in the Admin app.

Can I use this?

This feature is available since Webiny v5.35.0.

What you’ll learn

how to add new Admin app context providers

Add a Context Provider

To register a context provider, use the createProviderPlugin utility.

apps/admin/src/App.tsx
import React from "react";import { Admin, createProviderPlugin } from "@webiny/app-serverless-cms";import { Cognito } from "@webiny/app-admin-users-cognito";import "./App.scss";
const MyProviderPlugin = createProviderPlugin(Component => {  return function MyProvider({ children }) {    return (      <MyContextProvider>        <Component>{children}</Component>      </MyContextProvider>    );  };});
export const App: React.FC = () => {  return (    <Admin>      <Cognito />      <MyProviderPlugin />    </Admin>  );};

Providers can be used not only to register a global React context provider, but also to intercept the Admin app rendering and delay it until some condition is met.