Hosted Admin Portal Integration (hosted)
Admin Portal Integration
Embed the admin portal into your application by following this guide.
STEP 1: Import the Admin Portal
import { AdminPortal } from '@frontegg/react';
STEP 2: Add a Link to Open the Admin Portal
Bind an app link to open the Admin Portal
const handleClick = () => {
AdminPortal.openHosted();
};
<button onClick={handleClick}>Settings</button>
You are good to go! The admin portal should now be shown and you are on the part for a full self-served experience on your product.
Custom options
Supporting newer versions of
react-router
With the new react-router peer dependency, it is required to pass your
history
from theuseHistory
hook as another prop to theContextProvider
.
Here is an example of how to pass your history
from the useHistory
hook as another prop to the ContextProvider
:
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import './index.css';
import { createBrowserHistory } from "history";
import { FronteggProvider } from '@frontegg/react';
contextOptions={{
baseUrl: 'my-base-url',
clientId: 'my-client-id',
appId: 'my-app-id'
}}
const history = createBrowserHistory();
// Replace this with your app logo 👇
const headerImage = 'https://assets.frontegg.com/public-frontegg-assets/acme-logo.svg';
ReactDOM.render(
<Router history={history}>
<FronteggProvider history={history} contextOptions={contextOptions} headerImage={headerImage}>
<App />
</FronteggProvider>
<Router />,
document.getElementById('root')
);
You are good to go! You should now see the admin portal in your application and able to use our full self-served experience with your product.
Updated 16 days ago